条形图内的堆积条形图

时间:2017-05-15 13:24:07

标签: javascript d3.js charts chartist.js

我想显示以下图表:

Chart

许多图表库允许使用堆积条形图,例如:

但如上图所示的图表呢?我们的想法是为绿色,黄色和红色区域以及中心的黑条提供值...基于这些值,应该渲染这样的图表。

我认为这可以通过创建一个堆积的条形图和某种方式来实现#34;将酒吧插入堆积的酒吧......以及"以某种方式"把标签放在那里......:D

正如你所看到的,根本没有任何线索...... :)

1 个答案:

答案 0 :(得分:2)

你的意思是像这样的子弹图workaround吗?

`data:[
  {
    type: "stackedBar100",
    toolTipContent: null,
    highlightEnabled: false,
    name: "Region 1",
    showInLegend: true,
    dataPoints: [
    {y: 60, label: "Water Filter" }

    ]
  },
   {
    type: "stackedBar100",
    toolTipContent: null,
    highlightEnabled: false,
    name: "Region 2",
    showInLegend: true,
    dataPoints: [
    {y: 20, label: "Water Filter" }

    ]
  },{
    type: "bar",
    dataPoints:[{}]

  },{
    type: "bar",
    dataPoints: [
    {y: 65, label: "Water Filter" }

    ]
  },
  {
    type: "bar",
    dataPoints:[{}]
  }

  ] `