जावास्क्रिप्ट में पॉप अप विंडो के अंदर चार्ट

10

पॉप अप विंडो के अंदर चार्ट कैसे दिखाएं? मैं USC JS का उपयोग कर रहा हूं, जिसमें रफेल प्लगइन के लिए सपोर्ट है http://dynmeth.github.com/RaphaelLayer/ । क्या पॉपअप विंडो के अंदर div बनाना संभव है? मैं http://softwarebyjosh.com/raphy-charts/ के बारे में सोच रहा था

यदि यह कैटलॉग के साथ संभव नहीं है, तो मुझे केवल राफेल मानचित्र समाधान के लिए खोला गया है।

धन्यवाद

javascript web-mapping leaflet

— againstflow
स्रोत

1

मुझे लगता है कि यह संभव है। मैं इस उदाहरण को USC के मुख पृष्ठ पर देखता हूं:

// add a marker in the given location, attach some popup content to it and open the popup
L.marker([51.5, -0.09]).addTo(map)
    .bindPopup('A pretty CSS3 popup. <br> Easily customizable.').openPopup();

तो आप सामग्री के रूप में मार्कअप जोड़ सकते हैं। ऊपर br टैग देखें।

// add a marker in the given location, attach some popup content to it and open the popup
L.marker([51.5, -0.09]).addTo(map)
    .bindPopup('A pretty CSS3 popup. <div class="popup_custom_div"></div> Easily customizable.').openPopup();
//retrieve the div by class name take care if more then one maybe opened
var mydiv = document.getElementsByClassName( 'popup_custom_div' )[0];
mydiv.innerHTML = 'I am here';

— cavila
स्रोत

2

@Cavila द्वारा उत्तर समाधान का एक हिस्सा है। आप पॉपअप में चार्ट के लिए div टैग लगा सकते हैं, लेकिन तब मुद्दा उठता है, क्योंकि आपको तब ".openPopup ()" इवेंट सुनने की आवश्यकता होगी, तब रैप-कार्ट्स जावास्क्रिप्ट जावास्क्रिप्ट निष्पादित करें। यदि आप इसे उस घटना पर नहीं करते हैं, तो जब वह निष्पादित करता है तो उसे div टैग नहीं मिलेगा क्योंकि इसे DOM में नहीं डाला गया है। ऐसा लगता है कि लीफलेट ईवेंट सुनने का समर्थन करता है, इसलिए आपको ऊपर दिए गए कोड में कुछ इस तरह जोड़ना होगा:

map.on('popup', function(e) {
    //Run the chart code here like this
    var chart = new Charts.LineChart('chart1');
     chart.add_line({
        data: [[1, 828906, {tooltip: "my special point"}],[2, 566933],[3, 584150],[4,  
                 1072143],[5, 1622455],[6, 2466746],[7, 2427789]]
        });

     chart.draw();
});

— जेमी
स्रोत

तो OpenPopup () अतुल्यकालिक है? क्योंकि जावास्क्रिप्ट इंटरप्रेटर अगले स्टेटमेंट को तब तक निष्पादित नहीं करेगा, जब तक कि पिछले कॉलबैक के अलावा पिछले रिटर्न को समय पर निष्पादित नहीं किया जाता है। एक विकल्प यदि कोई घटना नहीं है, तो उस विंडो में "div" की मौजूदगी के लिए पूलिंग को अंजाम दिया जाएगा। ईवेंट कॉलबैक और अधिक तेज़ होगा।

— कैविला

1

एक तरीका यह होगा कि अपने निर्माताओं पर क्लिक की घटनाओं को सुनें और मक्खी पर चार्ट बनाएं। यहाँ एक उदाहरण है: http://jsfiddle.net/6UJQ4/

एक बात जो मुझे तब तक स्पष्ट नहीं थी जब तक मैंने खेलना शुरू नहीं किया है कि USC का bindPopup एक स्ट्रिंग या DOM नोड ले सकता है। ऊपर दिया गया उदाहरण DOM नोड बनाता है, इसे bindPopup में भेजता है और फिर चार्ट बनाता है।

— डेरेक स्विंगले
स्रोत

बहुभुज घटनाओं के लिए क्या यह संभव है? जब कुछ बहुभुज पर क्लिक किया जाता है, तो एक समान पॉपअप दिखाता है?

— againstflow

हां, संभव होना चाहिए। मेरा उदाहरण चार्ट के मान के रूप में 50 का उपयोग करने के लिए हार्डकोड किया गया है लेकिन आप चार्ट बनाने वाले फ़ंक्शन के अंदर कुछ भी कर सकते हैं।

— डेरेक स्विंगले

क्या आप मार्करों के साथ इस तरह से jsfiddle पर बहुभुज या जियोजोन डेटा के साथ एक उदाहरण लिख सकते हैं? मैं बहुत सराहना करूंगा।

— विगत