title: Highchart tooltip issue
body: <p>I am using Highcharts.
  Can any one tell me how to assign different tooltip suffix value to different points of same series?
   To show the tooltip like:   <code>this.X:this:y this.suffix value</code></p>
  
  <p>I am using below code to bind Highcharts:</p>
  
  <pre><code>var options = {
      chart: {
          height: 122,
          width: 387,
          type: 'line',
          borderWidth: 1,
          borderColor: '#EBBA95',
          borderRadius: 1
      },
      credits: {
          enabled: false
      },
      title: {
          text: titleText
      },
      subtitle: {
          text: subtitletext
      },
      xAxis: {
          title: {
              text: xAxistitle
          },
          categories: [],
          labels: { enabled: false }
      },
      yAxis: {
          title: {
              text: yAxistitle
          },
          labels: { enabled: true },
          plotLines: [{
              value: 0,
              width: 1,
              color: '#808080'
          }]
      },
  
      plotOptions: {
          line: {
              dataLabels: {
                  enabled: false,
                  style: {
                      textShadow: '0 0 3px white, 0 0 3px white'
                  }
              },
              events: {
                  legendItemClick: function () {
                      return false; // &lt;== returning false will cancel the default action
                  }
              },
              showInLegend: true,
              enableMouseTracking: true
          },
         /* tooltip: {
              shared: true
              //,
              //formatter: function ()
              //{
              //    return 'The value for &lt;b&gt;' + this.x + '&lt;/b&gt; is &lt;b&gt;' + this.y + '&lt;/b&gt;, in series ' + this.series.valueSuffix;
              //}
  
          },*/
          tooltip: {
              headerFormat: '&lt;span style="font-size:10px"&gt;{point.key}&lt;/span&gt;&lt;table&gt;',
              pointFormat: '&lt;tr&gt;&lt;td style="color:{series.color};padding:0"&gt;{series.name}: &lt;/td&gt;' +
                  '&lt;td style="padding:0"&gt;&lt;b&gt;{point.y} KKKK &lt;/b&gt;&lt;/td&gt;&lt;/tr&gt;',
              footerFormat: '&lt;/table&gt;',
              shared: true,
              useHTML: true
          },
          series: {
              cursor: 'pointer',
              point: {
                  events: {
                      click: function () {
  
                          var series = this.series;
                          for (var count = 0; count &lt; series.options.data.length; count++) {
                              var IndexOfSelectedDataValue = series.options.data.indexOf(this.y);
                              var IndexOfSelectedIDValue = series.options.vitalid[IndexOfSelectedDataValue];
                              var URL = CrmServerURL + 'main.aspx?etc=' + vitalsEntityObjectTypeCode + "&amp;pagetype=entityrecord&amp;id=%7b" + IndexOfSelectedIDValue + "%7D";
                              PIH.PIHClass.OpenUrl(URL);
                              break;
                          }
  
                      }
                  }
              }
          }
  
      },
  
      legend: {
          layout: 'vertical',
          align: 'right',
          verticalAlign: 'middle',
          borderWidth: 0
      },
      series: [],
      navigation: {
          buttonOptions: {
              enabled: false
          }
      }
  };
  
  
  seriesdata1.reverse();
  seriesdata2.reverse();
  var StartDate = seriesdata1[0].date;
  var EndDate = seriesdata1[seriesdata1.length - 1].date;
  
  document.getElementById("Fromdate").innerHTML = StartDate;
  document.getElementById("Todate").innerHTML = EndDate;
  
  if (seriesdata1.length &gt; 0) {
      options.series.push({ name: '', data: [], tooltip: '', vitalid: [] }); /// add new series
  
      for (i = 0; i &lt; seriesdata1.length; i++) {
          options.xAxis.categories[i] = seriesdata1[i].date;
      }
      for (i = 0; i &lt; seriesdata1.length; i++) {
          options.series[0].name = seriesdata1[i].name;
          options.series[0].data[i] = seriesdata1[i].data;
          options.series[0].tooltip = seriesdata1[i].tooltip;
          options.series[0].vitalid[i] = seriesdata1[i].vitalid;
      }
  }
  
  if (seriesdata2.length &gt; 0) {
      options.series.push({ name: '', data: [], tooltip: '', vitalid: [] }); /// add new series
  
      for (i = 0; i &lt; seriesdata2.length; i++) {
          options.series[1].name = seriesdata2[i].name;
          options.series[1].data[i] = seriesdata2[i].data;
          options.series[1].tooltip = seriesdata2[i].tooltip;
          options.series[1].vitalid[i] = seriesdata2[i].vitalid;
  
      }
  }
  $("#canvas").highcharts(options);
  </code></pre>
  
  <p>For example: for a Temperature graph I am showing 10 points in the graph, but different points have different unit of measurement like Fahrenheit &amp; Celsius. I am passing  unit of measurement as point Value suffix.</p>
  
  <p>But in my case last applied Value suffix is applied to all points of same series.</p>
  
  <p>I want tooltip as per their Unit of measurement/value suffix (eg. 15/5/2014 Temp 90 °C).</p>