0

我无法解决这个问题。我在 Next.js 中使用带有 googlecharts 的 webdatarocks。当我将枢轴设计更改为平面模式时，在我的组件中执行此代码时出现错误：

window.webdatarocks.googlecharts.getData(
        { type: props?.chartType },
        drawChart,
        drawChart
      );

这是drawChart函数：

  const drawChart = (_data) => {
    console.log("DRAW CHART", _data);
    setData(_data?.data?.length ? _data.data : []);
    setDataReady(true);
    setTitle(_data?.options?.title);
  };

这是我的图表组件 (import { Chart } from "react-google-charts";) 返回：

<Chart
  id={props.chartContainerId}
  loader={<CircularProgress />}
  chartType={ChartTypes[props?.chartType]}
  options={{ title: title, height: props?.height || 500 }}
  data={data}
  width="100%"
/>

我的 package.json 依赖项：

"react-google-charts": "^4.0.0",
"react-webdatarocks": "^1.4.4",
"webdatarocks": "1.4.2",

这是错误：

错误类型错误：无法在 d.getData (webdatarocks.js?9fcc:174:164) 在 h.getData (webdatarocks) 处读取 d.zx (webdatarocks.js?9fcc:176:131) 处未定义的属性.js?9fcc:156:356) 在 k.getData (webdatarocks.js?9fcc:1082:273) 在 Object.PivotApi.k.getData (webdatarocks.js?9fcc:1089:292) 在 Object.WebDataRocksGooglecharts.getData ( webdatarocks.googlecharts.js?0db4:31:1) 在 getData (GoogleChartReact.js?8bed:23:26) 在 eval (GoogleChartReact.js?8bed:7:6) 在 invokePassiveEffectCreate (react-dom.development.js?ac89 :23487:1) 在 HTMLUnknownElement.callCallback (react-dom.development.js?ac89:3945:1) 在 HTMLUnknownElement.dispatchEvent () 在 Object.invokeGuardedCallbackDev (react-dom.development.js?ac89:3994:1) 在在 flushPassiveEffectsImpl (react-dom.development.js?ac89:23574:1) 在 flushPassiveEffects (react-dom.development.js?ac89:23447: runWithPriority$1 (react-dom.development.js?ac89:11276:1) 1) 在不稳定_runWithPriority (scheduler.development.js?c964:468:1) 的 eval (react-dom.development.js?ac89:11327:1) 的 performSyncWorkOnRoot (react-dom.development.js?ac89:22269:1) ) 在 runWithPriority$1 (react-dom.development.js?ac89:11276:1) 在 flushSyncCallbackQueueImpl (react-dom.development.js?ac89:11322:1) 在 flushSyncCallbackQueue (react-dom.development.js?ac89:11309 :1) 在discreteUpdates$1 (react-dom.development.js?ac89:22420:1) 在discreteUpdates (react-dom.development.js?ac89:3756:1) 在dispatchDiscreteEvent (react-dom.development.js?ac89 :5889:1)development.js?ac89:11276:1) 在 flushPassiveEffects (react-dom.development.js?ac89:23447:1) 在 performSyncWorkOnRoot (react-dom.development.js?ac89:22269:1) 在 eval (react-dom .development.js?ac89:11327:1) 在 stable_runWithPriority (scheduler.development.js?c964:468:1) 在 runWithPriority$1 (react-dom.development.js?ac89:11276:1) 在 flushSyncCallbackQueueImpl (react-dom .development.js?ac89:11322:1) 在flushSyncCallbackQueue (react-dom.development.js?ac89:11309:1) 在discreteUpdates$1 (react-dom.development.js?ac89:22420:1) 在discreteUpdates (react -dom.development.js?ac89:3756:1) 在 dispatchDiscreteEvent (react-dom.development.js?ac89:5889:1)development.js?ac89:11276:1) 在 flushPassiveEffects (react-dom.development.js?ac89:23447:1) 在 performSyncWorkOnRoot (react-dom.development.js?ac89:22269:1) 在 eval (react-dom .development.js?ac89:11327:1) 在 stable_runWithPriority (scheduler.development.js?c964:468:1) 在 runWithPriority$1 (react-dom.development.js?ac89:11276:1) 在 flushSyncCallbackQueueImpl (react-dom .development.js?ac89:11322:1) 在flushSyncCallbackQueue (react-dom.development.js?ac89:11309:1) 在discreteUpdates$1 (react-dom.development.js?ac89:22420:1) 在discreteUpdates (react -dom.development.js?ac89:3756:1) 在 dispatchDiscreteEvent (react-dom.development.js?ac89:5889:1)1) 在 flushSyncCallbackQueueImpl (react-dom.development.js?ac89:11322: 1) 在离散更新 (react-dom.development.js?ac89: 3756:1) 在 dispatchDiscreteEvent (react-dom.development.js?ac89:5889:1)1) 在 flushSyncCallbackQueueImpl (react-dom.development.js?ac89:11322: 1) 在离散更新 (react-dom.development.js?ac89: 3756:1) 在 dispatchDiscreteEvent (react-dom.development.js?ac89:5889:1)development.js?ac89:5889:1)development.js?ac89:5889:1)

4

1 回答 1

0

仅以紧凑/经典形式支持 getData API 调用，以便返回图表的预聚合数据。

于 2022-02-28T15:49:46.660 回答