echars时间轴

2018-07-24  本文已影响0人  IT小池

代码如下:

// 基于准备好的dom,初始化echarts实例
var myChart = echarts.init(document.getElementById('box'));
var option = {
    title: {
        text: '带份收益统计',
    },
    tooltip: {
        trigger: 'axis',
        formatter: function (params) {
         // 自定义提示框
            var res = '<div><p>';
            for(var i=0;i<params.length;i++){
                res += params[i].data[0]+'</p>';
                res += '<p>收益:'+params[i].data[1]+'</p>';
                res += '<p>关注的公众号数量:'+params[i].data[2]+'个</p>';
            }
            return res+='</div>';
        }
    },
    xAxis: {
        type: 'time',
        boundaryGap:false,
        axisLabel: {
            formatter: function(value, index){
                // 格式化成月/日,只在第一个刻度显示年份
                var date = new Date(value);
                var texts = [(date.getMonth() + 1), date.getDate()];
                if (index === 0) {
                    texts.unshift(date.getFullYear());
                }
                return texts.join('-');
            }
        }
    },
    yAxis: {
        type: 'value'
    },
    series: [{
        // data 的格式就是一个二维数组或对象
        /* data:[{
                name:'2018-07-21',
                value:['2018-07-21',10]
            },{
                name:'2018-07-21',
                value:['2018-07-21',10]
            }]
        */
        data:[['2018-07-21',10],['2018-07-22',15],['2018-07-23',3]],
        type: 'line',
        smooth: true
    }]
};
// 使用刚指定的配置项和数据显示图表。
myChart.setOption(option);}
上一篇下一篇

猜你喜欢

热点阅读