如何为d3轴自动生成tickValues

Question

我有一个自动生成刻度的轴：

var yAxisRight = d3.axisRight(yScale)
var yAxisRightG = g.append("g")
    .call(yAxisRight);

// What to call here
var yAxisRightTickValues = ???

天真地我会认为调用类似yAxisRight.tickValues()的内容会给我值，但是当它们自动生成时会返回null。

如何获取d3（版本4）自动生成的tickValues？

Answer 1

如果您有连续比例，则可以使用scale.ticks()来获取传递给轴生成器的标记。

在此演示中，console.log显示每个轴的刻度：

＆＃13;

＆＃13;

var scale = d3.scaleLinear()
  .range([20, 280]);

[100, 50, 210, 350].forEach(function(d, i) {
  scale.domain([0, d]);
  d3.axisBottom(scale)(d3.select("svg").append("g").attr("transform", "translate(0,"
  + (10 + 25 * i) + ")"));
  console.log("the scale " + i + " has these ticks: " + scale.ticks())
})

＆＃13;

<script src="https://d3js.org/d3.v4.min.js"></script>
<svg></svg>

＆＃13;

＆＃13;

＆＃13;