Extend bar chart on Chart JS 2 into a new type of Chart

后端 未结 3 476
你的背包
你的背包 2021-02-06 18:31

I\'m actualy using Chart JS 2.0.1 to draw charts on a page.

My customers asked me to add a line in a bar chart so that they can see the limit they can\'t go over. Like

3条回答
  •  夕颜
    夕颜 (楼主)
    2021-02-06 18:52

    Mixed type charts are supported by Chart 2.x versions. You can create config like following :-

    var config = {
      type: 'bar',
      data: {
        labels: ["January", "February", "March", "April", "May", "June", "July"],
        datasets: [{
          type: 'bar',
          label: "My First dataset",
          data: [65, 0, 80, 81, 56, 85, 40],
          fill: false
        },{
            type: 'line',
          label: "My Second dataset",
          data: [80, 80, 80, 80, 80, 80, 80],
          fill: false,
          borderColor: 'red',
          pointStyle: 'line',
          pointBorderWidth: 3
        }]    
      }
    };
    

    Created Js Fiddle here: https://jsfiddle.net/nehadeshpande/eu70wzo4/

    Please let me know if this is helpful.

    Thanks, Neha

提交回复
热议问题