chart.js 그래프에 툴팁을 추가하는 방법

Question

나는 webapp에서 작업하고 있으며 시각적으로 더 매력적이기 때문에 최근에 chart.js와 함께 Google 차트를 바꿨습니다. 그러나 내가 취한 하나의 손실은 더 이상 데이터 포인트 위에 툴팁을 얻을 수 없다는 것입니다. 내가 자바 스크립트 초보자로 할 수있는 방법을 아는 사람이 있는지 궁금 해서요.

var data = { 
      labels : graphData[0], 
      datasets : [ 
       { 
        fillColor : "rgba(200,160,100,0.5)", 
        strokeColor : "rgba(80,240,70,1)", 
        pointColor : "rgba(80,240,70,1)", 
        pointStrokeColor : "#fff", 
        data : graphData[3] 
       }, 
       { 
        fillColor : "rgba(220,220,220,0.5)", 
        strokeColor : "rgba(220,220,220,1)", 
        pointColor : "rgba(220,220,220,1)", 
        pointStrokeColor : "#fff", 
        data : graphData[1] 
       }, 
       { 
        fillColor : "rgba(151,187,205,0.5)", 
        strokeColor : "rgba(151,187,205,1)", 
        pointColor : "rgba(151,187,205,1)", 
        pointStrokeColor : "#fff", 
        data : graphData[2] 
       } 
      ] 
     }; 

     var options = { 
      scaleShowGridLines : true, 
      scaleShowLabels : true, 
      animationSteps : 150, 
      scaleOverride: true, 
      scaleSteps : Math.max.apply(Math, graphData[3]), 
      scaleStepWidth : 1, 
      scaleStartValue : 1 
     }; 

     var ctx = document.getElementById("chart_div").getContext("2d"); 
     ctx.canvas.width = Math.max(graphData[0].length * 60, 600); 
     var myNewChart = new Chart(ctx).Line(data,options); 
     $('#chart_area').fadeIn(); 
     $('html, body').animate({ 
      scrollTop: $("#picture_area").offset().top 
     }, 1000); 

Answer 1

당신이 https://github.com/Regaddi/Chart.js/tree/tooltips

은 위의 링크처럼 보이는이 GitHub의 페이지에 그것을 얻을 수 툴팁 와 함께 사용할 수있는 chartjs 버전이 더 이상 없습니다 다음은 그래프의 코드와 설정은 사용할 수

그러나 Github에서

에서 사용 가능한 here

당신은 설명서를 참조 할 수 here

Answer 2

https://github.com/nnnick/Chart.js/blob/master/Chart.min.js에서 Chart.min.js를 복사하기 만하면됩니다.

Answer 3

var ctx = document.getElementById("canvas").getContext("2d"); 
    window.myLine = new Chart(ctx).Line(lineChartData, { 
     responsive: true, 
     showTooltips: true, 
     multiTooltipTemplate: "<%= value %>", 
    }); 

차트의 음울음 설정을 지정하려면이 항목을 사용하십시오.