2015-07-17 2 views
0

Я работаю над кодом с API. Мне нужно создать линейную диаграмму для этих вещей, называемых билетами. Мне нужно вызвать информацию для них из API. Он имеет идентификатор билета, дату и описание. Для маркировки у меня четыре недели месяца. Если я не буду называть его каждую неделю, диаграмма не появится. Однако, когда я это делаю, вместо информации о всплывающей диаграмме предупреждение делает всю информацию за каждую неделю.Маркировка и данные (ChartJS)

var lineChartData = { 
    labels: ["Week 1","Week 2","Week 3","Week 4"], 
    datasets: [{ 
     label: "Tickets", 
     fillColor: "rgba(100,200,244,0.2)", 
     strokeColor: "rgba(100,200,244,1)", 
     pointColor: "rgba(200,255,255,.7)", 
     pointStrokeColor: "#fff", 
     pointHighlightFill: "#fff", 
     pointHighlightStroke: "rgba(220,220,220,1)", 
     data: [$.get("http://velocity.data.wpengine.com:3000/tickets/", function(data){ alert(JSON.stringify(data));}).fail(function() {alert("FAIL");}), $.get("http://velocity.data.wpengine.com:3000/tickets/", function(data){ alert(JSON.stringify(data));}).fail(function() {alert("FAIL");}), $.get("http://velocity.data.wpengine.com:3000/tickets/", function(data){ alert(JSON.stringify(data));}).fail(function() {alert("FAIL");}), $.get("http://velocity.data.wpengine.com:3000/tickets/", function(data){ alert(JSON.stringify(data));}).fail(function() {alert("FAIL");}) ] }; 

Если вам нужен полный код (это имеет CSS, HTML, и JavaScript), click here.

ответ

0

$ .get не оценивает возвращаемое значение, как обычный вызов функции.

Когда данные получены от http://velocity.data.wpengine.com:3000/tickets/, вызывается функция обратного вызова. В вашем случае это

function(data){ alert(JSON.stringify(data));} 

Вы имеете доступ к возвращенной dataвнутри этот обратный вызов функции. И ты просто предупреждаешь об этом. Вот почему вы просто получаете предупреждение в одиночку. Вам нужно переместить код рисования диаграммы в эту функцию обратного вызова. Что-то вроде

window.onload = function() { 
    $.get("http://velocity.data.wpengine.com:3000/tickets/list/", function(data){ 
     var lineChartData = { 
      labels: ["January", "February", "March", "April", "May", "June", "July"], 
      datasets: [{ 
       label: "My First dataset", 
       fillColor: "rgba(100,200,244,0.2)", 
       strokeColor: "rgba(100,200,244,1)", 
       pointColor: "rgba(200,255,255,.7)", 
       pointStrokeColor: "#fff", 
       pointHighlightFill: "#fff", 
       pointHighlightStroke: "rgba(220,220,220,1)", 
       data: data, 
      }, 
      { 
       label: "My Second dataset", 
       fillColor: "rgba(100,200,244,0)", 
       strokeColor: "rgba(100,200,244,0)", 
       pointColor: "rgba(200,255,255,0)", 
       pointStrokeColor: "rgba(255,255,255,0)", 
       pointHighlightFill: "#rgba(255,255,255,0)", 
       pointHighlightStroke: "rgba(220,220,220,0)", 
       data: [randomScalingFactor(), randomScalingFactor(), randomScalingFactor(), randomScalingFactor(), randomScalingFactor(), randomScalingFactor(), randomScalingFactor()] 
      }] 
     }; 

     var ctx1 = document.getElementById("chart1").getContext("2d"); 
     window.myLine = new Chart(ctx1).Line(lineChartData, { 
      showScale: false, 
      pointDot: true, 
      responsive: true 

     }); 

     var ctx2 = document.getElementById("chart2").getContext("2d"); 
     window.myLine = new Chart(ctx2).Line(lineChartData, { 
      responsive: true 
     }); 

     .... 
+0

Кстати, вы можете сказать, что ваш CSS на самом деле МЕНЬШЕ или SASS (я вижу вложенные наборы правил там), и у вас также есть блок стиля и головной конец тега перед тем, которые вы могли бы хочу очистить. – potatopeelings

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