title: Highcharts Gauge Chart with text labels
body: <p>i have a gauge charts with defined tick positions and want to show some text labels there. e. g.:</p>
  
  <ul>
  <li>-300 => Text 1</li>
  <li>-200 => Text 2</li>
  <li>-100 => Text 3 </li>
  <li>...</li>
  </ul>
  
  <p>Is there a way to do that? Here's a fiddle of the chart.</p>
  
  <p><a href="http://jsfiddle.net/r8d3jnx6/" rel="nofollow">jsfiddle.net/r8d3jnx6/</a></p>
  
  <pre><code>$('#container').highcharts({
              chart: {
                  type: 'gauge',
                  alignTicks: false,
                  plotBackgroundColor: null,
                  plotBackgroundImage: null,
                  plotBorderWidth: 0,
                  plotShadow: false
              },
  
              title: {
                  text: null
              },
  
              tooltip: {
                  enabled: false
              },
  
              pane: {
                  startAngle: -70,
                  endAngle: 70,
                  background: null
              },
  
              plotOptions: {
                  gauge: {
                      dial: {
                          baseWidth: 2,
                          baseLength: '100%',
                          radius: '100%',
                          rearLength: 0
                      },
                      pivot: {
                          radius: 5
                      },
                      dataLabels: {
                          enabled: false
                      }
                  }
              },
  
              yAxis: [ {
                  min: -300,
                  max: 500,
                  tickPositions: [-300, -200, -100, 0, 100, 200, 300, 400, 500],
                  lineColor: '#933',
                  lineWidth: 0,
                  minorTickPosition: 'outside',
                  tickLength: 0,
                  minorTickLength: 0,
                  labels: {
                      distance: 12,
                      //rotation: 'auto'
                  },
                  //categories: ['Grunder'],
                  offset: 0,
                  plotBands: [{
                      from: -300,
                      to: 2,
                      thickness: 15,
                      color: '#55BF3B'
                  }, {
                      from: 0,
                      to: 202,
                      thickness: 15,
                      color: {
                          linearGradient: {x1: 0, x2: 1, y1: 0, y2: 0},
                          stops: [
                              [0, '#55BF3B'], //green
                              [1, '#DDDF0D'] //yellow
                          ]
                      }
                  }, {
                      from: 200,
                      to: 500,
                      thickness: 15,
                      color: {
                          linearGradient: {x1: 0, x2: 1, y1: 0, y2: 0},
                          stops: [
                              [0, '#DDDF0D'], //yellow
                              [1, '#ff0000'] //red
                          ]
                      }
                  }]
              }, {
                  min: -200,
                  max: 200,
                  lineColor: '#339',
                  tickColor: '#339',
                  minorTickColor: '#339',
                  offset: -100,
                  lineWidth: 2,
                  labels: {
                      enabled: false
                  },
                  tickLength: 5,
                  minorTickLength: 5,
                  endOnTick: false
              }],
  
              series: [{
                  data: [250]
              }]
          });
  </code></pre>