स्थानीय हार्डड्राइव पर एचटीएमएल 5 कैनवास छवि को सहेजना

Question

मैंने kineticjs लाइब्रेरी का उपयोग कर एचटीएमएल 5 कैनवास पर आकार बनाए थे। अब मैं कैनवास को अपने स्थानीय सिस्टम हार्डड्राइव पर एक छवि के रूप में सहेजना चाहता हूं। कृपया मुझे बताएं कि मैं KineticJS लाइब्रेरी का उपयोग करके इसे कैसे प्राप्त कर सकता हूं।

Answer 1

कैनवास का चयन करने के बाद (document.getElementById मुझे लगता है) का उपयोग करके, आप कैनवास को dataURL में कनवर्ट करने के लिए निम्न को कॉल करने में सक्षम होना चाहिए।

एक बार जब आपको वह यूआरएल मिल जाए, तो उसे एक और ब्राउज़र विंडो में खोलें और मानक राइट क्लिक-> छवि को सहेजें, और इसे जेपीजी/पीएनजी/आदि के रूप में सहेजें।

var canvas = document.getElementById("mycanvas"); 
var img = canvas.toDataURL("image/png"); 

या नहीं, आप प्रोग्राम ड्राइव पर छवि को बचाने के लिए कर रहे हैं, मैं नहीं यकीन है कि, हालांकि मैं इसे सुरक्षा प्रतिबंधों के कारण अत्यधिक शक होता हूँ।

प्रोग्राम सिस्टम से प्रोग्राम सिस्टम तक पहुंचने के बारे में अधिक जानकारी के लिए, इस HTML5 फ़ाइल सिस्टम संदर्भ साइट को देखें।

http://www.html5rocks.com/en/tutorials/file/filesystem/

एक KinectJS स्टेज कैनवास तत्व के लिए एक dataURL पुन: प्राप्त करने के बारे में अधिक जानकारी के लिए नीचे दिए गए स्निपेट/यूआरएल देखें।

<script> 
    stage.toDataURL({ 
    callback: function(){ 
     // do something with the data url 
    }, 
    mimeType: 'image/jpeg', 
    quality: 0.5 
    }); 
</script> 

http://www.html5canvastutorials.com/kineticjs/html5-canvas-stage-data-url-with-kineticjs/