3
votes

I have a bar chart displaying and I have full control over colors, alignment, data label formatting, etc, but when the chart renders there's a label below the x Axis showing "Y-values" in blue.

The generated mark-up is like so...

<g class="highcharts-axis" zIndex="2">
  <text x="145" y="181" 
      style="font-family:&quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, Verdana, Arial, Helvetica, sans-serif;font-size:12px;color:#6D869F;font-weight:bold;fill:#6D869F;" 
      zIndex="7" 
      text-anchor="middle" 
      visibility="visible">
    <tspan x="145">Y-values</tspan>
  </text>
</g>

which gives no clue as to which config value I need to overwrite.

I've spent far too long trying to figure our whether this is an attribute of the chart object or of the xAxis object or of a data series, with no luck.

In desperation I searched the source and found "Y-values" appears exactly once in highcharts.js, and seems to be the default for defaultYAxisOptions.title.text

ob.prototype={ defaultYAxisOptions:{ title:{ text:"Y-values" } } };

If I change the source to read "hello world!" then that comes out instead of Y-values, but changing the source shouldn't be necessary!

If I change my config to read...

               Highcharts.setOptions({
                    // lots of other settings
                    defaultYAxisOptions: {
                        title: {
                            text: "something else"
                        }
                    },
                    // some more settings
                });

I still get "Y-values".

Where is the correct place to assign my own value to this setting, or hide it?

1
But you need to hide ticks / labels or "x Axis line" as well?Sebastian Bochan

1 Answers

1
votes

You say it is on your xAxis and it is showing "Y-values" as the text. Seems odd, yes. To remove the axis titles you would do something like (below is xAxis but same holds for yAxis):

xAxis: {
            categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
            title: {
                enabled: false
            }
        }

I highly recommend getting familiar with the API.