<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>canvas 点 绘制</title>
<style>
#canvas {
background-color: #f9f9f9;
}
</style>
</head>
<body>
<canvas id="canvas">浏览器不支持 canvas </canvas>
</body>
<script>
var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");
canvas.height = 500
canvas.width = 500
// 画一个点，大小为1x1像素，实际上是绘制一个1px的正方形
function drawPoint(x, y, color) {
ctx.fillStyle = color;
ctx.fillRect(x, y, 1, 1);
}
drawPoint(100, 100, "red");
</script>
</html>
网友评论