HTML5 Canvas सर्कल टेक्स्ट

Canvas में सर्कल के अंदर टेक्स्ट

Canvas में सर्कल के अंदर टेक्स्ट बनाने के लिए, उपयोग करें:

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);
    }
});

HTML

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

यह क्लिक स्थिति पर केंद्रित टेक्स्ट के साथ एक सर्कल ड्रॉ करता है।