How to Display next line in X-Axis?

[barotbhavesh]

chart.events = HIEvents() chart.events.load = HIFunction(jsFunction: "function () { this.xAxis[0].update({ labels: { autoRotation: false } }); }")

this solution is only a few lines breaks to the next line, not all lines.

[ihnatmoisieiev]

@barotbhavesh see https://github.com/highcharts/highcharts-ios/issues/204#issuecomment-506638481

[barotbhavesh]

Firstly Thanks for your time, but not all X-Axis title going to the next line only Some X-Axis display in the next line. please see in the screenshot.

[ihnatmoisieiev]

@barotbhavesh did you try the first option from https://github.com/highcharts/highcharts-ios/issues/204#issuecomment-506638481 ?

[barotbhavesh]

yes, I tried and also add a screenshot in upper you can see only some text is going to down.

[ihnatmoisieiev]

@barotbhavesh send me please your chart options.

You can't use both options at the same time.

The first option works excellent for me.

[barotbhavesh]

This is my Chart options

    let options = HIOptions()
    options.colors = COMMON_SHARED.aryStaticColorForChart
    options.chart = chart
    options.title = title
    options.xAxis = [xaxis]
    options.yAxis = [yaxis]
    options.series = aryHIColumn
    options.exporting = exporting
    options.tooltip  = tooltip
    options.plotOptions = plotoptions
    viewFirstCharts.options = options

This My Response:- response is Dynamic

{"ErrorData":null,"ResponseStatus":true,"ResponseData":[{"POSSub":[{"SubData":[{"Field2":"30","Field5":null,"Field3":"true","Field4":null,"Field1":"Drop-In  "},{"Field2":"248","Field5":null,"Field3":"true","Field4":null,"Field1":"Hybrid Memberships  "},{"Field2":"1127","Field5":null,"Field3":"true","Field4":null,"Field1":"Legacy  "},{"Field2":"11","Field5":null,"Field3":"true","Field4":null,"Field1":"Nutrition Challenge  "},{"Field2":"27","Field5":null,"Field3":"true","Field4":null,"Field1":"Other"},{"Field2":"131","Field5":null,"Field3":"true","Field4":null,"Field1":"Private Training  "},{"Field2":"0","Field5":null,"Field3":"false","Field4":null,"Field1":"Class Plan"},{"Field2":"0","Field5":null,"Field3":"false","Field4":null,"Field1":"Class Session"}],"SubParent":""}],"Parent":"Diamond Bar Crossfit "},{"POSSub":[{"SubData":[{"Field2":"0","Field5":null,"Field3":"false","Field4":null,"Field1":"Drop-In  "},{"Field2":"0","Field5":null,"Field3":"false","Field4":null,"Field1":"Hybrid Memberships  "},{"Field2":"0","Field5":null,"Field3":"false","Field4":null,"Field1":"Legacy  "},{"Field2":"0","Field5":null,"Field3":"false","Field4":null,"Field1":"Nutrition Challenge  "},{"Field2":"18","Field5":null,"Field3":"true","Field4":null,"Field1":"Other"},{"Field2":"0","Field5":null,"Field3":"false","Field4":null,"Field1":"Private Training  "},{"Field2":"125","Field5":null,"Field3":"true","Field4":null,"Field1":"Class Plan"},{"Field2":"25","Field5":null,"Field3":"true","Field4":null,"Field1":"Class Session"}],"SubParent":""}],"Parent":"Dynamis Athletics LLC"}]}

[ihnatmoisieiev]

@barotbhavesh try to use staggerLines e.g.

xAxis.labels = HILabels()
xAxis.labels.staggerLines = 2

Of course, you can change the value of staggerLines.

[barotbhavesh]

it's working but the Looks very bad.

[ihnatmoisieiev]

@barotbhavesh you can also try:

chart.events = HIEvents()
chart.events.load = HIFunction(jsFunction: "function () { this.xAxis[0].update({ labels: { autoRotation: false, useHTML: true, style: { 'textOverflow': 'none', 'word-break': 'break-all' } } }); }")

[barotbhavesh]

It is working for me thank you again @ihnatmoisieiev