[Bug] 安装最新版本的库按照官网示例直接报错

tangguo13 commented 1 month ago

Version

1.11.8

Link to Minimal Reproduction

no

Steps to Reproduce

第一步：npm install @visactor/taro-vchart

第二步： import VChart from '@visactor/taro-vchart'; import React, { useState } from "react"; import { View } from '@tarojs/components';

// 定义 props 接口 interface Props { dataSource: any; }

const BarChart: React.FC = (_props) => { // 1. 准备图表配置项与数据 const [spec, setSpec] = useState({ data: [ { id: 'data1', values: [ { value: 335, name: '直接访问' }, { value: 310, name: '邮件营销' }, { value: 274, name: '联盟广告' }, { value: 235, name: '视频广告' }, { value: 400, name: '搜索引擎' } ] } ], type: 'pie', outerRadius: 0.6, innerRadius: 0.5, categoryField: 'name', valueField: 'value', legends: { visible: true } });

// 向Chart组件, 传递参数. return ( <View style={{ border: '1px solid #eeeeee', width: '90vw' }}

<VChart type="weapp" spec={spec} canvasId="pie" style={{ height: '35vh', width: '100%' }} onChartInit={() => { console.log('init pie'); } } onChartReady={() => { console.log('ready pie'); } } onChartUpdate={() => { console.log('update pie'); } } /> ); };

export default BarChart

Current Behavior

我想通过官网的demo实现对应的图表结果控制台报错了

Expected Behavior

希望能直接实现官网上显示的效果

Environment

-微信开发工具

Any additional comments?

No response

xiaoluoHe commented 1 month ago

1.11.8 版本，使用 issue 中的代码，没有复现问题，请提供下可以复现的 demo

tangguo13 commented 1 month ago

好的谢谢我创建了一个分支 2971可以复现这个问题 git clone https://gitee.com/tangguo13/v-chart-demo.git

xiaoluoHe commented 1 month ago

版本先降级到 1.11.1 试一下，我们再排查下

VChartSimple 组件需要传自定义加载的 VChart

<VChartSimple
    type={Taro.getEnv() as any}
    style={{ width: "100%", height: "150px" }}
    spec={spec}
    canvasId="bar-chart"
   // 这个遗漏了
    chartConstructor={VChart}
    onChartReady={() => {
      console.log("onChartReady");
    }}
/>

xiaoluoHe commented 1 month ago

1.11.10 版本已修复，可以试一下

VisActor / VChart