<!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>
canvas 点 绘制
最后编辑于 :
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。
推荐阅读更多精彩内容
- 前言 html5Canvas的知识点,是开发的必备技能,在实际工作中也常常会涉及到。 最近熬夜总结html5Can...
- github: https://github.com/dujingya/getCavasColor 直接贴代码,自...
- 1.定时循环操作的三个函数 对于动画,需要在一段时间内渲染不同的帧,各帧间隔一定的时间在画布中依次被绘制。...