highcharts使用之柱形图和折线图混合图上显示数值

柱形图和折线图混合图上显示数值

var plotOptions = {
                column: { dataLabels: { enabled: true, style: { color: '#D7DEE9' },y:20 } },
                line: {
                    dataLabels: {
                        enabled: true, style: { color: '#D7DEE9' },
                        // 折线数据显示%
                        formatter: function () {
                            return this.point.y + '%';  
                        }
                    },
                    tooltip: { valueSuffix: '%' },
                    //曲线点类型："circle", "square", "diamond", "triangle","triangle-down"，默认是"circle"
                    marker: { radius: 5, symbol: 'circle' },
                }
            };

其中，enabled设置为true(标黄部分)，会显示数值，设置false则不显示(默认)

其中，想更改显示数值的格式，如：加%。则设置formatter: function () {return this.point.y + '%';   }(标绿部分)

其中，marker中的symbol值为折线点的形状。(标蓝部分)

数据展示时可能会遇到：折线图和柱形图的数值重叠，会覆盖从而显示不了其中的某个值。这时设置y:20(标红部分)则数值会向下调整。请根据实际情况设置实际值