用于帆布|实际例子

时间:2012-09-21 16:25:12

标签: javascript canvas

我试图了解人们使用画布的原因?

我在工作发布中看到它,我在Definitive JavaScript中读到它,但我不太了解它的用途。

据我所知,您可以绘制2d或3d(通常是2d)对象,但为什么不使用Gimp或Photoshop并上传图像。

是否可以根据说...用户特定数据创建动态图像?

什么是实际示例,或者可能是画布专业实现的链接(定义JavaScript显示基础内容,如绘制圆圈)。

MDN Tutorial

4 个答案:

答案 0 :(得分:5)

我使用画布绘制图形,如果浏览器不支持<canvas>,它会回退到请求PHP生成的图像。将处理从服务器委托给客户端始终是一个好主意,因为这会减少服务器上的负载。换句话说,服务器不是“这里的东西”,而是更像是“这里是数据和说明”。

我看到的另一个用途是在鼠标悬停时突出显示图像地图的区域。

<canvas>是HTML5游戏开发的核心,因为它用于绘制整个游戏视口。没有它,就没有游戏。

答案 1 :(得分:1)

  

是否可以根据说...用户特定数据创建动态图像?

答案 2 :(得分:1)

我们使用&lt; canvas&gt;在我们的电子商务商店中为服装构建交互式设计编辑器 - http://printio.ru/tees/new

我们提供的交互方式直到最近才能使用Flash。

即使在后端,我们也使用Node.js和基于&lt; canvas&gt;的图像处理+生成来从在线编辑器中获取数据,并创建稍后在store中使用的设计。这些帆布生成的设计最终印在T恤,马克杯,帽子,袋子等上。

我认为这是一个非常实用的例子:)

这一切都是通过Fabric.js canvas library(由我们开发)完成的。

答案 3 :(得分:0)

<canvas>用于提高性能。 <canvas>比jpeg或其他任何东西都更快更有活力。示例:http://www.profistart.com/internetseiten.html此处<canvas>用于背景。