2011-05-30 18 views
1

我需要在圆形按钮中单击时创建圆形,例如绘制圆形。需要绘制尽可能多的用户需求。需要在画布中创建多个圆形,就像绘制应用程序一样

如何使用jquery,HTML5和CSS3工作?

我需要一个应用程序像this

任何身体知道这个,请帮助我 我为单圈创建的事件,这是一个可拖动。如何在该部分添加更多图像。

<script> 
function draw_circle() { 

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

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

canvasCtx.beginPath(); 

canvasCtx.arc(100,100,50,0,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> 

回答

3

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

这应该在画布上绘制2个圆圈。冲洗并重复。

+0

嗨,感谢您回答我的问题 – 2011-05-31 04:57:42

+0

@您 - 日 - 如果答案回答您的问题,最好将其标记为答案。它不仅礼貌,而且会鼓励人们回答您可能遇到的任何其他问题。 – devmatt 2011-06-06 16:50:44

相关问题