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

HTML5 कैनवास सर्किल टेक्स्ट


कैनवास में मंडलियों के अंदर एक टेक्स्ट बनाने के लिए, −

. का उपयोग करें
context.beginPath();

उदाहरण

कैनवास निम्नलिखित है -

$("#demo").on("click", "#canvas1", function(event) {
   var canvas = document.getElementById('canvas1');
      if (canvas.getContext) {
         var context = canvas.getContext("2d");
         var w = 25;
         var x = event.pageX;
         var y = Math.floor(event.pageY-$(this).offset().top);
         
         context.beginPath();
         context.fillStyle = "blue";
         context.arc(x, y, w/2, 0, 2 * Math.PI, false);
         context.fill();
         context = canvas.getContext("2d");
         context.font = '9pt';
         context.fillStyle = 'white';
         context.textAlign = 'center';
         context.fillText('amit', x, y+4);
      }
});

एचटीएमएल

<div id = demo>
   <canvas id = canvas1></canvas>
</div>

  1. HTML5 कैनवास पर यादृच्छिक रंग वर्गों से भरा एक वृत्त बनाएं

    जब हमें एक वृत्त को 1x1 पिक्सेल से भरने की आवश्यकता होती है, सभी एक ब्राउज़र में अलग-अलग रंगों के साथ, हम इस तरह एक सरल दृष्टिकोण का उपयोग कर सकते हैं: एक कैनवास पर 200x200 ग्रिड में कुछ यादृच्छिक रंगों के साथ सभी पिक्सेल खींचना समग्र मोड बदलना ऊपर वृत्त बनाना आइए एक उदाहरण देखते हैं: var canvas

  1. एक HTML5 कैनवास तत्व प्रिंट करें

    HTML5 कैनवास तत्व प्रदर्शित करने के लिए कोड स्निपेट निम्नलिखित है। <a href = "javascript:print_voucher()">PRINT CANVAS</a> function print_canvas() {    $("#canvas_voucher").printElement(); } यहां कैनवास_वाउचर कैनवास तत्व की आईडी है। इसे कार्य करने के लिए हमे

  1. HTML5 कैनवास परिवर्तन

    HTML5 कैनवास ऐसे तरीके प्रदान करता है जो सीधे रूपांतरण मैट्रिक्स में संशोधन की अनुमति देता है। रूपांतरण मैट्रिक्स प्रारंभ में पहचान परिवर्तन होना चाहिए। फिर इसे रूपांतरण विधियों का उपयोग करके समायोजित किया जा सकता है। उदाहरण आइए कैनवास परिवर्तन का एक उदाहरण देखें: function drawShape(){// DOM वर