关于fill?
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
canvas {
background-color: cadetblue;
}
</style>
</head>
<body>
<canvas id="canvas" width="500" height="500"></canvas>
<script>
var ctx = canvas.getContext("2d");
ctx.fillStyle = "red";
ctx.arc(250, 250, 100, 0, 2 * Math.PI, true);
//ctx.fill();
ctx.clip();
ctx.fillStyle = "pink";
ctx.fillRect(150, 150, 100, 100);
ctx.fill();
// ctx.beginPath();
// ctx.fillStyle = "blue";
// ctx.fillRect(250, 150, 100, 100);
// ctx.fill();
// ctx.beginPath();
// ctx.fillStyle = "orange";
// ctx.fillRect(150, 250, 100, 100);
// ctx.fill();
// ctx.beginPath();
// ctx.fillStyle = "red";
// ctx.fillRect(250, 250, 100, 100);
// ctx.fill();
</script>
</body>
</html>
这样的效果为什么是这样啊 ?
这里的fill我有点晕了
设置fil() 整个区域都会覆盖 不设置fill() 就只会覆盖fillRect()
正在回答 回答被采纳积分+1
- 参与学习 人
- 提交作业 622 份
- 解答问题 6815 个
微信带火了小程序,也让前端工程师有了更多的展现机会,本阶段带你从移动基础知识的学习到webAPP开发,及小程序开发,让你PC端与移动端两端通吃。
了解课程




恭喜解决一个难题,获得1积分~
来为老师/同学的回答评分吧
0 星