javascript - 如何在 D3 Js 中将 y 轴 (yDomain) 值设置为最大值

Question

在我的 D3 图表中，如何将 yDomain 设置为最大值。有什么建议 ？ 如果我们在11月10日看到我的line和area即将开箱即用。

我的代码沙箱 here

我正在分别计算 yDomainMagnitude 和 yDomainStartupMagnitude 的两个域，但现在如何合并或取两者的并集并分配给 yDomain。

   var yDomainMagnitude = d3.extent(data, function(d) {
      return d.magnitude;
    });

    var yDomainStartupMagnitude = d3.extent(data, function(d) {
      return d.startupMagnitude;
    });

    var yDomain = yDomainStartupMagnitude; // here I have to have union of both and assign.

    var xScale = d3
      .scaleTime()
      .range([0, width])
      .domain(xDomain);
    var yScale = d3
      .scaleLinear()
      .range([height, 0])
      .domain(yDomain);

Answer 1

有多种方法可以就地计算yDomain。你的显然可以工作，但是可以大大简化:

var yDomain = [
  d3.min(data, d => Math.min(d.magnitude, d.startupMagnitude)),
  d3.max(data, d => Math.max(d.magnitude, d.startupMagnitude))
];

此方法使用 Math.min()/Math.max( )，分别针对任何数据点。然后，它利用 d3.min() 和 d3.max() 计算这些值的全局范围。