本帖最后由 马黑黑 于 2024-4-30 18:51 编辑
代码(去掉注释可以填充颜色)
<canvas id="canv" width="400" height="400"></canvas>
<script>
var ctx = canv.getContext('2d');
var x = 50, y = 150, width = 200;
var curX = x, curY = y;
points = [
{x: x + width, y: y}, // 1
{x: x, y: y}, // 2
{x: x, y: y + width}, // 3
{x: x + width, y: y + width}, // 4
{x: x + width*3/2, y: y + width/2}, // 5
{x: x + width*3/2, y: y - width/2}, // 6
{x: x + width/2, y: y - width/2}, // 7
{x: x + width/2, y: y + width/2} // 8
];
ctx.strokeStyle = 'cyan';
//ctx.fillStyle = 'rgba(0,128,128,.4)';
var draw = () => {
ctx.beginPath();
ctx.moveTo(points[0].x, points[0].y);
for(var j = 1; j < points.length; j ++) {
ctx.lineTo(points[j].x, points[j].y);
}
ctx.lineTo(points[2].x, points[2].y);
ctx.stroke();
};
draw();
//ctx.fill();
ctx.translate(200,200);
ctx.rotate(180 * Math.PI / 180);
ctx.translate(-200,-200);
draw();
//ctx.fill();
</script>
| 
发表于 2024-4-30 18:44
提升卡
置顶卡
沉默卡
喧嚣卡
变色卡
千斤顶
显身卡
楼主
