Incubator-echarts: heatmap-bmap报错:nullのプロパティ'type'を読み取れません

作成日 2016年11月04日  ·  3コメント  ·  ソース: apache/incubator-echarts

1行の要約

エラーヒートマップ-bmapの初期化時にnullのプロパティ'type'を読み取れません

バージョンと環境

  • EChartsバージョン:3.2.3
  • ブラウザの種類とバージョン(ブラウザのバージョン):Chrome 54
  • オペレーティングシステムの種類とバージョン(OSバージョン):Mac

EChartsオプション

option = {
   animation: false,
   bmap: {
       center: point,
       zoom: 14,
       roam: true
  },
  visualMap: {
      show: false,
      top: 'top',
      min: 0,
      max: 5,
      seriesIndex: 0,
      calculable: true,
      inRange: {
         color: ['blue', 'blue', 'green', 'yellow', 'red']
     }
 },
  series: [{
      type: 'heatmap',
      coordinateSystem: 'bmap',
      data: points,
      pointSize: 5,
      blurSize: 6
  }]
}

エラーメッセージは次のとおりです

angular.js:10467TypeError: Cannot read property 'type' of null
    at ExtendedClass.render (http://localhost:8080/entry/1.bundle.js:47297:26)
    at ECharts.<anonymous> (http://localhost:8080/entry/1.bundle.js:1037:24)
    at ExtendedClass.<anonymous> (http://localhost:8080/entry/1.bundle.js:2274:21)
    at Array.forEach (native)
    at each (http://localhost:8080/entry/1.bundle.js:2807:18)
    at ExtendedClass.eachSeries (http://localhost:8080/entry/1.bundle.js:2272:14)
    at ECharts.doRender (http://localhost:8080/entry/1.bundle.js:1034:18)
    at ECharts.update (http://localhost:8080/entry/1.bundle.js:521:23)
    at ECharts.prepareAndUpdate (http://localhost:8080/entry/1.bundle.js:654:35)
    at ECharts.echartsProto.setOption (http://localhost:8080/entry/1.bundle.js:309:45)

バグ追跡は次のとおりです

module.exports = require('../../echarts').extendChartView({

        type: 'heatmap',

        render: function (seriesModel, ecModel, api) {
            var visualMapOfThisSeries;
            ecModel.eachComponent('visualMap', function (visualMap) {
                visualMap.eachTargetSeries(function (targetSeries) {
                    if (targetSeries === seriesModel) {
                        visualMapOfThisSeries = visualMap;
                    }
                });
            });

            if (__DEV__) {
                if (!visualMapOfThisSeries) {
                    throw new Error('Heatmap must use with visualMap');
                }
            }

            this.group.removeAll();
            var coordSys = seriesModel.coordinateSystem;
            //  这里报错了 seriesModel中没有coordinateSystem属性导致取不到type
            if (coordSys.type === 'cartesian2d') {    
                this._renderOnCartesian(coordSys, seriesModel, api);
            }
            else if (isGeoCoordSys(coordSys)) {
                this._renderOnGeo(
                    coordSys, seriesModel, visualMapOfThisSeries, api
                );
            }
        },
        ..............
        ............

デバッグの結果、coordinateSystemの割り当てに問題があり、seriesModelにseriesModelプロパティがないことがわかりました。
問題が発生した場合は、時間をかけて問題を確認し、回答を楽しみにするか、解決策を提供してください。ありがとうございます。

最も参考になるコメント

bmapコンポーネントを導入しませんでしたか? https://github.com/ecomfe/echarts/tree/master/extension/bmap

全てのコメント3件

bmapコンポーネントを導入しませんでしたか? https://github.com/ecomfe/echarts/tree/master/extension/bmap

座標系をカレンダーに設定すると、このエラーも報告されます。

const options = {
        tooltip: {
          position: 'top'
        },
        visualMap: {
          min: 0,
          max: 1000,
          calculable: true,
          orient: 'horizontal',
          left: 'center',
          top: 'bottom'
        },
        calendar: {
          range: '2017',
          cellSize: ['auto', 20]
        },
        series: [{
          name: 'test',
          type: 'heatmap',
          coordinateSystem: 'calendar',
          data: this.chartData
        }]
      }

[後の世代に書かれた]
カレンダーコンポーネントを導入せずにVueプロジェクトで同じ問題が発生しました。ここにインポートできます。
image

このページは役に立ちましたか?
0 / 5 - 0 評価