मैं एक एसवीजी ऑब्जेक्ट के साथ बूटस्ट्रैप टूलटिप कैसे दिखा सकता हूं?

मैं समझने के लिए कारण है कि मैं नियमित रूप से HTML तत्वों पर टूलटिप्स दिखा सकते हैं की कोशिश कर पागल हो रहा हूँ, लेकिन नहीं डी 3-उत्पन्न SVGs पर: http://jsfiddle.net/nachocab/eQmYX/5/मैं एक एसवीजी ऑब्जेक्ट के साथ बूटस्ट्रैप टूलटिप कैसे दिखा सकता हूं?

क्या मैं गलत कर रहा हूँ?

$(document).ready(function() { 
    $("a").tooltip({ 
     'placement': 'bottom' 
    }); // this works 

    $("my_circle").tooltip({ 
     'placement': 'bottom' 
    }); // this does not work 
});

स्रोत

2013-02-04 nachocab

jQuery एसवीजी के साथ अच्छा नहीं खेलता है। Https://github.com/shawnbot/d3-bootstrap – Duopixel

अभी तक d3-bootstrap प्रोजेक्ट को नहीं देखा है ... यदि यह संभव है, तो आपको svg's का उपयोग करना पड़ सकता है। http://jsfiddle.net/BCsGc/1/ – mg1075

@nachocab - शायद मैं पूरी तरह से कुछ याद कर रहा हूं, लेकिन ... आपने लेफिक्स से जवाब स्वीकार कर लिया है। क्या आपके पास बूटस्ट्रैप टूलटिप्स उत्पन्न होने और दृश्यमान होने का एक कामकाजी उदाहरण है? सबसे पहले, लेफिक्स में "d3.tooltip()" है, लेकिन मेरा मानना है कि यह गलत है: इसे "bootstrap.tooltip()" होना चाहिए। यहां आपके बेवकूफ का कांटा है: http://jsfiddle.net/7bNgC/11/ निश्चित रूप से, टूलटिप जेनरेट हो रहा है, लेकिन यह अभी भी दिखाई नहीं दे रहा है। – mg1075

समस्या यह है कि टूलटिप कि बूटस्ट्रैप v2.2.2 उत्पन्न करता है एक <div> कि <svg>, जो ब्राउज़र बनाया यह रेंडर नहीं के अंदर डाला जा रहा था था।

मैं Bootstrap Tooltip के नवीनतम विकास संस्करण का उपयोग कर समाप्त हुआ, जो टूलटिप के कंटेनर को निर्धारित करने के लिए एक नया पैरामीटर जोड़ता है। अब मैं कर सकते हैं:

$(".my_circle").tooltip({ 
    'container': 'body', 
    'placement': 'bottom' 
}); // this works!

संपादित करें - एक साल बाद

रिकॉर्ड के लिए, मैं jQuery आवश्यकता गिरा दिया और मैं अब उत्कृष्ट d3-tip जस्टिन पामर द्वारा उपयोग कर रहा हूँ।

स्रोत

2013-02-06 18:34:23 nachocab

पर काम नहीं करता है स्पष्ट रूप से '$ (" my_circle "), डॉट के साथ। – krawyoti

मैं यहाँ क्या गलत कर रहा हूँ। ?? यह काम नहीं लग रहा है। http://jsfiddle.net/selvaG/eQmYX/39/ – selvagsz

मैंने आपके jsfiddle को अपडेट किया है - आप $ ('svg circle') का उपयोग करके सभी svg सर्कल तत्वों से संलग्न कर सकते हैं। टूलटिप ... http: // jsfiddle। नेट/ईक्यूएमएक्स/41/ –

डी 3 बूटस्ट्रैप लाइब्रेरी का उपयोग करें। यह लाइब्रेरी आपको D3.js के लिए संगत, अलर्ट, पॉपओवर और टूलटिप कार्यक्षमता प्रदान करेगी, आप अपने जेएसफ़ाइल पर निम्नलिखित कोड जोड़ सकते हैं।

इसे अपने मुख्य भाग में जोड़ें।

<script src="https://github.com/shawnbot/d3-bootstrap/blob/master/d3-bootstrap.js"/>

इसे अपने कोड भाग में जोड़ें।

d3.selectAll(".my_circle") 
    .call(d3.tooltip().placement("right"));

स्रोत

2013-02-05 06:05:31 lephix

यह काम नहीं कर रहा है, mg1075 की टिप्पणी jsfiddle.net/7bNgC/11 – nachocab

एसवीजी तत्वों – superphonic

मैं एक एसवीजी ऑब्जेक्ट के साथ बूटस्ट्रैप टूलटिप कैसे दिखा सकता हूं?

उत्तर

संबंधित मुद्दे