राफेल कैनवास (पृष्ठभूमि) ऑनक्लिक घटना

Question

मैं कैनवास पर ड्रैग और ड्रॉप आकार बनाने के लिए राफेल के साथ काम कर रहा हूं। मैं अपने इवेंट फ़ंक्शंस के साथ .drag() फ़ंक्शन (राफेल फ्रेमवर्क में आपूर्ति) का उपयोग करके ऐसा करता हूं। मुझे ऐसा करने में कोई समस्या नहीं है।

मेरे पास एक ऐसा फ़ंक्शन भी है जो DblClick पर एक नया आकार बनाता है, समस्या यह है कि मैं केवल ईवेंट को आकार, या अन्य तत्वों को जोड़ सकता हूं।

एक आकार करने के लिए घटनाओं को जोड़ने इतना तरह काम करता है: घटनाओं क्लिक संलग्न करने के लिए एक तरह से

R = Raphael("canvas", "100%", "100%"), 
    R.dblclick(myDblClick); 

किसी को भी पता है:

R = Raphael("canvas", "100%", "100%"), 
    R.rect(100, 100, 25, 50).attr({fill: fillColor}).dblclick(myDblClick); 

कैनवास पर एक ही सिद्धांत का प्रयोग काम नहीं करता है कैनवास के लिए, यानी मैं div (आकार को छोड़कर) में कहीं भी क्लिक कर सकता हूं और ईवेंट ट्रिगर हो जाएगा।

धन्यवाद।

Answer 1

मैं कैनवास नोड (या माता-पिता नोड जिसमें #canvas तत्व शामिल है) में नियमित रूप से क्लिक ईवेंट (वेनिला जावास्क्रिप्ट, या जो भी जेएस फ्रेमवर्क आप उपयोग कर रहे हैं) से जुड़ा होगा।

jQuery के साथ

:

//Bound to canvas 
$('#canvas').bind('dblclick', myDblClick); 
//Bound to parent 
$('#canvas').parent().bind('dblclick', myDblClick); 

अन्यथा, यदि आप मृत सेट राफेल घटनाओं के प्रयोग पर कर रहे हैं, आप एक आयत पूरे कैनवास पर चित्रकारी सकता है, और उस पर कब्जा क्लिक ईवेंट। लेकिन यह बहुत अधिक उपर की तरह लगता है।

Answer 2

के रूप में स्वीकार किए जाते हैं जवाब मेरे लिए काम नहीं किया (हालांकि यह सही रास्ते पर मुझे मिल किया था) मैंने सोचा कि मैं यह कैसे मामले में हल मैं पोस्ट करेंगे मेरी स्थिति में किसी और वहाँ है ...

//Create paper element from canvas DIV 
var canvas = $("#Canvas"); 
paper = Raphael("Canvas", canvas.width(), canvas.height()); 

//Register Event 
$("#Canvas").click(CanvasClick); 

//Event Handler 
function CanvasClick(e) { 
    if (e.target.nodeName == "svg") 
    { 
     //This will only occur if the actual canvas area is clicked, not any other drawn elements 
    } 
} 

Answer 3

आईई compatiblity के साथ musefans समाधान। धन्यवाद

//Create paper element from canvas DIV 
var canvas = $("#Canvas"); 
paper = Raphael("Canvas", canvas.width(), canvas.height()); 

$("#canvas").click(canvasClick); 

canvasClick: function(e) { 
    if (e.target.nodeName == "svg" || e.target.nodeName == "DIV") 

},