需要在画布上像绘画应用程序那样创建多个圆圈

问题描述

| 单击圆按钮时，我需要创建一个圆，就像绘画中的圆一样。需要根据用户需要绘制。 如何通过使用Jquery，HTML5和CSS3来工作？？？ 我需要一个这样的应用程序： 任何人都知道这请帮助我 我为单个圆圈创建了事件，该事件可拖动。如何在该部分添加更多图像。

<script>
function draw_circle() {

 var canvasObj = document.getElementById(\"mycanvas\");

 var canvasCtx = canvasObj.getContext(\"2d\");

 canvasCtx.beginPath();

 canvasCtx.arc(100,100,50,Math.PI*2,true);

    var centerX = 288;
    var centerY = 100;
    var radius = 70;


    canvasCtx.fillStyle = \"#CB5155\";
    canvasCtx.fill();
    canvasCtx.lineWidth = 5;
    canvasCtx.strokeStyle = \"black\";
    canvasCtx.stroke();

}

    $(function() {
        $( \"#mycanvas\" ).draggable();
    });


</script>

<canvas id=\"mycanvas\" width=\"200\" height=\"200\"/></canvas>

    

解决方法

        jCanvas jQuery插件是一个潜在的解决方案。

$(\'#mycanvas\').drawArc({
  fillStyle: \'#CB5155\',x: 288,y: 100,radius: 70,strokeStyle: \'black\',lineWidth: 5
});

$(\'#mycanvas\').drawArc({
  fillStyle: \'#442299\',x: 188,y: 70,radius: 30,strokeStyle: \'blue\',lineWidth: 2
});

那应该在画布上画两个圆。冲洗并重复。