title: chart.js scatter chart - displaying label specific to point in tooltip
body: <p>I'm trying to build a chart.js scatter chart where upon the user hovering over the scatter point, the tool tip reveals the label that is <strong>specific</strong> to that point.</p>
  
  <p>So each data point would have it's x and y values, and also it's label.</p>
  
  <p>So far I've got </p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>var ctx = document.getElementById('myChart').getContext('2d');
  var scatterChart = new Chart(ctx, {
      type: 'scatter',
      data: {
          datasets: [{
              labels: ["Label 1","Label 2","Label 3"],
              data: [{
                  x: -10,
                  y: 0,
              }, {
                  x: 0,
                  y: 10
              }, {
                  x: 10,
                  y: 5
              }]
          }]
      },
      options: {
          tooltips: {
              callbacks: {
                  label: function(tooltipItem, data) {
                      var datasetLabel = data.datasets[tooltipItem.datasetIndex].label || 'Other';
                      var label = data.labels[tooltipItem.index];
                      return datasetLabel + ': ' + label;
                  }
              }
          }
      }
  });</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;head&gt;
      &lt;script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.6.0/Chart.min.js"&gt;&lt;/script&gt;
  
  &lt;/head&gt;
  &lt;canvas id="myChart" style = "height:1000px"&gt;&lt;/canvas&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>When I hover over each point, I'd like to see either 'label 1', 'label 2' or 'label 3' appear.</p>
  
  <p>Thanks very much</p>