Echarts在线免费图表

 
            var data = [
    [220, 182, 191, 234, 290, 330, 310],
    [225, 12, 151, 24, 210, 30, 210]
    ]

option = {
    title: [
        {
        text: 'Awesome Chart'
        },
        {
            id: 'viewbox',
            right: 0,
            top: 50,
            width: 100
        }
    ],
    legend: {
        data: ['one', 'two']
    },
    xAxis: {
        data: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat']
    },
    yAxis: {},
    brush: {
        throttleType: 'debounce',
        throttleDelay: 300,
    },
    series: [{
        name: 'one',
        type: 'scatter',
        data: data[0]
    },
    {
        name: 'two',
        type: 'line',
        data: data[1]
    }
    ]
};
myChart.on('brushselected', renderBrushed);

function renderBrushed(params){
    if (!params.batch[0].selected[0]) {
        return
    }
    var mainSeries = params.batch[0].selected[0];
    var selectedItems = [];
    var count = 0;
    for (var i = 0; i < mainSeries.dataIndex.length; i++) {
        var rawIndex = mainSeries.dataIndex[i];
        var dataItem = data[0][rawIndex];
        count++;
        selectedItems.push(dataItem);
    };
    this.setOption({
        title:{
            id: 'viewbox',
            text: count ? '选中了' + count + '个数据' : '',
            subtext: count ? '选中的数据为 ' + selectedItems.join('、') : ''
        }
    })
}