d3js v5 + топойсон v3 Доступ к свойствам объекта в фоновом режиме

Question

Я ищу подсказку для доступа к свойствам объекта в фоновом режиме. Действительно, при наведении курсора я хочу раскрыть свойства слоя 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="&nbsp",
        document.getElementById("pop").innerHTML="&nbsp";}
    )

Вот мой код: https://plnkr.co/edit/ZzeHWfChXa348iNBcHWQ

Answer 1

Я не уверен, что это решит вашу проблему полностью, но вы пытались применить pointer-events: none CSS свойство для кругов?