画布上指的是什么意思

介绍

这篇文章主要介绍了画布上指的是什么意思,具有一定借鉴价值,需要的朋友可以参考下。希望大家阅读完这篇文章后大有收获。下面让小编带着大家一起了解一下。

<强>画布是什么意思?

英文中画布的意思是“画”布,不过这里说的画布是HTML5中新出的一个元素,开发者可以在上面绘制一系列图形.Canvas在HTML文件中的写法很简单:

& lt;帆布id=癱anvas"宽度=翱矶取?身高=案叨取白４? lt;/canvas>

其中id属性是所有HTML元素都可以用的,帆布自带的属性只有后面两个(分别控制宽度,高度),没有其它的了。至于兼容性,CanIUse上面写了,基础的功能目前用户使用的90%的浏览器都支持,所以大部分情况下还是可以放心使用的。

注意,一定要使用帆布自带的宽度和高度属性,不要使用CSS来控制,因为CSS控制会导致帆布变形。可以试着与PhptpShop对比一下,后者是改变“图像大小”,前者才是正确的改变“画布大小”。例如下图是三张图片的横向拼接:最左边的黑框中是大小为50 px * 50 px的原图,中间是改变了图像大小为100 px * 100 px的效果,图像变得模糊,但是对于图像本身来说坐标范围并没有变大,最右边才是正确的100 px * 100像素的画布上。

帆布绝大部分的绘图方法都与& lt; canvas>标签无关,需要使用JavaScript对其进行操作,这就是所谓的画布API。

我们首先获取到这个元素:

var帆布=. getelementbyid(& # 39;帆布# 39;);

然后通过一个方法来获取可以调用一切画布API的入口:

var ctx=canvas.getContext (& # 39; 2 d # 39;);

看到2 d是不是很激动地联想到有没有3 d呢?没有3 d的写法,不过如果想要开启3 d世界的大门,则可以写canvas.getContext (& # 39; WebGL # 39;)。然而WebGL是基于OpenGL ES 2.0的一套标准,与本文是彻彻底底的两条路,因此这里就不讨论了。

感谢你能够认真阅读完这篇文章,希望小编分享帆布指的是什么意思内容对大家有帮助,同时也希望大家多多支持,关注行业资讯频道,遇到问题就找,详细的解决方法等着你来学习!

画布上指的是什么意思