केवल होवर

Question

पर डी 3 नोड टेक्स्ट दिखाएं मैं केवल माउसओवर पर नोड टेक्स्ट दिखाने की कोशिश कर रहा हूं। जब मैं नोड को माउसवर करता हूं, तो मेरे पास svg सर्कल बदलने के लिए अस्पष्टता होती है, लेकिन केवल पहले नोड के लिए पाठ दिखाई देता है। मुझे पता चला है कि यह चुनिंदा तत्व का उपयोग करने के कारण है, लेकिन मैं यह नहीं समझ सकता कि नोड के लिए सही टेक्स्ट कैसे खींचूं। मेरे पास वर्तमान में क्या है।

node.append("svg:circle") 
    .attr("r", function(d) { return radius_scale(parseInt(d.size)); }) 
    .attr("fill", function(d) { return d.fill; }) 
    .attr("stroke", function(d) { return d.stroke; }) 
    .on('mouseover', function(d){ 
     d3.select(this).style({opacity:'0.8'}) 
     d3.select("text").style({opacity:'1.0'}); 
       }) 
    .on('mouseout', function(d){ 
     d3.select(this).style({opacity:'0.0',}) 
     d3.select("text").style({opacity:'0.0'}); 
    }) 
    .call(force.drag); 

Answer 1

तो आप का उपयोग d3.select आप <text> तत्वों के लिए पूरे डोम खोज और पहले से एक का चयन कर रहे हैं। विशिष्ट टेक्स्ट नोड्स का चयन करने के लिए आपको या तो एक और विशिष्ट चयनकर्ता (उदा। #textnode1) की आवश्यकता है या आपको किसी विशेष पैरेंट नोड के तहत चयन को बाधित करने के लिए उपखंड का उपयोग करने की आवश्यकता है। उदाहरण के लिए, यदि <text> तत्व अपने उदाहरण में नोड के अंतर्गत सीधे रहते थे आप इस्तेमाल कर सकते हैं:

.on('mouseover', function(d){ 
    var nodeSelection = d3.select(this).style({opacity:'0.8'}); 
    nodeSelection.select("text").style({opacity:'1.0'}); 
})