index.js 3.73 KB
var fun = {
    init:function () {
        var myChart = echarts.init(document.getElementById('echart-main'));

        // 指定图表的配置项和数据
        var option = {
            tooltip : {
                trigger: 'axis',
                formatter:'{a}: <br />{b}: {c}',
                axisPointer: {
                    type: 'line',
                    label: {
                        backgroundColor: '#6a7985'
                    },
                    lineStyle:{
                        color:'#2abb9b'
                    }
                },

            },
            grid: {
                left: '0',
                right: '3%',
                bottom: '0',
                top:'3%',
                containLabel: true
            },
            xAxis : [
                {
                    boundaryGap: false,
                    type : 'category',
                    boundaryGap : false,
                    data : ['周一','周二','周三','周四','周五','周六','周日'],
                    axisTick:{
                        show:false,
                    },
                    axisLine:{
                        lineStyle:{
                            color:'#e5e5e5',
                        }
                    },
                    splitLine:{
                        show:false,
                    },
                    axisLabel: {
                        show: true,
                        textStyle: {
                            color: '#333'
                        }
                    }
                }
            ],
            yAxis : [
                {
                    boundaryGap: false,
                    type : 'value',
                    axisTick:{
                        show:false,
                    },
                    axisLine:{
                        lineStyle:{
                            color:'#e5e5e5',
                        }
                    },
                    splitLine:{
                      show:false,
                    },
                    axisLabel: {
                        show: true,
                        textStyle: {
                            color: '#333'
                        }
                    }
                }
            ],
            series : [
                {
                    smooth:true,
                    name:'接入接口统计',
                    // symbol:'image://./../image/symbol.png',
                    symbol:'image://image/symbol.png',
                    symbolOffset:[0,5],
                    symbolSize:26,
                    type:'line',
                    stack: '总量',
                    areaStyle: {normal: {
                        color:'rgba(38,190,150,.1)'
                    }},
                    lineStyle:{
                        normal: {
                            color:'#2abb9b',
                            width:3,
                        }
                    },
                    data:[120, 132, 101, 134, 90, 230, 210]
                },

            ]
        };


        // 使用刚指定的配置项和数据显示图表。
        myChart.setOption(option);
    },
};
fun.init();
$('#link-div span').on('click',function () {
   var index = $(this).index();
   $(this).addClass('linkActive').siblings('span').removeClass('linkActive');
    $('#link-con .link-con-1').addClass('display-none');
    $('#link-con .link-con-1').eq(index).removeClass('display-none');
    $('#list-detail-wrap').addClass('display-none');
    $('#list-main-wrap').removeClass('display-none');
});
$(document).delegate('#list-con-wrap li span','click',function () {
   var id = $(this).attr('data-id');
   alert(id);
    $('#list-main-wrap').addClass('display-none');
   $('#list-detail-wrap').removeClass('display-none');
});