首页canvas画一个六边形线条颜色是红色并且平正上方是平的

canvas画一个六边形线条颜色是红色并且平正上方是平的

时间: 2024-05-13 14:16:12 浏览: 257

以下是画一个红色线条的平正六边形的Canvas代码： ```html <canvas id="myCanvas"></canvas> ``` ```javascript var canvas = document.getElementById("myCanvas"); var ctx = canvas.getContext("2d"); //设置线条颜色为红色 ctx.strokeStyle = "#FF0000"; //计算六边形的顶点坐标 var x = canvas.width / 2; var y = canvas.height / 2; var radius = 100; var angle = 2 * Math.PI / 6; var points = []; for (var i = 0; i < 6; i++) { points.push({x: x + radius * Math.cos(i * angle), y: y + radius * Math.sin(i * angle)}); } //绘制六边形 ctx.beginPath(); for (var i = 0; i < 6; i++) { ctx.lineTo(points[i].x, points[i].y); } ctx.closePath(); ctx.stroke(); ``` 要注意的是，这个六边形的平正上方是垂直于水平方向的，也就是没有倾斜。如果需要倾斜的六边形，需要调整顶点坐标的计算方式。

阅读全文