发表于: 2017-06-24 22:17:44

0 917


今天完成的事情:

学习了一部分的canvas


明天计划的事情:

1.完成搜索公司功能。

2.开始写公司详情页。


遇到的困难:

在写推荐公司的过程中理解竖向轮播的原理花了一些时间。其它的倒没有什么。


收获:

1.关于canvas

什么是canvas?

<canvas> 标签用于绘制图像,通常都是使用js来完成实际的绘图任务。

2.浏览器的兼容

Internet Explorer 9、Firefox、Opera、Chrome 以及 Safari 支持 <canvas> 及其属性和方法。

3.通过canvas标签中的width和height属性来改变画布的·宽高。

4.如果要使用canvas绘图的话,就必须使用js来完成绘图功能。

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.fillStyle="#FF0000";
ctx.fillRect(0,0,150,75);

在这里面

var c=document.getElementById("myCanvas");

获取找到<canvas>元素(注意,不是节点!)

var ctx=c.getContext("2d");

然后,创建context对象(canvas只能完成2D效果),所以是2D,3D效果就交给three.js来完成,不是canvas的内容。

ctx.fillStyle="#FF0000";

fillStyle属性为填充颜色。

ctx.fillRect(0,0,150,75);

fillRect属性原点(0,0)的基础上建立一个长为150px,宽为75px的边框,所以和fillStyle属性组合在一起就是一个长为150px,宽为75px的长方形了。



返回列表 返回列表
评论

    分享到