Question

我创建了fiddle，使用canvas.js插件创建了柱形图。但对于较小的值，它不显示列。在示例中，小值为1，canvas.js未显示此列，唯一标签可见。

参见下面的演示

＆＃13;

var chart = new CanvasJS.Chart("chartContainer", {
  title: {
    text: "Column not visible for value 1"
  },
  data: [{
    type: "column",
    dataPoints: [{
        y: 1,
        indexLabel: "{y}"
      },
      {
        y: 55,
        indexLabel: "{y}"
      },
      {
        y: 50,
        indexLabel: "{y}"
      },
      {
        y: 65,
        indexLabel: "{y}"
      },
      {
        y: 95,
        indexLabel: "{y}"
      },
      {
        y: 68,
        indexLabel: "{y}"
      },
      {
        y: 28,
        indexLabel: "{y}"
      },
      {
        y: 600,
        indexLabel: "{y}"
      },
      {
        y: 14,
        indexLabel: "{y}"
      }
    ]
  }]
});
chart.render();

＆＃13;

<script src="https://canvasjs.com/assets/script/canvasjs.min.js"></script>
<div id="chartContainer" style="height: 360px; width: 100%;"></div>

＆＃13;

Answer 1

这里的问题是值1小于图表的1个像素，因此它不显示任何内容。如果您只想将其设置为一个像素高，则可以将该列的值设置得更高，并将indexLabel更改为只读为1，如下所示：

{ y: 2,indexLabel: "1"},

如果您手动创建图表，那么这是有效的，但如果您的图表是由其他一些代码生成的，您可能想要找出与图表的一个像素对应的值，并为这种情况编写处理程序列的值小于该值。

Canvas.js不在列图表中显示小值的列

1 个答案: