Question

我正在使用highcharts生成报告，但是，在highchart的列中显示数字时存在一个小问题...实际上，有两个问题。

第一个问题：

第二个问题：

这是形式随机出现的问题...

如果您看第一个示例，则所有数字都位于列顶部... 第二个示例在列中包含所有值，但是，在列顶部显示值存在问题。

我想知道是否有可能强制Highcharts API始终显示此数据。

示例图表：

chart = new Highcharts.Chart({"chart":{"renderTo":"adwords_leads_all_94-3088","type":"column"},"title":{"text":"Leads AdWords - Convers\u00e3o - (Call Tracking | Chatbot | Formul\u00e1rio)"},"colors":["#68a9dc","#005a64","#003f23","#e4452b","#65c07f","#004b76","#6ecbd6","#ff7754","#83ccb0","#007b5a","#ec9631","#24a1ae","#e46a2b","#b6740c","#f79969","#1b964e","#fdc076","#147bb6","#ba0d00","#1d6c3f"],"xAxis":{"categories":["Mar\/2018","Abr\/2018","Mai\/2018","Jun\/2018","Jul\/2018"]},"yAxis":{"min":0,"title":{"text":"Quantidade"},"stackLabels":{"enabled":1,"style":{"fontWeight":"bold","fontSize":"16px","color":"#000"}}},"legend":{"align":"center","verticalAlign":"bottom","backgroundColor":(Highcharts.theme && Highcharts.theme.legendBackgroundColorSolid) || 'white',"borderColor":"#CCC","borderWidth":1,"shadow":false},"tooltip":{"formatter":function() {
            return '<b>'+ this.x +'</b><br/>'+
            this.series.name +': '+ this.y +'<br/>'+
            'Total: '+ this.point.stackTotal;}},"plotOptions":{"column":{"stacking":"normal","dataLabels":{"enabled":1,"color":(Highcharts.theme && Highcharts.theme.dataLabelsColor) || 'white'}}},"series":[{"name":"Call Tracking","data":[0,99,454,297,409]},{"name":"Chatbot","data":[51,150,155,106,97]},{"name":"Formul\u00e1rio","data":[19,107,184,138,150]}]});

Answer 1

由于空间太小而未呈现数据标签，并且默认情况下dataLabels.allowOverlap设置为false。您要做的只是增加图表高度或设置dataLabels.allowOverlap = true。

Api参考：https://api.highcharts.com/highcharts/plotOptions.column.dataLabels.allowOverlap

第二个问题与第一个非常相似。现在yAxis.stackLabels.allowOverlap默认为false，因此您需要将其设置为true-yAxis.stackLabels.allowOverlap = true

Api参考：https://api.highcharts.com/highcharts/yAxis.stackLabels.allowOverlap

在线演示：https://jsfiddle.net/wchmiel/hbg0k78c/

没有在HighCharts的列上显示数字

1 个答案: