2009-10-07 16 views
13

मेरे पास ग्राफ़िक बनाने के लिए कैनवास टैग है। मेरी लाइन के प्रत्येक खंड में, मेरे पास 'माउसओवर' सक्षम करने और अधिक विस्तार प्रदर्शित करने के लिए "डॉट" है।कैनवास टैग में addEventListener

जब मैं इस डॉट पर कोई ईवेंट श्रोता नहीं जोड़ता तब सबकुछ ठीक काम करता है।

Firebug मुझे चेतावनी है: s.addEventListener कार्य नहीं है ...

यह गतिशील घटना श्रोता बनाने के लिए संभव है? (मैं जावास्क्रिप्ट में नया हूं)

+0

कुछ कोड हमें मदद करेंगे ... –

उत्तर

25

आप डीओएम ऑब्जेक्ट्स (तत्वों) के अलावा अन्य चीज़ों पर डोम ईवेंट संलग्न नहीं कर सकते हैं। canvas एक डोम तत्व है, जो चीजें आप कैनवास में चित्रित कर रहे हैं वे नहीं हैं। वे कैनवास का एक हिस्सा आईएमजी के पिक्सेल के रूप में बन जाते हैं।

अपने कैनवास पर किसी विशिष्ट बिंदु पर क्लिक का पता लगाने के लिए आपको कैनवास तत्व पर क्लिक ईवेंट संलग्न करना होगा, और उसके बाद क्लिक कैनवास के समन्वय के साथ क्लिक ईवेंट के x/y निर्देशांक की तुलना करें। "How do I get the coordinates of a mouse click on a canvas element?"

+0

बहुत बहुत धन्यवाद। मैं कैनवास में अन्य कैनवास बनाने में अधिक रुचि रखता हूं ताकि उन्हें ईवेंट श्रोता जोड़ा जा सके लेकिन वे दिखाई नहीं दे रहे हैं (शायद वे मुख्य कैनवास के पीछे हैं)। वैसे भी मैं अब माउस स्थिति की तुलना में घटना का पता लगाने के लिए एक रास्ता तलाश रहा हूं। फिर से धन्यवाद :-) – kadiks

+0

[Easel js framework] (http://easeljs.com) का उपयोग करें, यह आकृतियों के आकार में माउस इंटरैक्शन जोड़ने को बहुत सरल बनाता है – Neil

4

तुम बुनियादी संरचनाओं को आकर्षित कर रहे हैं, मैं तुम्हें इनलाइन svg का उपयोग करने का सुझाव देते हैं:

इस में जवाब दिया गया था।

इस मामले में, सभी svg तत्व डोम तत्व बन जाते हैं और आप उनमें से प्रत्येक को अलग-अलग ईवेंट संलग्न कर सकते हैं।