export function runBeforePaintRule()

in src/rule/runRule.ts [125:235]


export function runBeforePaintRule(chartObj: any, config: any, data: any) {
  if (!chartObj.chartRule) {
    return;
  }
  // 状态:error > loading > empty
  // error
  if (chartObj?.props?.errorInfo && !chartObj.props.children) {
    // 设置背景色
    if (chartObj.chartRule.emptyData === EmptyDataProcess.Background) {
      chartObj.chartDom.style.backgroundColor = themes['widgets-color-layout-background'];
    }
    // 加错误提示
    chartObj.chart.annotation().html({
      html: `
          <div style="display: flex; align-items: center;">
            <svg width="13.990234375px" height="13.990234375px" viewBox="0 0 13.990234375 13.990234375">
              <g>
                <path
                  d="M13.2992,4.0833C12.1972,1.5882,9.71352,0.00200162,6.99922,0C5.33879,-0.00111527,3.72987,0.576434,2.44922,1.6333L12.3659,11.55C14.1045,9.4635,14.497,6.5439,13.2992,4.0833ZM11.55,12.3667L1.6333,2.44995C0.576382,3.73057,-0.00117366,5.33951,0,6.99995C0.00200179,9.71425,1.5883,12.198,4.0833,13.3C6.544,14.4978,9.4635,14.1053,11.55,12.3667Z"
                  fillRule="evenodd"
                  fill="${themes['widgets-error-svg-color']}"
                />
              </g>
            </svg>
            <span style="font-size: 12px;color: #808080; margin-left: 5px;">${chartObj.props?.errorInfo}<span>
          </div>
        `,
      alignX: 'middle',
      alignY: 'middle',
      position: ['50%', '50%'],
    });
  }
  // loading
  else if (chartObj?.props?.loading && !chartObj.props.children) {
    // 设置背景色
    if (chartObj.chartRule.emptyData === EmptyDataProcess.Background) {
      chartObj.chartDom.style.backgroundColor = themes['widgets-color-layout-background'];
    }

    // 加loading提示
    const prefix = `${PrefixName}-wplaceholder-loading`;
    chartObj.chart.annotation().html({
      html: `
    <div class="${prefix}" style="background: none;">
      <div class="${prefix}-right-tip">
      <div class="${prefix}-indicator">
        <div class="${prefix}-fusion-reactor">
          <span class="${prefix}-dot"></span>
          <span class="${prefix}-dot"></span>
          <span class="${prefix}-dot"></span>
          <span class="${prefix}-dot"></span>
        </div>
      </div>
      <div class="${prefix}-tip-content">${getText(
        'loading',
        chartObj.props?.language || chartObj.context.language,
        chartObj.context.locale,
      )}</div>
    </div>
  </div>
      `,
      alignX: 'middle',
      alignY: 'middle',
      position: ['50%', '50%'],
    });
  }
  // 空数据处理
  else if (chartObj.isEmpty && !chartObj.props.children) {
    // 设置背景色
    if (chartObj.chartRule.emptyData === EmptyDataProcess.Background) {
      chartObj.chartDom.style.backgroundColor = themes['widgets-color-layout-background'];
    }

    // 加暂无数据提示
    chartObj.chart.annotation().html({
      html: `
          <div style="display: flex; align-items: center;">
            <svg width="14px" height="14px" viewBox="0 0 1024 1024"><path d="M512 64c247.424 0 448 200.576 448 448s-200.576 448-448 448-448-200.576-448-448 200.576-448 448-448z m11.2 339.2h-64l-1.3888 0.032A32 32 0 0 0 427.2 435.2l0.032 1.3888A32 32 0 0 0 459.2 467.2h32v227.2H448l-1.3888 0.032A32 32 0 0 0 448 758.4h140.8l1.3888-0.032A32 32 0 0 0 588.8 694.4h-33.6V435.2l-0.032-1.3888A32 32 0 0 0 523.2 403.2zM512 268.8a44.8 44.8 0 1 0 0 89.6 44.8 44.8 0 0 0 0-89.6z" fill="#AAAAAA"></path></svg>
            <span style="font-size: 12px;color: #808080; margin-left: 5px;">${getText(
              'empty',
              chartObj.props?.language || chartObj.context.language,
              chartObj.context.locale,
            )}<span>
          </div>
        `,
      alignX: 'middle',
      alignY: 'middle',
      position: ['50%', '50%'],
    });
  } else {
    // 当不是无数据状态时需要删除对应背景色
    chartObj.chartDom.style.removeProperty('background-color');
  }

  // 大数据处理
  // if (
  //   isBigDataBeforePaint(
  //     chartObj?.chartRule?.name,
  //     chartObj?.chartRule?.bigData?.judgements,
  //     chartObj.chart,
  //     chartObj.dataSize,
  //     chartObj.chartRule.mainAxis,
  //   )
  // ) {
  //   chartObj.isBigData = true;
  //   // 渲染前只有提示信息,不进行大数据处理
  // }
  // else {
  //   chartObj.isBigData = false;
  // }
}