| 上一月 | 一 | 下一月 | ||||
| 日 | 一 | 二 | 三 | 四 | 五 | 六 |
HTML5 Canvas元素是一个类似于div，a或<able标记的HTML标记，但其内容是使用JavaScript呈现的。 为了利用HTML5 Canvas，我们需要将canvas标签放在HTML文档中的某个位置，使用JavaScript访问canvas标签，创建上下文，然后利用HTML5 Canvas API绘制可视化。
使用画布时，了解画布元素和画布上下文之间的区别非常重要，因为人们经常会混淆这些。 canvas元素是嵌入在HTML页面中的实际DOM节点。 画布上下文是一个具有属性和方法的对象，可用于在canvas元素内呈现图形。 上下文可以是2d或webgl（3d）。
每个canvas元素只能有一个上下文。 如果我们多次使用getContext（）方法，它将返回对同一上下文对象的引用。
1230博客
<!DOCTYPE HTML>
<html>
<head>
<style>
body {
margin: 0px;
padding: 0px;
}
</style>
</head>
<body>
<canvas id="myCanvas" width="578" height="200"></canvas>
<script>
var canvas = document.getElementById('myCanvas');
var context = canvas.getContext('2d');
// do cool things with the context
context.font = '40pt Calibri';
context.fillStyle = 'blue';
context.fillText('Hello World!', 150, 100);
</script>
</body>
</html>
热门推荐：