整理higcharts使用时基本配置

使用higchats时要注意如果是时间的话要处理higcharts处理时间戳的时候启用的utc时间，不然显示时间会少8个小时
详情看：https://my.oschina.net/u/3774949/blog/3084298
var chart = Highcharts.chart('net', {
    title: {
        text: ''//higchatrs的标题，不能不写默认显示
    },
    xAxis: {
        type: 'datetime',//时间戳格式数据
        dateTimeLabelFormats: {
            millisecond: '%H:%M:%S.%L',
            second: '%H:%M:%S',
            minute: '%H:%M',
            hour: '%H:%M',
            day: '%m-%d',
            week: '%m-%d',
            month: '%Y-%m',
            year: '%Y'
        }
    },
    yAxis: {
       min: 0,//数据从0开始,//数据从0开始
       minRange: 1,//当数据为0时显示在最下面
       title : {
           text : ''//y轴说明，不写为默认值
       },
       plotLines : [ {
           value : 0,
           width : 1,
           color : '#808080'
        } ]
    },
    legend: {
        verticalAlign : 'top',//多折线时折线信息显示位置
        borderWidth : 0
    },
    plotOptions : {
        area: {
            fillColor: {
                linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1},
                stops: [
                    [0, Highcharts.getOptions().colors[0]],
                    [1, Highcharts.Color(Highcharts.getOptions().colors[0]).setOpacity(0).get('rgba')]
                ]
            },
            marker: {
                radius: 2//折线点大小
            },
            lineWidth: 1,//折线粗细
            states: {
                hover: {//鼠标悬浮时折线样式
                    lineWidth: 1
                }
            },
            threshold: null
        },
        series: {
            // 针对所有数据列有效
            lineWidth: 1
        }
    },
    tooltip: {
        formatter:function () {//自定义鼠标悬浮提示气泡
            var self= this;
            var dateTime= new Date(self.x);//time为时间戳
            var date= changedate(dateTime);
            var tool = self.series.name+"<br/>" + date + "<br/>" + this.y;
            return tool;
    }
},
    series: [{
        name: 'zhagnsan',
        data:systemInfo[1],
        color:'#7cb5ec'
    }, {
        name: 'lisi',
        data:systemInfo[2],
        color:'#24E9EC'
    },{
        name: 'wangwu',
        data:systemInfo[3],
        color:'#90ed7d'
    },{
        name: 'zhaoliu',
        data:systemInfo[4],
        color:'#f7a35c'
    }]
});

转载于:https://my.oschina.net/u/3774949/blog/3084304