Voronoi Tessellation] 找出我引用的点
Voronoi Tessellation] Find out which point I'm referencing
我有一个使用此 Voronoi Tessellation 插件的项目,其中包含一系列表示温度传感器位置的坐标 - 我正在考虑使用 JSON 来表示它们的位置和检测到的温度值。
我需要的是在鼠标悬停一个区域时显示我参考的传感器(点)的温度值(我鼠标悬停的区域)。
https://github.com/mbostock/d3/wiki/Voronoi-Geom
我看了一遍又一遍这个文档,还是不知道是否可以检测鼠标悬停区域属于哪个特定点。
有人试过这个吗?有什么好的例子吗?
如果我理解你的问题,你想在用户将鼠标移入 voronoi 分区时在顶点显示文本吗?
您可以通过处理每个路径的 mouseenter/leave 事件来做到这一点:
path.enter().append("path")
.attr("class", function(d, i) {
return "q" + (i % 9) + "-9";
})
.attr("d", polygon)
.on("mouseenter", function(d,i){
if (!someTexts[i]) { // get some fake value
someTexts[i] = (Math.random()*100).toFixed(1);
}
// append text
currentText = svg.append("text")
.text(someTexts[i])
.attr("transform","translate(" + vertices[i] + ")")
.attr("text-anchor","middle")
.attr("alignment-baseline", "middle");
})
.on("mouseleave", function(d,i){
// remove text
currentText.remove();
});
例子here.
我有一个使用此 Voronoi Tessellation 插件的项目,其中包含一系列表示温度传感器位置的坐标 - 我正在考虑使用 JSON 来表示它们的位置和检测到的温度值。
我需要的是在鼠标悬停一个区域时显示我参考的传感器(点)的温度值(我鼠标悬停的区域)。
https://github.com/mbostock/d3/wiki/Voronoi-Geom
我看了一遍又一遍这个文档,还是不知道是否可以检测鼠标悬停区域属于哪个特定点。
有人试过这个吗?有什么好的例子吗?
如果我理解你的问题,你想在用户将鼠标移入 voronoi 分区时在顶点显示文本吗?
您可以通过处理每个路径的 mouseenter/leave 事件来做到这一点:
path.enter().append("path")
.attr("class", function(d, i) {
return "q" + (i % 9) + "-9";
})
.attr("d", polygon)
.on("mouseenter", function(d,i){
if (!someTexts[i]) { // get some fake value
someTexts[i] = (Math.random()*100).toFixed(1);
}
// append text
currentText = svg.append("text")
.text(someTexts[i])
.attr("transform","translate(" + vertices[i] + ")")
.attr("text-anchor","middle")
.attr("alignment-baseline", "middle");
})
.on("mouseleave", function(d,i){
// remove text
currentText.remove();
});
例子here.