Javascript 使用ChartJS在0处启动条形图

我有一个条形图，它使用ChartJS显示数据。根据条形图，我有数据：

15,2,0,11

我可以在栏中看到所有这些数据，除了0。是否可以从0开始条形图，以便我也可以看到条形图中第四列的数据

options: {
  legend: { display: false },
  scales: {
      yAxes: [{
          display: false,
      }],
      xAxes: [{
          display: true,
      }],
  },
  title: {
    display: false,
  }

}

---

因为Y轴的值从0开始。所以，如果X轴上的值为0，则该值将为null，并且不会显示0的条。因此，如果希望0出现在图表中，则起点应小于0。

您可以尝试

beginAtZero:true

config选项

options: {
  legend: { display: false },
  scales: {
      yAxes: [{
          display: false,
          ticks: {
                beginAtZero:true
            }
      }],
      xAxes: [{
          display: true,
      }],
  },
  title: {
    display: false,
  }
}

---

我相信你说过你在用ChartsJ。这个问题已经有了答案。

经过几个小时的工作，我终于找到了答案。没有chartjs配置可以完成，您必须自己绘制。让我们在

onComplete

函数中完成

var ctx=document.getElementById（“myChart”）.getContext（“2d”）；
var数据集=[15,2,0,11]；
var myChart=新图表（ctx{
类型：'bar'，
数据：{
标签：[“1”、“2”、“3”、“4”]，
数据集：[{
标签：“值”，
背景颜色：“#F00”，
数据：数据集
}]
},
选项：{
比例：{
雅克斯：[{
滴答声：{
贝吉纳泽罗：是的
}
}]
},
动画：{
onComplete:function（）{
var dataSet=myChart.getDatasetMeta（0）；
dataSet.data.forEach（elm=>{
if（数据集[elm.\u索引]==0）{
ctx.fillStyle='#F00'；
ctx.fillRect（elm.\u model.x-elm.\u view.width/2，elm.\u model.y-1，elm.\u view.width，2）；
}
})
}
}
}
});
试试这个，图表将从零开始

   options: {
        responsive: true,
        scales: {
            yAxes: [{
                ticks: {
                    beginAtZero: true
                }
            }]
        }
    }
});

所以它必须从-1开始？是的，根据您的需要，它应该从-1开始或小于-1。我如何使它从-1开始？我使用chart.js不确定，但您可以尝试作为：beginAtZero:false并添加一些最小值，如min:-2或更小。使用
beginAtZero:false，
条形图从0开始。但是0未显示在条形图上仍然未修复您将永远不会看到值为
0
的数据的物理条形图。想想看——图表中没有条形图会告诉查看者该列的值为
0
——即使Y轴从零以下的数字开始。如果观众在那里看到一个条，他们会认为它是大于
0
的值。然后，当他们将鼠标悬停在上面，看到
0
，他们会有各种各样的困惑。这是你的权利。但是一个空荡荡的酒吧看起来并不好。我还将
xAxes
的
显示更改为false。条形图中有数据时会显示。如果没有数据，我得到的只是页面上的一个空白区域仍然没有修复是的，它起作用了。谢谢你知道我如何为这些条定义多种颜色吗？现在
ctx.fillStyle='#F00'是否可以为此定义多种颜色？例如：
ctx.fillStyle=“#26B99A”、“#8cb926”、“#ede92d”、“#b96f26”、“#b92626”
ctx.fillStyle=”#FF0000”；ctx.fillStyle放置在foreach循环中。所以一次只能为一个条设置颜色。要获取条形图背景，请使用：
ctx.fillStyle=elm.\u model.backgroundColor