热门关键字:
jquery > jquery教程 > jquery教程 > 画布(Canvas)

画布(Canvas)

416
作者:管理员
发布时间:2020/7/14 17:30:44
评论数:0
转载请自觉注明原文:http://www.jq-school.com/Show.aspx?id=2125

要在网页上创建图形,HTML5 使用 画布 API。我们可以用它绘制任何东西,并且它使用 JavaScript。它通过避免从网络下载图像而提高网站性能。使用画布,我们可以绘制形状和线条、弧线和文本、渐变和图案。此外,画布可以让我们操作图像中甚至视频中的像素。你可以将 canvas 元素添加到 HTML 页面,如下所示:

<canvas id="myCanvas" width="200" height="100"></canvas>

画布元素不具有绘制元素的功能。我们可以通过使用 JavaScript 来实现绘制。所有绘画应在 JavaScript 中。

<script type="text/javascript">

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

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

cxt.fillStyle="blue";

cxt.storkeStyle = "red";

cxt.fillRect(10,10,100,100);

cxt.storkeRect(10,10,100,100);

</script>

以上脚本的输出如图 6 所示。

你可以绘制许多对象,如弧、圆、线/垂直梯度等。





如果您觉得本文的内容对您的学习有所帮助:支付鼓励



关键字:众筹系统 众筹系统开发 众筹平台,公益众筹
友荐云推荐