highcharts报表 三:plotOptions 针对所有图表有效的通用配置

plotOptions : {

    // 数据列通用配置
    series : {

        // 允许数据列点击标记, 默认false
        allowPointSelect : false 

        // 初始化动画
        animation : true

        color : 'red' // 数据列的颜色

        数据标签
        dataLabels : {
            align : '' // 数据列的水平对齐方式
            enabled : false //如何设置为true,数据列自动显示列的信息,默认false
            backgroundColor : 'red' // 数据标签背景颜色
            borderColor : 'red' // 数据标签边框颜色
            borderWidth : 1 //数据标签边框宽度
            borderRadius : 5 // 数据标签边框圆角
            color : 'red' // 数据标签字体颜色
            format : '{y}unit' // 数据标签显示内容格式化
            formatter : function () {
                // 数据标签内容格式化函数
            }
            padding : 5 // 数据标签的内边距
             x: 0, // 坐标显示位置
             y: -20 // y轴显示
        }
        showCheckBox : false // true显示checkbox框,默认false
        events : {
            // 隐藏数据列触发
            hide : function () {}

            // 显示数据列触发
            show : function () {}

            // 动画加载完毕触发
            afterAnimate : function () {}

            // checkbox选中事件
            checkboxClick : function (){}

            // 数据列点击事件
            click : function () {}

            // 禁止图列点击事件
            legendItemClick : function () {return false}

             // 鼠标划出数据列事件触发
             mouseOut : function () {}

            // 鼠标划入数据列事件触发
            mouseOver : function () {}
        },
        keys : ['name', 'y', 'sliced', 'selected'] // 该参数指定了数据数组中每个元素对应的 key, 当另一个(data)当数组中第三个元素都为true时默认选中,突出显示['chrom', 192,true,true],

        lineWidth : 1, // 数据列的线条宽度

        linkedTo : ':previous' // 数据列关联,关联前一个数据列

        // 数据点配置
        marker : {

            enabled : null// 默认null, 是否显示数据点标记
            lineColor : '' // 数据点线条颜色
            fillColor : '' // 数据点中心圆点颜色
            height : number // 数据点高度
            states : {
                hover : {} // 鼠标经过数据点样式配置
            }
            radius : number // 指定数据点的大小
            symbol : 'circle' // 默认圆点, 一般取默认值
        }

        negativeColor : '#ccc' // 指定数据列负值颜色,比如-1

        // 数据点相关配置
        point : {
            events : {

                // 点击数据点触发
                click : function () {}

                // 鼠标离开数据点触发事件
                mouseOut : function () {

                } 

                 //  鼠标划入数据点触发事件
                mouseOver : function () {

                }

                // 更新数据点触发
                update : function () {

                }

                // 点击选中数据点时触发,必须allowPointSelect为true才有效
                select : function () {

                }

                // 取消选中数据点触发
                unselect : function () {

                }


            }
            // 数据点间隔, 开始值
            pointStart: Date.UTC(2010, 0, 1), 

            // 间隔一天
            pointInterval: 24 * 3600 * 1000 

            // 间隔单位
            pointIntervalUnit: 'month'

            // 指定数据列初始的选中状态,如果设置了 showCheckbox 为 true 时,默认是:false.
            selected: false

            // 数据列阴影效果
            shadow: true 

            // 是否显示CheckBox框, 默认false, 为true 时显示
            showCheckbox : false

            // 是否进行堆叠(堆叠顾名思义就是多跟数据列堆成一根), 默认不堆叠,是否开启堆叠,"normal"(普通堆叠) 和 "percent"(百分比堆叠
            stacking : null

            // 鼠标划过状态下的数据列配置
            states : {
                hover : {
                    //..............配置项
                }
            }


             tooltip: {
                    xDateFormat: '%Y-%m-%d', 
                    dateTimeLabelFormats.day
                    dateTimeLabelFormats: {
                            day: '%m-%d',
                            month: '%Y-%m'
                    },
                    shared: true

                    valueDecimals: 小数精确位数
                    valuePrefix: 值的前缀
                    valueSuffix: 值的后缀
            },

            // 数据列显示状态, 默认true, false为隐藏
            visible : true

            // 指定数据列的分区数组,可以理解为一条数据列可以配置多个颜色显示
            zone : []

        }           

    }
}

// 数值格式化百分比
tooltip: {
        pointFormat: '{series.name}: {point.y} ({point.percentage:.1f}%)
'


你可能感兴趣的:(highcharts)