echars使用（5）直方图

在vue框架中，我们将展示如何使用echars实现直方图。

假如我们一组数据keys，value，
其中keys，value表示关键值及其频数，我们要将它们展示为统计直方图。

var chartDom = document.getElementById('id');
var myChart = echarts.init(chartDom);
var option;

option = {
    xAxis: {
        type: 'category',
        data: keys
    },
    yAxis: {
        type: 'value'
    },
    dataZoom: [{
        type: 'inside',
        start: 0,
        end: 100
    },
    {
        show: true,
        type: 'slider',
        top: '90%',
        start: 0,
        end: 100
    }],
    series: [{
        data: value,
        type: 'bar'
    }]
};

option && myChart.setOption(option);

其实现的图类似如下所示：