/**
* 根据点绘制任意图形
* @param {*} ctx 画笔
* @param {*} points 点坐标数组
* @param {*} color 填充颜色
*/
drawAnyShape = (ctx, points, color) => {
ctx.save()
ctx.beginPath() //开始路径
ctx.lineWidth = 0 //设置边框为0
ctx.fillStyle = color //设置填充颜色
ctx.moveTo(points[0].x, points[0].y) //将画笔移动到第一个顶点
for (let i = 1; i < points.length; i++) {
ctx.lineTo(points[i].x, points[i].y) //绘制直线到第二个顶点
}
ctx.closePath() //闭合路径
ctx.fill() //填充颜色
ctx.restore()
}
const cameraRangePoints = [
{x: 600, y: 200},
{x: 670, y: 160},
{x: 660, y: 230},
{x: 640, y: 250},
]
drawAnyShape(canvasCtx, cameraRangePoints, 'red')
canvas上绘制一个无边框线的红色填充梯形
于 2023-12-05 12:37:13 首次发布