title: Is it possible to position Highcharts dataLabels depending on the value?
body: <p>I'm using Highcharts to display a bar chart, with 2 bars overlaying each other, and a dataLabels at the right of them, displaying the exact value.</p>
  
  <p>The problem here is that when the value is above 80%, the label is overflowing from the chart into the frame, going over some other text, and making them both unreadable.</p>
  
  <p>Here are my <code>plotOptions</code> :</p>
  
  <pre><code>plotOptions: {
              bar: {
                  groupPadding: 0.5,
                  pointWidth : 30,
                  borderWidth: 0,
                  dataLabels: {
                      enabled: true,
                      y:-5,
                      color:"black",
                      style: {
                          fontSize: "12px"
                      },
                      formatter: function(){
                          if(this.y &gt; 80)
                          {
                              this.series.chart.options.plotOptions.bar.dataLabels.x -= 20;
                          }
                          if(this.series.name == "Tests OK")
                              return "Tests OK : &lt;strong&gt;"+Math.round(this.y*10)/10+"%&lt;/strong&gt;";
                          else
                              return "&lt;br/&gt;Tests Executed : &lt;strong&gt;"+Math.round(this.y*10)/10+"%&lt;/strong&gt;";
                      }
                  }
              }
          }
  </code></pre>
  
  <p>I thought i could edit the chart options on the go, using <code>this.series.chart.options.plotOptions.bar.dataLabels.x -= 20;</code>, but this doesn't work.</p>
  
  <p>Surely I'm not the first one who has encountered a problem like that. Any idea ?</p>
  
  <p>Thanks</p>