【问题标题】:How do I create stacked chart with Chart.js version 2.0.0-beta如何使用 Chart.js 版本 2.0.0-beta 创建堆积图
【发布时间】:2016-07-28 22:50:06
【问题描述】:

我在使用上述版本创建和显示堆叠条形图时遇到了一些问题。文档对这个主题没有太多解释。

任何人有一个有用的想法?

var data = {
    "labels": [
      "10/7/15", 
      "10/8/15", 
      "10/9/15", 
      "10/13/15", 
      "10/14/15", 
      "10/15/15", 
      "10/16/15"
    ],
    "datasets": [{
      "label": "Cash",
      "backgroundColor": "blue",
      "data": [
        "100000", 
        "150000", 
        "120000", 
        "140000", 
        "90000", 
        "110000", 
        "130000"
      ]
    }, {
      "label": "Credit",
      "backgroundColor": "green",
      "data": [
        "20000",
        "-10000",
        "200000",
        "-110000",
        "99500",
        "-100000",
        "11000"
      ]
    }]
  };

  var options = {
    responsive: true,
    datasetFill: false,
    scales: {
      xAxes: [{
        stacked: true,
        barPercentage: 0.8
      }]
    },
  };
  var ctx = $('#bar_chart').get(0).getContext('2d');
  var chart = new Chart(ctx, {
    type: 'bar',
    data: data,
    options: options
  });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.0.0-beta/Chart.min.js"></script>
<canvas id="bar_chart" width="470" height="200">
</canvas>

http://nnnick.github.io/Chart.js/docs-v2/#bar-chart 上的文档表明应该在 xAxes 值上设置“stacked: true”,这是我所做的没有效果。

【问题讨论】:

    标签: chart.js


    【解决方案1】:

    好的,想通了。看起来我需要在 X 和 Y 轴上堆叠:true。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2016-12-25
      • 2020-09-14
      • 2021-12-12
      • 1970-01-01
      • 2017-01-23
      • 2021-11-17
      相关资源
      最近更新 更多