我正在通過地圖 ( leaflet.js) 建立網絡,其中有兩種不同類型的圈子(私有域和公共域)。我可以在地圖中顯示我的links和我的nodes(nodes實體類型(私人或公共)以及links他們彼此簽訂的合同。.on("mouseover")不幸的是,當我嘗試將效果應用到我的圈子時遇到了問題。下面的代碼展示了我具體做了什么效果。var circle = g.selectAll("circle") .data(nodes) .enter() .append("circle") .attr("cx", function(d){ return map.latLngToLayerPoint([d.lat, d.long]).x }) .attr("cy", function(d){ return map.latLngToLayerPoint([d.lat, d.long]).y }) .attr("r", function(d,i) { if(d.numContr >= 50) {return 20;} else{ if(d.numContr <50 && d.numContr >= 25) {return 16;} else{ if(d.numContr <25 && d.numContr >= 10) {return 12;} else {return 8; } } } }) .attr("fill", function (d, i) { if(d.private == 1) { return "rgb(8,105,114)" } else { return "rgb(167,255,131)"} }) .attr("stroke","rgb(7,26,82)") .attr("stroke-width", 6) .on("mouseover", mouseover) .on("mouseout", mouseout) 其function mouseover內容如下: function mouseover(d, i, n){ console.log(d3.select(n[i]) d3.select(n[i]) .transition() .duration(100) .attr("opacity",0.7)}我現在面臨的問題是,當我console.log()嘗試查看什么屬性或發送到 的值時,我什至看不到數據log,數據就是看不到。我嘗試了一切可能的方法,我嘗試將函數放入.on("mouseover", function(...){...}),隨機嘗試中,但似乎沒有任何效果。提醒一下,我只有 2 周的時間d3.js,所以我仍然是一個嘗試學習文檔的菜鳥。我覺得奇怪的是,另一個functions正在工作并通過data,但當我指的是該mouseover功能時,它不起作用。我將提供所有代碼以供進一步分析,因為問題可能出在其他地方。
1 回答

慕姐4208626
TA貢獻1852條經驗 獲得超7個贊
我們要做的就是attribute
在名為 的圓圈中添加"pointer-events"
并將其設置為visible
。這是結果:
.attr("pointer-events","visible")
然后,我在調用函數mouseover
和時遇到了一個較小的問題mouseout
,所以我只是將其寫在鼠標懸停事件上,如下所示,它起作用了:
.on("mouseover",function (d, i, n)
? ? ? ? ? ? {
? ? ? ? ? ? ? ? d3.select(n[i])
? ? ? ? ? ? ? ? .transition()
? ? ? ? ? ? ? ? .duration(100)
? ? ? ? ? ? ? ? .attr("opacity",0.7)
? ? ? ? ? ? })
? ? .on("mouseout",function (d, i, n)
? ? {
? ? ? ? d3.select(n[i])
? ? ? ? .transition()
? ? ? ? .duration(100)
? ? ? ? .attr("opacity",1)
? ? })? ? ?
對 做了同樣的事情function update。
- 1 回答
- 0 關注
- 181 瀏覽
添加回答
舉報
0/150
提交
取消