[英]d3js v5 + topojson v3 Access to the object's properties in the background
我正在寻找在后台访问对象属性的技巧。 确实,通过鼠标悬停,我想显示ze.json层(地理单位)的属性。
我没有真正设想的程序,因为:
也许我应该在比例圆上报告这些信息。 但是我该如何传输这些信息? (不仅是人口,而且还有ZE名称 )
比例圈
let rMax = d3.max(featureCollectionZe.features,(d)=>{return d.properties.pop;});
let propCircle = g.attr("class","prop_circle")
.selectAll(".prop_circle")
.data(featureCollectionZe.features)
.enter()
.append("circle")
.attr("transform", (d)=>{return "translate(" + path.centroid(d) + ")";})
.attr("r",(d)=>{return(Math.sqrt(d.properties.pop/rMax))*30;})
.attr("fill","#ffa500")
.attr("fill-opacity",0.8)
.attr("stroke-width",1)
鼠标事件
svgZe
.on("mouseover",
(e)=>{return document.getElementById("name").innerHTML=e.properties.nom_ze,
document.getElementById("pop").innerHTML=e.properties.pop;}
)
.on("mouseout",
(e)=>{return document.getElementById("name").innerHTML=" ",
document.getElementById("pop").innerHTML=" ";}
)
这是我的代码: https : //plnkr.co/edit/ZzeHWfChXa348iNBcHWQ
我不确定这是否可以完全解决您的问题,但是您是否尝试过将pointer-events: none
应用于圈子pointer-events: none
CSS属性?
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.