15个不可思议的HTML 5 Canvas应用欣赏

开发 前端
HTML5呈现了很多的新特性,这在之前的HTML中是不可见到的。其中一个最值得提及的特性就是HTML Canvas,可以对2D或位图进行动态、脚本的渲染。

今天,我们收集了15个优秀的canvas应用,每个开发者都应该知道。

1.SketchPad

Sketchpad是个优秀的HTML5应用,帮助我们创建有用的绘图应用,使用JS和canvas元素。Sketchpad的绘图工具具有丰富的功能。

 

sketchpad

 

2.Canvas Color Cycling

具有下雨、下雪、海浪、烟雾的效果。

 

canvas color cycling

 

3.Threshold Filter

将图片转换为高对比度的黑白照片。

 

threshold filter

 

4.Reflections

3D旋转效果。

 

reflections

 

5.3D Planet Viewer

3D Planet Viewer渲染效果,来自NASA WorldWind WMS服务器的数据,可以进行旋转、缩放等操作。

 

planel-viewer

#p#

6.Music Visualisation with SoundManager2

Jacob Seidelin创建,使用canvas元素和SoundManager2创建的音乐可视化演示。

 

musicvisualisation

 

7.Water Ripples

Almer Thie创建的实时交互的水波纹效果。

 

water ripple

 

8.Strange Attraction

Strange Attractor提供各种选项,改变输出效果。

 

strange-attraction

 

9.CloudKick

Cloudkick Viz使用canvas元素来显示云服务器的实时监控信息。

 

cloudkick

 

10.Liquid Particles

Daniel Puhe创建了这个有趣的液体运动粒子演示。只要移动你的鼠标在周围的粒子将跟随光标。

 

liquid particles

#p#

 

11.Canvas Sphere

复杂的球体效果。

 

canvas sphere

 

12.jTenorian

256个LED按钮的表面,呈现的是描述不出来的效果。

 

jtenorian

 

13.Dynamic Image Collage

Dynamic Image Collage使用canvas元素创建。

 

dynamic collage

 

14.iGrapher

iGrapher是个免费的基于web的金融市场可视化工具,包括股市、汇率和商品市场的图表、分析和预测。

 

igrapher

 

15.Tiler 3D

Tiler 3D呈现3D旋转网格的不限数量的同等尺寸的图片。

 

tiler-3d

 

原文出自:http://www.oschina.net/news/19813/15-html5-canvas-applications

【编辑推荐】

  1. 10个令人惊奇的HTML5和JavaScript效果
  2. 20佳惊艳超炫的HTML 5应用程序示例
  3. HTML 5可以做五件事情 超出你的想象
  4. 44个惊人的超炫CSS3动画演示
  5. 九个令人惊叹的HTML 5和JavaScript实验
责任编辑:陈贻新 来源: 开源中国社区
相关推荐

2013-07-31 15:06:58

未来的WebWebGLWeb

2017-03-21 08:52:20

神经网络声誉

2013-10-10 13:07:25

方物

2022-01-24 15:57:34

Python返回功能代码

2011-02-23 08:50:22

C#.NETdynamic

2010-07-15 16:21:03

不可思议的服务器

2021-11-10 06:38:01

Python链式操作

2020-07-02 15:40:11

Spring BootJar包Java

2017-11-08 14:07:45

数据库MySQL慢查分析

2014-01-14 10:33:42

开源硬件开源

2023-04-06 09:44:00

ChatGPT行业质量

2012-05-16 17:28:32

智能手机

2023-04-04 22:31:11

GPT-5人工智能

2014-07-26 22:18:51

2020-09-16 10:24:37

物联网环保应用IOT

2012-02-13 11:01:27

N9Android 4.0

2016-07-06 11:56:52

思科汉堡光纤骨干网

2012-08-30 10:18:09

HTML5CanvasHTML5实例

2024-04-07 00:00:00

亿级数据ES

2021-03-03 07:12:47

Windows10操作系统微软
点赞
收藏

51CTO技术栈公众号