[html] 第123天使用canvas画出一个矩形 #1073

Open

Open

[html] 第123天使用canvas画出一个矩形#1073

Labels

第123天使用canvas画出一个矩形

added

on Aug 16, 2019

<canvas width="1000" height="500" id="cvs"></canvas>
...
<script>
document.getElementById('cvs').getContext('2d').fillRect(100, 100, 800, 300)
</script>

<canvas id="canvas" width="300" height="300"></canvas>

<script>
  var canvas = document.getElementById("canvas")
  if(canvas.getContext){
    var ctx = canvas.getContext("2d")
    ctx.fillStyle="rgb(200,0,0)"
    ctx.fillRect(10,10,60,30)
  }
</script>

<script> var canvas = document.getElementById('canvas'); var ctx = canvas.getContext('2d'); ctx.beginPath(); ctx.rect(200,200,100,100); ctx.closePath(); ctx.stroke(); </script>

Canvas 中内置的图形只有矩形，其余图形都需要通过路径来进行绘制。可以使用 canvas 的 fillRect 方法来绘制矩形。

参考文档：MDN Canvas 教程

mentioned this

on Jan 17, 2021

[html] 第643天使用svg画出一个矩形 #3451

to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Assignees

No one assigned

Labels

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Participants