html5贝塞尔,使用HTML5画布绘制贝塞尔曲线
是的,請使用HTML canvasbezierCurveTo()方法在HTML5中繪制Bezier曲線。
示例
您可以嘗試運行以下代碼以使用畫布繪制貝塞爾曲線:HTML>
#test?{
width:?100px;
height:100px;
margin:?0px?auto;
}
function?drawShape(){
//使用DOM獲取canvas元素
var?canvas?=?document.getElementById('mycanvas');
//確保不支持畫布時不執行
if?(canvas.getContext){
//使用getContext使用畫布進行繪制
var?ctx?=?canvas.getContext('2d');
ctx.beginPath();
ctx.moveTo(75,40);
ctx.bezierCurveTo(75,37,70,25,50,25);
ctx.bezierCurveTo(20,25,20,62.5,20,62.5);
ctx.bezierCurveTo(20,80,40,102,75,120);
ctx.bezierCurveTo(110,102,130,80,130,62.5);
ctx.bezierCurveTo(130,62.5,130,25,100,25);
ctx.bezierCurveTo(85,25,75,37,75,40);
ctx.fill();
}?else?{
alert('You?need?Safari?or?Firefox?1.5+?to?see?this?demo.');
}
}
總結
以上是生活随笔為你收集整理的html5贝塞尔,使用HTML5画布绘制贝塞尔曲线的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 王者荣耀女网名大全80个
- 下一篇: 描写春节的优美句子241个