Question

我有Morris.js堆积条形图：

Morris.Bar({
  element: 'bar-example',
  data: [
    { y: '2006', a: 150, b: 60 },
    { y: '2007', a: 175,  b: 65 },
    { y: '2008', a: 150,  b: 40 },
  ],
  xkey: 'y',
  ykeys: ['a', 'b'],
  labels: ['Series A', 'Series B'],
  stacked: true
});

http://jsbin.com/bazomocoba/edit?html,js,output

我想要实现的是在顶部绘制第一个Y键，然后在下面绘制第二个Y等。在示例中，这是“a”键，它需要在所有之上。基本上是为了恢复它在条形图中绘制所有小条的方式。

Answer 1

您是否尝试恢复传递给Morris.Bar的数据？

Morris.Bar({
  element: 'bar-example',
  data: [ // reverse b and a
    { y: '2006', b: 60, a: 150 },
    { y: '2007', b: 65, a: 175 },
    { y: '2008', b: 40, a: 150 },
  ],
  xkey: 'y',
  ykeys: ['b', 'a'], // reverse b and a
  labels: ['Series B', 'Series A'], // reverse labels
  stacked: true
});

Morris.js按Y键叠加条形图顺序/显示

1 个答案: