Highcharts - Long multi-line y-axis labels causing the next label to be deleted

I need a very long multi-line label on the y axis of the chart diagrams of tall diagrams.

My problem is that long multi-line labels result in the removal of the next shortcut - it is possible that such an internal overlap is fault tolerant.

I am at the point where I increased the width of the label so that I can control the word wrapping itself with line breaks (internal word wrapping also gives the same problem that I encounter with missing labels.)

I would like for me to disable this feature and handle the overlap myself.

Example: enter image description here

chart parameters:

{ "colors": [ "#00AEEF" ], "credits": { "enabled": false }, "chart": { "type": "bar" }, "tooltip": {}, "plotOptions": { "column": { "pointPadding": 0.2, "borderWidth": 0 }, "series": { "borderWidth": 0, "dataLabels": { "enabled": true, "format": "{point.y:.1f}%" } } }, "series": [ { "showInLegend": false, "data": [ [ "this is a pretty long label <br/>that will most likely cause the next<br/> row not to appear", 70 ], [ "this is a pretty long label <br/>that will most likely cause the next<br/> row not to appear", 62.5 ], [ "this is a pretty long label <br/>that will most likely cause the next<br/> row not to appear", 41.25 ], [ "this is a pretty long label <br/>that will most likely cause the next<br/> row not to appear", 26.25 ], [ "this is a pretty long label <br/>that will most likely cause the next<br/> row not to appear", 18.75 ], [ "this is a pretty long label <br/>that will most likely cause the next<br/> row not to appear", 11.25 ], [ "this is a pretty long label <br/>that will most likely cause the next<br/> row not to appear", 7.5 ], [ "this is a pretty long label <br/>that will most likely cause the next<br/> row not to appear", 3.75 ], [ "this is a pretty long label <br/>that will most likely cause the next<br/> row not to appear", 3.75 ] ] } ], "xAxis": { "minorGridLineWidth": 0, "minorTickLength": 0, "tickLength": 0, "type": "category", "labels": { "overflow": "justify", "style": { "color": "#525151", "fontSize": "12px", "lineHeight": "10%", "fontFamily": "Helvetica Neue, Helvetica ,Helvetica,Arial,sans-serif", "width": "999px" }, "y": -10 } }, "yAxis": { "min": 0, "title": { "text": "Percent (%)" } } } 
+6
source share
1 answer
+7
source

All Articles