title: How to set Highcharts xAxis position on the yAxis zero value (negative/positive chart)?
body: <p>I would like to have my xAxis not below my chart but in the middle (<strong>on the yAxis zero value</strong>).</p>
  
  <p>And I would like also to have the xAxis labels :</p>
  
  <ul>
  <li><strong>above the xAxis</strong> when it is a <strong>negavite</strong> value</li>
  <li><strong>below the xAxis</strong> when it is a <strong>positive</strong> value</li>
  </ul>
  
  <p><img src="https://i.stack.imgur.com/pTtH3.png" alt="Wanted chart"></p>
  
  <p>Here is what I have : <a href="http://jsfiddle.net/3kn9h/1/" rel="nofollow noreferrer">jsFiddle</a></p>
  
  <pre><code>$(function () {
      $('#container').highcharts({
          xAxis: {
                      showFirstLabel : true,
                      showLastLabel : true,
                      type : "category",
                      tickLength : 0,
                      lineWidth : 2
              },
  
          series: [{
              data: [
                  {name : 'T1', y: 123},{name : 'T2', y: 152},{name : 'T3', y: -120},{name : 'T4', y: 0},{name : 'T5', y: 142},{name : 'T6', y: 212}
              ],
              type : 'column'
          }]
      });
  });
  </code></pre>
  
  <ul>
  <li><strong>Does it exist an easy way to do this ?</strong></li>
  <li>If not, how to do this ?</li>
  </ul>
  
  <p>Thanks.</p>
  
  <hr>
  
  <h2>Solution :</h2>
  
  <p>Thanks to Pawel Fus (thanks, thanks, thanks), here is the solution for my problem : <a href="http://jsfiddle.net/3kn9h/3/" rel="nofollow noreferrer">jsFiddle</a>. </p>
  
  <pre><code>$(function () {
      $('#container').highcharts({
          chart: {
              renderTo: 'container',
              type: 'column',
              events: {
                  load: function () {
                                          var xAxis = this.xAxis[0];
                      var serie = this.series[0];
  
                      for (var current_tick in xAxis.ticks) {
                          var tick = xAxis.ticks[current_tick];
  
                          if(serie.data[current_tick]){
                              if (serie.data[current_tick].y &gt; 0) {
                                  tick.label.attr({
                                      y: tick.label.y + 18
                                  });
                              }
                          }
                      }
                  }
              }
          },
          xAxis: {
                      showFirstLabel : true,
                      showLastLabel : true,
                      type : "category",
                      tickLength : 0,
                      crossing:0,
                      opposite:true,
                      lineWidth : 2
              },
  
          series: [{
              data: [
                  {name : 'T1', y: 123},{name : 'T2', y: 152},{name : 'T3', y: -120},{name : 'T4', y: 0},{name : 'T5', y: 142},{name : 'T6', y: 212}
              ],
              type : 'column'
          }]
      });
  });
  </code></pre>