【网站建设管理系统】河北网站建设公司，河北网站设计公司，河北网站制作公司，河北网站建设，河北网站设计，河北网站制作
通过JavaScript绘制图形
<canvas>兀素只是图形容器，其本身是没有绘图能力的，所有的绘制工作必须在JavaScripti内部完成。
在画布上绘图的核心是上下文对象CanvasRenderingContext2D，用户可以在JavaScript代码中使用getContext()方法渲染上下文进而在画布上显示形状和文本。
JavaScript使用getElementById方法通过canvas的id定位canvas元素，例如以下代码：
var myCanvas= document.getElementById(’myCanvas’);
然后，创建context对象，例如以下代码：
var myContext= myCanvas.getContext(”2d”);
getContext()方法使用一个上下文作为其参数，一旦渲染上下文可用，程序就可以调用各种绘图方法。表5-7列出了渲染上下文对象的常用方法。
表5-7渲染上下文对象的常用方法
| 方 法 | 描 述 |
| fdlRect() | 绘制‘个填充的矩形 |
| strokeRect() | 绘制一个矩形轮廓 |
| clearRect() | 清除画布的矩形区域 |
| lineTo() | 绘制一条直线 |
| arc0 | 绘制圆弧或圆 |
| moveTo() | 当前绘图点移动到指定位置 |
| beginPath() | 开始绘制路径 |
| closePath() | 标记路径绘制操作结束 |
| stroke() | 绘制当前路径的边框 |
| fiUO | 填充路径的内部区域 |
| fiIIText() | 在画布上绘制一个字符串 |
| createLinearGradient() | 创建一条线性颜色渐变 |
| drawImage() | 把一幅图像放置到画布上 |
需要说明的是，canvas画布的左上角为坐标原点(0，0)。
1．绘制矩形
(1)绘制填充的矩形
fillRect()方法用来绘制填充的矩形，语法格式为：
本文地址:
http://www.yishenzhou.com/yes/post/343.html | 分类:企业网站制作 |
次阅读
