title: How to reformat tooltip in Chart.js?
body: <p>How to reformat tooltip in Chart.js? The chart has x-axis as time, y-axis as sales amount and tooltip to show data value for both x and y. So far tooltip can work by default but I want to change the value we see in tooltip. I can reformat the time in tooltip by redefine the tooltipFormat field in 'time'. But I don't find a similar thing for y-axis data. For example, show "$1600" instead of "Daily Ticket Sales:1600".<br>
  <a href="http://i.stack.imgur.com/3gMv2.png" rel="noreferrer">example tooltip format image</a></p>
  
  <p>Could anyone tell me where should that change happen? </p>
  
  <p>Could the 'custom' callback function solve problem here? Here is the code, thanks！</p>
  
  <pre><code>    var dates=data.linechart.dates;
      var times=[];
      for (var i=0; i&lt;dates.length; i++) {
          times.push(moment(dates[i],'YYYY/MM/DD'));
      }
      // console.log(dates);
      // console.log(times);
  
      var salesData = {
      labels: times,
  
      datasets: [
          {
              label: "Daily Ticket Sales",
              fill: false,
              lineTension: 0,
              backgroundColor: "#fff",
              borderColor: "rgba(255,88,20,0.4)",
              borderCapStyle: 'butt',
              borderDash: [],
              borderDashOffset: 0.0,
              borderJoinStyle: 'miter',
              pointBorderColor: "rgba(255,88,20,0.4)",
              pointBackgroundColor: "#fff",
              pointBorderWidth: 1,
              pointHoverRadius: 5,
              pointHoverBackgroundColor: "rgba(255,88,20,0.4)",
              pointHoverBorderColor: "rgba(220,220,220,1)",
              pointHoverBorderWidth: 2,
              pointRadius: 3,
              pointHitRadius: 10,
              data: data.linechart.sales,
          }
          ]
      };
  
  
      var ctx = document.getElementById("daily_sale").getContext("2d");
      var myLineChart = new Chart(ctx, {
          type: 'line',
          data: salesData,        
          options: {
  
              showLines: true,
              responsive: true,
              legend:{display:false},
              tooltips:{ 
                  // backgroundColor:'rgba(0,255,0,0.8)',
                  custom: function(tooltip) {
  
                      // tooltip will be false if tooltip is not visible or should be hidden
                      if (!tooltip) { 
                          return;
                      }
                      else{
                      console.log(tooltip);
                      }   
                  }
              },
              scales: 
              {
                  xAxes: [{
                      type: "time",
                      time: {
                          displayFormat:'MM/DD/YY',
                          tooltipFormat: 'MM/DD/YY',
                      //     unit: 'day',
                      }
                  }],
                  yAxes: [{
                      ticks:{ userCallback: function(value, index, values) {
                                                  // $ sign and thousand seperators
                                                  return  '$'+value.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
                                              },  
                      },
                  }],
              },
          }
      });
  </code></pre>