title: Formatting Highchart bar charts axis labels
body: <p>I am trying to set custom x axis labels for bar charts in HighChart. I used formatter to add <em>%</em> and <em>milestone dates</em> to the labels. I can see the expected result when I print in the console, but the bar charts labels are not reflecting this value. </p>
  
  <p>Please find the attached fiddle of what I have tried.</p>
  
  <p><a href="https://jsfiddle.net/mt74opnu/2/" rel="nofollow noreferrer">https://jsfiddle.net/mt74opnu/2/</a></p>
  
  <pre><code>Code:
  
  /* public milestonedata: MilestoneDetailsSchedule = {
      tickInterval: 30,
      milestonedetails: [{
        percentage: 30,
        milestonedate: "May 1, 2019"
      }, {
        percentage: 60,
        milestonedate: "May 25, 2019"
      }]
  }; // this the object that I am trying to access for labels */
  
  Highcharts.chart('container', {
    chart: {
      type: 'bar'
    },
    xAxis: {
      categories: ['My Goal', 'My Progress', 'My Branch', 'My Region']
    },
    yAxis: {
      min: 0,
      max: 100,
      tickInterval: 30,
      labels: {
        overflow: 'justify',
        formatter: function() {
          //console.log('In charts');
          //console.log(this.value);
          var milestonedata = {
            tickInterval: 30,
            milestonedetails: [{
              percentage: 30,
              milestonedate: "May 1, 2019"
            }, {
              percentage: 60,
              milestonedate: "May 25, 2019"
            }]
          };
          var result;
          milestonedata.milestonedetails.forEach((milestone) =&gt; {
            //console.log(milestone); 
            //would like the labels to be 30% by date1, 60% by date 2
            if (milestone.percentage == this.value &amp;&amp; milestone.milestonedate) {
              result = this.value + "% by &lt;br&gt;" + milestone.milestonedate;
              console.log(result);
            } else {
              result = this.value;
            }
            return result;
          });
        }
      }
    },
    plotOptions: {
      bar: {
        dataLabels: {
          enabled: true
        }
      }
    },
    series: [{
      data: [{
        y: 25
      }, {
        y: 50
      }, {
        y: 75
      }, {
        y: 100
      }]
    }]
  });
  </code></pre>
  
  <p>I would like to see x axis labels: <strong>value + % + milestone date</strong> for that value. 
  for ex: <strong>30% by May 1 2019</strong> etc.</p>
  
  <p>Is this possible? Thanks in advance!</p>