छवि के रूप में कई कैनवास तत्व सहेजें

Question

मेरे पास कैनवास की 3 परतें हैं - 1 मैट्रिक्स है, 2 & 3 ग्राफिक्स है, उन्हें एक छवि में कैसे संरक्षित किया जाए?

<div style="position: relative;"> 
<canvas id="matix" width="100" height="100" 
    style="position: absolute; left: 0; top: 0; z-index: 0;"></canvas> 
<canvas id="layer1" width="100" height="100" 
    style="position: absolute; left: 0; top: 0; z-index: 0;"></canvas> 
<canvas id="layer2" width="100" height="100" 
    style="position: absolute; left: 0; top: 0; z-index: 1;"></canvas> 
</div> 

Answer 1

आप ctx.drawImage(other_canvas,0,0)

साथ दूसरे में एक कैनवास आकर्षित कर सकते हैं आपको लगता है कि सही क्रम में, आप सभी कैनवास सामग्री सही ढंग से उनमें से एक में स्तरित होगा करते हैं।

यदि आप छवि को सहेजना चाहते हैं, तो आप बेस 64 एन्कोडेड पीएनजी फ़ाइल के रूप में सामग्री प्राप्त करने के लिए canvas.toDataURL() पर कॉल कर सकते हैं।