CODEWITHSUNDEEP
javascriptd3.jschartschartist.js
user2493154
user2493154

Reputation: 41

Bar Chart inside Stacked Bar Chart

I want to display the following chart:

Chart

Many chart libraries allow the use of stacked bar charts, for example:

But how about a chart like shown above? The idea is to provide values for the green, yellow and red area and for the black bar in the center... Based on those values such a chart should be rendered.

I thought this somehow can be realized by creating a stacked bar chart and "somehow" inserting the bar inside the stacked bar... And "somehow" putting the labels there... :D

As you can see, no clue at all... :)

Upvotes: 0

Views: 267

Answers (1)

Sanjoy
Sanjoy

Reputation: 505

Do you mean a workaround for bullet chart like this?

`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:[{}]
  }

  ] `

Upvotes: 2

Related Questions