首页用canvas画一个爱心

用canvas画一个爱心

时间: 2023-02-21 19:43:25 浏览: 33

下面是一个简单的代码示例，使用canvas画一个爱心： ``` <!DOCTYPE html> <html> <head> <style> canvas { border: 1px solid black; } </style> </head> <body> <canvas id="myCanvas" width="200" height="200"></canvas> <script> var canvas = document.getElementById("myCanvas"); 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.fillStyle = "#FF0000"; ctx.fill(); </script> </body> </html> ``` 这是一个简单的例子，你可以通过更改参数和样式来定制自己的爱心图形。

阅读全文