gpt4 book ai didi

d3.js - 将 "mouseover"事件绑定(bind)到 d3.js 中一行上的点

转载 作者:行者123 更新时间:2023-12-04 23:03:28 25 4
gpt4 key购买 nike

我想通过使用以下代码单击线来获取线上点的坐标:

var lineData = [ { "x": 1,   "y": 5},  { "x": 20,  "y": 20},
{ "x": 40, "y": 10}, { "x": 60, "y": 40},
{ "x": 80, "y": 5}, { "x": 100, "y": 60}];

var lineFunction = d3.svg.line()
.x(function(d) { return d.x; })
.y(function(d) { return d.y; })
.interpolate("linear");

var svgContainer = d3.select("body").append("svg")
.attr("width", 200)
.attr("height", 200);

var lineGraph = svgContainer.append("path")
.data([lineData]).attr("d", lineFunction)
//.attr("d", lineFunction(lineData))
.attr("stroke", "blue")
.attr("stroke-width", 2)
.attr("fill", "none")
.on('mousedown', function(d) {
console.log({"x":d.x, "y":d.y})
});

(我更新了代码以解决评论,但我仍然得到“对象 {x:未定义,y:未定义}”)

单击该行时,我不断收到“未定义”。我错过了一步吗?

最佳答案

您可以使用 d3.event 获取事件的坐标:

.on("mousedown", function() {
console.log({"x": d3.event.x, "y": d3.event.y});
});

关于d3.js - 将 "mouseover"事件绑定(bind)到 d3.js 中一行上的点,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17257349/

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