2017-02-22 44 views
0

伙计们,我有它的问题是,我无法看到折线图的线条和点。我很确定图表正在工作,因为当我将它悬停在它上面时,我能够看到数据点。请帮忙,谢谢!CanvasJs不显示在.asp中的行

这是它的JavaScript。

<script type = "text/javascript" > 
    window.onload = function() { 
     var dataPoints = [{ y: 10 }]; 
     var chart = new CanvasJS.Chart("chartContainer", { 
      backgroundColor: "red", 
      title: { 
       text: "Dynamic Data" 
      }, 
      axisY: { 

      }, 
      data: [{ 
       type: "spline", 
       color: "yellow", 
       dataPoints: dataPoints 
      }] 
     }); 

     chart.render(); 

     var yVal = 15, updateCount = 0; 
     var updateChart = function() { 
      yVal = yVal; 
      updateCount++; 

      dataPoints.push({ 
       y: yVal 
      }); 

      chart.options.title.text = "Update " + updateCount; 
      chart.render(); 
     }; 
     // update chart every second 
     setInterval(function() { updateChart() }, 1000); 
    } 
</script> 

这是身体吧。

<div id = "chartContainer" style = "height: 300px; width: 100%;" /> 

回答

0

我无法重现issue.Can您分享更多的细节,如浏览器& CanvasJS库版本。这里是您的代码的working fiddle,无需任何修改。

var dataPoints = [{ y: 10 }]; 
var chart = new CanvasJS.Chart("chartContainer", { 
    backgroundColor: "red", 
    title: { 
     text: "Dynamic Data" 
    }, 
    axisY: { 
    }, 
    data: [{ 
     type: "spline", 
      color: "yellow", 
      dataPoints: dataPoints 
     }] 
    }); 

    chart.render(); 

    var yVal = 15, updateCount = 0; 
    var updateChart = function() { 
     yVal = yVal; 
     updateCount++; 

     dataPoints.push({ 
      y: yVal 
     }); 

     chart.options.title.text = "Update " + updateCount; 
     chart.render(); 
    }; 
    // update chart every second 
    setInterval(function() { updateChart() }, 1000);