HTML5使用canvas绘制图形

最新推荐文章于 2024-04-20 16:29:18 发布

乞力马扎罗的雪CYF

最新推荐文章于 2024-04-20 16:29:18 发布

阅读量1.7k

点赞数 1

分类专栏： HTML5 文章标签： html5 javascript 图形

本文链接：https://blog.csdn.net/chenyufeng1991/article/details/48769199

版权

1.绘制图形

canvas元素本身是没有绘图能力的。所有的绘制工作必须在JavaScript内部完成。

示例代码如下：

（1）新建一个HTML文件，实现代码如下：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>

    <script src="app.js"></script>

</body>
</html>

（2）新建一个JavaScript文件，实现代码如下：

/**
 * Created by chenyufeng on 15/9/27.
 */
var CANVAS_WIDTH = 2000, CANVAS_HEIGHT = 2000;
var mycanvas,context;

window.onload = function(){

    createCanvas();
    drawRect();

};

function createCanvas(){

    document.body.innerHTML = "<canvas id=\"mycanvas\" width=\""+CANVAS_WIDTH+"\" height=\""+CANV

最低0.47元/天解锁文章

乞力马扎罗的雪CYF

关注

1
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
HTML5使用canvas绘制图形

1.绘制图形canvas元素本身是没有绘图能力的。所有的绘制工作必须在JavaScript内部完成。示例代码如下：（1）新建一个HTML文件，实现代码如下：（2）新建一个JavaScript文件，实现代码如下：/** * Created by chenyufeng on 15/9/27. */var CANVA
复制链接

扫一扫

专栏目录