Highcharts的基本属性和方法详解-column:柱形图plotOptions的部分修改属性说明

Posted 2020-08-21 b小青青

 
plotOptions:
    {  
        column: //柱形图
        {
            pointPadding: 0.2,
            borderWidth: 1,               //柱子边框的大小
            borderColor: "red",           //柱子边框的颜色
            borderRadius: 180,            //柱子两端的圆角的半径
            colorByPoint: true,           //否应该接受每系列的一种颜色或每点一种颜色
            groupPadding: 0,                //每一组柱子之间的间隔(会影响到柱子的大小)
            minPointLength: 0,            //最小数据值那一条柱子的长度(如果是0，可能看不到，可以设置出来)
            pointPadding: 0.1,            //柱子之间的间隔(会影响到柱子的大小)
            pointWidth: 2,                //柱子的大小(会影响到柱子的大小)
            allowPointSelect: false, 
            animation: true,              //图形出来时候的动画
            color: ‘red‘,                 //柱子的颜色
            connectNulls: false,          //连接图表是否忽略零点(如线形图，数据为0是是否忽略)
            cursor: ‘‘,                   //游标
            dashStyle: null,
            dataLabels: { //图上是否显示数据标签
            enabled: true,
            align: "center",
            color: ‘red‘,
            formatter: function() 
            {
                return this.y + ‘mm‘
            },
            rotation: 270,
            staggerLines: 0,
            step: ,
            style: ,
            x: 0,
            y: -6
            },
            //enableMouseTracking: 
            events: {    //事件
            click: function(event)
            {
                alert(this.name);
            },
            checkboxClick: ,
            hide: ,
            legendItemClick: ,
            mouseOver: ,
            mouseOut: ,
            show:
            },
            id: null,
            lineWidth: 20,
            marker: {  //图例说明上的标志
            enabled: false
            },
            point: {     //图上的数据点(这个在线形图可能就直观)
            events: {
                click: function() 
                {
                alert(this.y);
                },
                mouseOver: ,
                mouseOut: ,
                remove: ,
                select: ,
                unselect: ,
                update:
                }
            },
            pointStart: 0,     //显示图数据点开始值
            pointInterval: 1,  //显示图数据点的间隔
            selected: false,
            shadow: true,
            showCheckbox: true,  //是否显示(图例说明的)复选框
            showInLegend: false, //是否显示图例说明
            stacking: ‘percent‘, //是否堆积
            states: 
            {
                hover: 
                {
                 　　brightness: 0.1,
                 　　enabled: true,    //图上的数据点标志是否显示
                 　　lineWidth: 2,    //没看出效果
                 marker: 
                {
                                    states: ,
                                    enabled: true,         //数据点标志是否显示
                                    fillColor: null,       //数据点标志填充的颜色
                                    lineColor: "#FFFFFF",  //数据点标志线的颜色
                                    lineWidth: 0,          //数据点标志线的大小
                                    radius: 45,            //数据点标志半径
                                    symbol: ‘triangle‘//‘url(http://highcharts.com/demo/gfx/sun.png)‘ //数据点标志形状(triangle三角形,或者用图片等等)
                                }
                            }
                     },
             stickyTracking: true,  //轨道粘性 (例如线图，如果这个设置为否定，那就必须点到数据点才有反应)
             visible: true,         //设置为false就不显示图
             zIndex: null           //层级
    },
    //该片段来自于http://www.codesnippet.cn/detail/0206201512756.html