Computer >> कंप्यूटर >  >> प्रोग्रामिंग >> HTML

कैनवास के साथ HTML कैनवास को एक छवि के रूप में कैसे सहेजना है। toDataURL ()?


कैनवास का छवि डेटा URL प्राप्त करने के लिए toDataURL() विधि का उपयोग करें। यह ड्राइंग (कैनवास) को 64 बिट एन्कोडेड पीएनजी यूआरएल में बदल देता है।

उदाहरण

कैनवास को छवि के रूप में सहेजने के लिए आप निम्न कोड चलाने का प्रयास कर सकते हैं -

<!DOCTYPE HTML>
<html>
   <head>
   </head>
   <body>
      <canvasid = "newCanvas" width = "450" height = "300"></canvas>
      <script>
         var canvas = document.getElementById('newCanvas');
         var ctx = canvas.getContext('2d');
         // draw any shape
         ctx.beginPath();
         ctx.moveTo(120, 50);
         ctx.bezierCurveTo(130,100, 130, 250, 330, 150);
         ctx.bezierCurveTo(350,180, 320, 180, 240, 150);
         ctx.bezierCurveTo(320,150, 420, 120, 390, 100);
         ctx.bezierCurveTo(130,40, 370, 30, 240, 50);
         ctx.bezierCurveTo(220,7, 350, 20, 150, 50);
         ctx.bezierCurveTo(250,5, 150, 20, 170, 80);
         ctx.closePath();
         ctx.lineWidth = 3;
         ctx.fillStyle ='#F1F1F1';
         ctx.fill();
         ctx.stroke();
         var dataURL =canvas.toDataURL();
      </script>
   </body>
</html>

  1. HTML कैनवास शैडोकलर प्रॉपर्टी

    छाया के लिए रंग सेट करने के लिए HTML कैनवास की शैडोकलर संपत्ति का उपयोग किया जाता है। डिफ़ॉल्ट मान #000000 है। निम्नलिखित वाक्य रचना है - ctx.shadowColor=color; ऊपर, छाया के लिए रंग सेट करें। आइए अब कैनवास के शैडोकलर गुण को लागू करने के लिए एक उदाहरण देखें - उदाहरण <!DOCTYPE html> <html&

  1. HTML कैनवास मूल बातें

    वेब पेज पर कैनवास बनाने के लिए, HTML5 कैनवास तत्व का उपयोग करें। तत्व आपको जावास्क्रिप्ट का उपयोग करके ग्राफिक्स बनाने की अनुमति देता है। कैनवास के साथ, एक रेखा, आयत, बेज़ियर वक्र, आदि बनाएं। प्रत्येक कैनवास में दो तत्व होते हैं जो कैनवास की ऊंचाई और चौड़ाई का वर्णन करते हैं अर्थात क्रमशः ऊंचाई और

  1. कैसे matplotlib.pyplot के साथ एक छवि को बचाने के लिए?

    matplotlib.pyplot.savefig() . के साथ एक छवि सहेजने के लिए , हम निम्नलिखित कदम उठा सकते हैं - आकृति का आकार सेट करें और सबप्लॉट के बीच और आसपास पैडिंग समायोजित करें। numpy का उपयोग करके x और y डेटा बिंदु बनाएं। प्लॉट x और y डेटा पॉइंट प्लॉट () . का उपयोग करके विधि। आंकड़ा सहेजने के लिए, savefig() us