學(xué)習(xí) echars 4 使用 dataset 設(shè)置結(jié)果集圖表不顯示？

這是從官網(wǎng)上copy的事例
1、按需引入

let echarts = require('echarts/lib/echarts');
// 引入柱狀圖組件
require('echarts/lib/chart/bar');
// 引入提示框和title組件
require('echarts/lib/component/tooltip');
require('echarts/lib/component/title');

2、初始化圖表

  mounted () { 
        this.drawLine();
  },
  drawLine() {
            // 基于準(zhǔn)備好的dom，初始化echarts實(shí)例
            let myChart = echarts.init(document.getElementById('myChart'));
            // 繪制圖表
            var option =   {
                dataset: {
                    source: [
                        ['score', 'amount', 'product'],
                        [89.3, 58212, 'Matcha Latte'],
                        [57.1, 78254, 'Milk Tea'],
                        [74.4, 41032, 'Cheese Cocoa'],
                        [50.1, 12755, 'Cheese Brownie'],
                        [89.7, 20145, 'Matcha Cocoa'],
                        [68.1, 79146, 'Tea'],
                        [19.6, 91852, 'Orange Juice'],
                        [10.6, 101852, 'Lemon Juice'],
                        [32.7, 20112, 'Walnut Brownie']
                    ]
                },
                xAxis: {},
                yAxis: {type: 'category'},
                series: [
                    {
                        type: 'bar',
                        encode: {
                            // 將 "amount" 列映射到 X 軸。
                            x: 'amount',
                            // 將 "product" 列映射到 Y 軸。
                            y: 'product'
                        }
                    }
                ]
            };

            myChart.setOption(option, true);
        },
 最終的結(jié)果

回答

編輯回答

蟲児飛

我也遇到了這個問題，原來echarts 是3.x版本的，為使用dataset升級到了4.x，但發(fā)現(xiàn)不出圖，只顯示 X、Y坐標(biāo)，我的原因是使用webpack單獨(dú)打包了第三方的包到一個單獨(dú)的文件

# webpack.config.js

...
new AddAssetHtmlPlugin({
      filepath: require.resolve('../html/vendors/vendor.dll.js'),
      hash: false,
      includeSourcemap: false,
    }),
...

在升級之后并沒有去更新這個文件，導(dǎo)致使用的其實(shí)還是3.x的echart。

2017年8月2日 03:29

編輯回答