Incubator-echarts: Webpack+Vue项目中如何使用dataTool

[stevenyvette]

One-line summary [问题简述]

1. npm install echarts后，在.vue文件中 import echarts from 'echarts' ，在使用 dataTool解析.gexf文件时报错。原因是dataTool没有引用挂载。
   看了下node_modules/echarts里包含了extension/dataTool，不知道为什么没有成功挂载？？

2. 顺便问一声如何加入dark.js之类的主题

Version & Environment [版本及环境]

• ECharts version [ECharts 版本]:3.8.2
• Browser version [浏览器类型和版本]:chrome 62.0.3
• OS Version [操作系统类型和版本]: MacOS Sierra

Expected behaviour [期望结果]

成功挂载dataTool以及各类主题

[stevenyvette]

使用

• 是一种解决方式，但webpack应该如何搞定？？

[pissang]

试试

import dataTool from 'echarts/dist/extension/dataTool'

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[tenadolanter]

This is a example of dataTool, it worked for me well, hope helpfull to you as well !

import echarts from 'echarts'
import dataTool from 'echarts/extension/dataTool'

var data = dataTool.prepareBoxplotData([
    [40000, 5000, 30000],
    [20000, 3500, 15000],
    [35000, 5000, 18000],
    [30000, 3500, 15000]
])
var chartOption = {
    tooltip: {
        trigger: 'item',
        axisPointer: {
            type: 'shadow'
        }
    },
    grid: {
        left: '10%',
        right: '10%',
        bottom: '15%'
    },
    xAxis: {
        type: 'category',
        data: ['店长', '收银', '高级美容顾问', '美容顾问'],
        boundaryGap: true,
        nameGap: 30,
        splitArea: {
            show: false
        },

        splitLine: {
            show: false
        }
    },
    yAxis: {
        type: 'value',
        name: 'Bonus',
        splitArea: {
            show: true
        }
    },
    series: [
        {
            name: 'boxplot',
            type: 'boxplot',
            data: data.boxData,
            tooltip: {
                formatter: function (param) {
                    return [
                        'Job: ' + param.name,
                        'upper: ' + param.data[5],
                        'median: ' + param.data[3],
                        'lower: ' + param.data[1]
                    ].join('<br/>')
                }
            }
        },
        {
            name: 'Job',
            type: 'scatter',
            data: [30080, 16229, 20900, 19320]
        },
        {
            name: 'Job',
            type: 'scatter',
            data: [30080, 16229, 18800, 12500]
        },
        {
            name: 'Job',
            type: 'scatter',
            data: [30080, 16229, 21600, 15000]
        },
        {
            name: 'Job',
            type: 'scatter',
            data: [30080, 16229, 12420, 18200]
        },
        {
            name: 'Job',
            type: 'scatter',
            data: [30080, 16229, 10420, 8020]
        }
    ]
}