dongzi0602 2018-08-03 18:12
浏览 103
已采纳

不是在HighCharts的列上显示数字

I'm using highcharts for generate my reports, but, an little problem for showing the numbers at columns from highchart... In fact, two problems..

First problem:

Problem with numbers in inside columns

Second Problem: enter image description here

This are problems is occurring of form random...

If you look at the first example has all the numbers at the top of the columns ... And the second example has all the values inside the columns, however, with problem to display the values at the top of the column.

I would like to know if there is any possibility of forcing the Highcharts API to display this data at all times.

Example Chart:

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]}]});
  • 写回答

1条回答 默认 最新

  • dongza1708 2018-08-06 14:15
    关注
    1. Data labels are not rendered because there is too little space and by default dataLabels.allowOverlap is set to false. What you have to do is just increase chart height or set dataLabels.allowOverlap = true.

      Api reference: https://api.highcharts.com/highcharts/plotOptions.column.dataLabels.allowOverlap


    1. The second issue is very similiar to the first one. Now yAxis.stackLabels.allowOverlap is by default false so what you have to do is set it to true - yAxis.stackLabels.allowOverlap = true

      Api reference: https://api.highcharts.com/highcharts/yAxis.stackLabels.allowOverlap

      Online demo: https://jsfiddle.net/wchmiel/hbg0k78c/

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论

报告相同问题?

悬赏问题

  • ¥30 Matlab打开默认名称带有/的光谱数据
  • ¥50 easyExcel模板 动态单元格合并列
  • ¥15 res.rows如何取值使用
  • ¥15 在odoo17开发环境中,怎么实现库存管理系统,或独立模块设计与AGV小车对接?开发方面应如何设计和开发?请详细解释MES或WMS在与AGV小车对接时需完成的设计和开发
  • ¥15 CSP算法实现EEG特征提取,哪一步错了?
  • ¥15 游戏盾如何溯源服务器真实ip?需要30个字。后面的字是凑数的
  • ¥15 vue3前端取消收藏的不会引用collectId
  • ¥15 delphi7 HMAC_SHA256方式加密
  • ¥15 关于#qt#的问题:我想实现qcustomplot完成坐标轴
  • ¥15 下列c语言代码为何输出了多余的空格