gpt4 book ai didi

javascript - D3 v4 - 获取轴上每个刻度的值?

转载 作者:数据小太阳 更新时间:2023-10-29 04:39:42 24 4
gpt4 key购买 nike

使用 D3.js 版本 4,有没有办法获取轴上每个刻度值的数组?

编辑:

来自 D3 documentation

# axis.tickValues([values]) <>

If a values array is specified, the specified values are used for ticks rather than using the scale’s automatic tick generator. If values is null, clears any previously-set explicit tick values and reverts back to the scale’s tick generator. If values is not specified, returns the current tick values, which defaults to null.

我正在使用自动报价生成器,所以如果我调用

var tickValues = axis.tickValues();

tickValuesnull

最佳答案

如果您引用了 axis ,你可以使用:

axis.scale().ticks()

如果您希望将它们全部格式化,我会从 DOM 中获取它们:

d3.selectAll(".tick>text")
.nodes()
.map(function(t){
return t.innerHTML;
})

运行代码:

<!DOCTYPE html>
<meta charset="utf-8">
<svg width="960" height="500"></svg>
<script src="//d3js.org/d3.v4.min.js"></script>
<script>

var svg = d3.select("svg"),
margin = {top: 20, right: 0, bottom: 20, left: 0},
width = svg.attr("width") - margin.left - margin.right,
height = svg.attr("height") - margin.top - margin.bottom,
g = svg.append("g").attr("transform", "translate(" + margin.left + "," + margin.top + ")");

var x = d3.scalePoint()
.domain([0, 1, 2])
.range([0, width])
.padding(1);

var y = d3.scaleLinear()
.domain([-1e6, 2e6])
.range([height, 0]);

var axis = d3.axisLeft(y)
.ticks(20, "s");

g.append("g")
.attr("transform", "translate(" + x(0) + ",0)")
.attr("class", "axis")
.call(axis);

console.log(
axis.scale().ticks()
);

console.log(
d3.selectAll(".tick>text")
.nodes()
.map(function(t){
return t.innerHTML ;
})
);

</script>

关于javascript - D3 v4 - 获取轴上每个刻度的值?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46006369/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com