如何显示堆积的折线图

我尝试显示堆积的折线图,但是它不起作用。 您能用以下代码建议在哪里更改?

window.onload=function(){
  var ctx = document.getElementById("myChart").getcontext("2d");
  var data = {
     labels: {{subcategories|tojson}},datasets: [
           {
              1st_sample_dataset
           },{
              2nd_sample_dataset
           }
     ]
  },options = {
     scales: {
        yAxes: [{
           stacked: true
        }]
     }
  };
  new Chart(ctx).Line(data,{
     onAnimationComplete: function () {
           var sourceCanvas = this.chart.ctx.canvas;
           var targetctx = document.getElementById("myChartAxis").getcontext("2d");
           targetctx.canvas.width = copyWidth;
           targetctx.drawImage(sourceCanvas,copyWidth,copyHeight,copyHeight);
     }
  });

}

这是实际显示。

如何显示堆积的折线图

xuyihao 回答:如何显示堆积的折线图

根据您的代码,我想您正在使用旧版本的chart.js。

new Chart(ctx).Line(data,{
  ...

现在以不同的方式创建了图表。

var myChart = new Chart(ctx,{
    type: 'line',...

如果切换到2.9.3。版,它可以正常工作,如以下代码示例所示。

new Chart(document.getElementById('myChartAxis'),{
  type: 'line',data: {
    labels: ['A','B','C','D'],datasets: [
      {
        label: 'WARNINGS',data: [1,2,3,2],borderColor: 'rgb(255,159,64)',backgroundColor: 'rgba(255,64,0.2)'
      },{
        label: 'ERRORS',1,3],99,132)',132,0.2)'
      }
    ]
  },options: {
    scales: {
      yAxes: [{
        stacked: true
      }]
    }
  }
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.3/Chart.bundle.min.js"></script>
<canvas id="myChartAxis" height="90"></canvas>

本文链接:https://www.f2er.com/2568182.html

大家都在问