Не удается получить Chart.js working

Глядя на использование chart.js, но не получается получить простой пример работы.Не удается получить Chart.js working

Используя документы, я попытался это: http://jsfiddle.net/hhuojv5m/

код резервного копирования:

<canvas id="canvas" width="500px" height="200"></canvas> 

$(function(){ 
// Get context with jQuery - using jQuery's .get() method. 
var ctx = $("#myChart").get(0).getContext("2d"); 
// This will get the first returned node in the jQuery collection. 
var myNewChart = new Chart(ctx); 
var data = { 
labels: ["January", "February", "March", "April", "May", "June", "July"], 
datasets: [ 
    { 
     label: "My First dataset", 
     fillColor: "rgba(220,220,220,0.2)", 
     strokeColor: "rgba(220,220,220,1)", 
     pointColor: "rgba(220,220,220,1)", 
     pointStrokeColor: "#fff", 
     pointHighlightFill: "#fff", 
     pointHighlightStroke: "rgba(220,220,220,1)", 
     data: [65, 59, 80, 81, 56, 55, 40] 
    }, 
    { 
     label: "My Second dataset", 
     fillColor: "rgba(151,187,205,0.2)", 
     strokeColor: "rgba(151,187,205,1)", 
     pointColor: "rgba(151,187,205,1)", 
     pointStrokeColor: "#fff", 
     pointHighlightFill: "#fff", 
     pointHighlightStroke: "rgba(151,187,205,1)", 
     data: [28, 48, 40, 19, 86, 27, 90] 
    } 
] 
}; 
});

Но это не работает, любая помощь? Граф вообще не отображается в соответствии с скрипкой.

источник

2015-01-04 Lovelock

Ваш идентификатор '' холст' '' холст', но вы получаете '# myChart', используя jQuery. – jasonslyvia

Вам нужно иметь консоль браузера ** открыть **, когда вы ищете ошибки. Вы заметили ошибку, указанную в вышеупомянутой проблеме. – Pointy

Вы должны фактически называть один из типов диаграмм. У вас есть объект объекта данных, объявленный и инициализированный, но вы не передаете его ни к чему!

Если предположить, что, как предполагается, линейную диаграмму, вам нужно позвонить

myNewChart.Line(data);

И вам нужно решить проблему с <canvas> идентификатором. Fixed fiddle.

источник

2015-01-04 01:44:38 Pointy

<title>ChartJS - Few Chart Examples Using Chart engine Libs</title> 

    <script src="jquery-2.1.4.min.js"></script> 
    <script src="Chart.js"></script> 
</head> 
<body> 
<p>Line<br/>Pie<br/>Radar_Chart <br/> using chartJS libs <br/> <bl/> To display uncomment the drawing line in Index.html</p> 
    <canvas id="mycanvas" width="256" height="356">  </canvas> 
    <canvas id="mycanvas2" width="956" height="356"> </canvas>     
    <script> 
     $(document).ready(function(){ 
      var ctx = $("#mycanvas").get(0).getContext("2d");   
     var ctx = document.getElementById("mycanvas2").getContext("2d");  
     var myLineChart = new Chart(ctx);                
     var datas = { 
     labels: ["January", "February", "March", "April", "May", "June", "July"], 

      datasets: [ 
      { 
      //gray with red circle 
     label: "My First dataset", 
     fillColor: "rgba(220,220,220,0.2)", 
     strokeColor: "rgba(220,220,220,1)", 
     pointColor: "rgba(220,220,220,1)", 
     pointStrokeColor: "red", 
     pointHighlightFill: "red", 
     pointHighlightStroke: "rgba(220,220,220,1)", 
     data: [16,25,13,12,45,16,56,16,75] 
      }, 
      { 
      //blue progress/line 
     label: "My Second dataset", 
     fillColor: "rgba(151,187,205,0.2)", 
     strokeColor: "rgba(151,187,205,1)", 
     pointColor: "rgba(151,187,205,1)", 
     pointStrokeColor: "#fff", 
     pointHighlightFill: "#fff", 
     pointHighlightStroke: "rgba(151,187,205,1)", 
     data: [6,5,43,2,45,6,76,76,45] 
      } 
      ] 
     }; 

var myLineChart = new Chart(ctx).Line(datas);

источник

2016-02-03 10:03:55

Включите Jquery-2.1.3.min.js и chart.js в свой проект, а затем следуйте этому коду, после чего вы сможете его отобразить. –

ответ

Смежные вопросы