qiuweikangdev / taro-react-echarts

🎉 基于Taro3、React的H5和微信小程序多端图表组件
MIT License
202 stars 8 forks source link

请问有echart地图的demo吗?官方的拿过来一直报错 #27

Open Zhangbu opened 1 year ago

Zhangbu commented 1 year ago

请问有echart地图的demo吗?官方的拿过来一直报错

qiuweikangdev commented 1 year ago

报什么错呢

Zhangbu commented 1 year ago

报什么错呢 刚看到,官方写法就是这个页面里 https://echarts.apache.org/examples/zh/editor.html?c=map-HK 我改成这样的 const getMapCityByYearOptions: EChartOption = ( mapData: { value: string; name: string; grade: number }[], cityMap = {}, ) => { // 注册广东地图数据 echarts.registerMap('GuangDong', GeoJsonOfGD);

return {
  title: {},
  tooltip: {
    trigger: 'item',
  },
  toolbox: {},
  visualMap: [
    {
      right: 20,
      bottom: 100,
      type: 'piecewise',
      pieces: [

        { min: 30000 },
        { min: 10000, max: 30000 },
        { min: 5000, max: 10000 },
        { min: 1000, max: 5000 },
        { min: 500, max: 1000 },
        { min: 200, max: 500 },
        { min: 0, max: 200 },
      ],   
      align: 'left',        
      borderColor: 'rgba(0,159,159,0.5)',
      borderWidth: 1,
      inRange: {
        color: ['#028282', '#4EADAD', '#05BBBB', '#20CBCB', '#74CDCD', '#15E3E3', '#B1E8E8'],
      },
    },
  ],
  series: [
    {
       data: [
        { name: '广州', value: 1100 },
         { name: '深圳', value: 710 },
        { name: '东莞', value: 510 },
        { name: '佛山', value: 310 },
        { name: '惠州', value: 160 },
        { name: '汕头', value: 60 },
         { name: '湛江', value: 30 },
      ],
      name: '地市分类',
      type: 'map',
      map: 'GuangDong',
      zoom: 1.2,

      aspectScale: 1,
      label: {
        show: true,
      },
    },
  ],
};

};

页面上是这样 <Echarts echarts={echarts} option={getMapCityByYearOptions()} ref={echartsRef}

报这些错 VM1145 WAService.js:1 TypeError: Cannot read property 'init' of undefined at index.js:3 at new Promise () at _callee$ (index.js:3) at tryCatch (taro.js:481) at Generator.invoke [as _invoke] (taro.js:461) at Generator.t. [as next] (taro.js:500) at asyncGeneratorStep (index.js:3) at _next (index.js:3) at index.js:3 at new Promise ()(env: macOS,mp,1.06.2301160; lib: 2.30.2)

qiutian00 commented 11 months ago

报什么错呢 刚看到,官方写法就是这个页面里 https://echarts.apache.org/examples/zh/editor.html?c=map-HK 我改成这样的 const getMapCityByYearOptions: EChartOption = ( mapData: { value: string; name: string; grade: number }[], cityMap = {}, ) => { // 注册广东地图数据 echarts.registerMap('GuangDong', GeoJsonOfGD);

return {
  title: {},
  tooltip: {
    trigger: 'item',
  },
  toolbox: {},
  visualMap: [
    {
      right: 20,
      bottom: 100,
      type: 'piecewise',
      pieces: [

        { min: 30000 },
        { min: 10000, max: 30000 },
        { min: 5000, max: 10000 },
        { min: 1000, max: 5000 },
        { min: 500, max: 1000 },
        { min: 200, max: 500 },
        { min: 0, max: 200 },
      ],   
      align: 'left',        
      borderColor: 'rgba(0,159,159,0.5)',
      borderWidth: 1,
      inRange: {
        color: ['#028282', '#4EADAD', '#05BBBB', '#20CBCB', '#74CDCD', '#15E3E3', '#B1E8E8'],
      },
    },
  ],
  series: [
    {
       data: [
        { name: '广州', value: 1100 },
         { name: '深圳', value: 710 },
        { name: '东莞', value: 510 },
        { name: '佛山', value: 310 },
        { name: '惠州', value: 160 },
        { name: '汕头', value: 60 },
         { name: '湛江', value: 30 },
      ],
      name: '地市分类',
      type: 'map',
      map: 'GuangDong',
      zoom: 1.2,

      aspectScale: 1,
      label: {
        show: true,
      },
    },
  ],
};

};

页面上是这样

报这些错 VM1145 WAService.js:1 TypeError: Cannot read property 'init' of undefined at index.js:3 at new Promise () at _callee$ (index.js:3) at tryCatch (taro.js:481) at Generator.invoke [as _invoke] (taro.js:461) at Generator.t. [as next] (taro.js:500) at asyncGeneratorStep (index.js:3) at _next (index.js:3) at index.js:3 at new Promise ()(env: macOS,mp,1.06.2301160; lib: 2.30.2)

没有正常引入echarts吧, 我这边用正常