dygraphs - 如何在 dygraphs 中设置特定的 y 轴标签点？

Question

Dygraphs 通常会根据轴的大小、标签的大小等自动选择 Y（和 X）轴标记点。在某些情况下，它会选择导致清晰度降低的标记点。例如，在 Y 轴值从 0 到 10 的图表上，它标记为 0、4 和 8（至少对于特定尺寸的图表）；我希望它标记为 0、5 和 10。我可以向 Dygraphs 提供一个选项或功能来指定我想要标记和勾选的点吗？

Answer 1

您可以通过编写自己的 y 轴代码功能来做到这一点：http: //dygraphs.com/options.html#ticker

这是非常高级的自定义，所以要小心并阅读dygraph-tickers.js. 这是一些粗略的代码：

<script type="text/javascript">
  g = new Dygraph(div, data, {
    axes: {
      y: {
        ticker: function(min, max, pixels, opts, dygraph, vals) {
          return [{v:0, label:"0"}, {v:5, label:"5"}, {v:10, label:"10"}];
        }
      }
    }
  });
</script>

这种方法的一个缺点是这些是您将获得的唯一 y 轴刻度线，即使用户在 y 轴上平移/缩放。根据您的应用程序，这可能会也可能不会。

Answer 2

如果您只想为自动生成的标签添加标签

g = new Dygraph(div, data, {
    axes: {
      y: {
        ticker: function(min, max, pixels, opts, dygraph, vals) {
          var your_value = 7.5;

          //Get auto-generated tickers (numericTicks is the default ticker generator)
          var tickers = Dygraph.numericTicks(min, max, pixels, opts, dygraph, vals);
          tickers.push({v: your_value, label: 'Custom Label'}); //Insert your label

          return tickers;
        }
      }
    }
  });