如何设置垂直刻度的周期？

Question

我使用的是d3库5.7.0版。我做一个简单的图。垂直轴有几个刻度？这些价格变动周期为5000。

JSFIDDLE

但是我需要期限10000。请帮助我。

js代码：

xScale = d3.scaleLinear()
  .domain([0, 100000])
  .range([paddingYaxis, w - padding]);

yScale = d3.scaleLinear()
  .domain([0, d3.max(data, d => +d['price'] + yPeriod)])
  .range([h - padding, tickSize]);

xAxis = d3.axisBottom(xScale)
  .tickSizeInner(0)
  .tickSizeOuter(tickSize)
  .tickPadding(tickPadding);

yAxis = d3.axisLeft(yScale)
  .tickSizeInner(-(w - paddingYaxis - tickSize * 2))
  .tickSizeOuter(0)
  .tickPadding(tickPadding)
  .tickFormat(d3.format(' '));

Answer 1

这应该为各种范围（不仅限于50000）提供通用解决方案。报价功能可让您选择一定数量的报价，除以周期大小，即可获得所需的结果。

yAxis = d3.axisLeft(yScale)
  .tickSizeInner(-(w - paddingYaxis - tickSize * 2))
  .tickSizeOuter(0)
  .tickPadding(tickPadding)
  .tickFormat(d3.format(' '))
  .ticks(d3.max(data, d => +d['price'] + yPeriod) / 10000);