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( 标红部分)则数值会向下调整。请根据实际情况设置实际值

你可能感兴趣的:(HTML)