SVG在网站中的应用
一、SVG简介
SVG(可缩放矢量图形)格式非常适合用于网页图形技术。它基于XML,易于操作(例如使用JavaScript)和高效压缩,并且可以在不损失图像质量的情况下进行缩放和调整大小。它是W3C(万维网联盟)推荐的开放标准。
目前,几乎所有主流的网页浏览技术都正式支持SVG,包括Internet Explorer 9中的Trident引擎(可能于2011年发布)。虽然移动设备对SVG的支持相对滞后,但最终会跟上(尤其是苹果和安卓设备)。因此,在我们的网页项目中学习使用SVG是很有意义的,特别是在游戏领域,HTML5和SVG被视为Adobe Flash和Silverlight技术的有力竞争者。
不过要注意,不同浏览器对SVG元素的支持和渲染方式可能不同,或者支持并不完整。本文中的示例在编写时是在Mozilla Firefox的最新稳定版本(3.6.13)上进行测试的,但在其他浏览器中可能无法按预期工作。
二、为网页游戏创建交互式地图
- 准备工作
- JQuery框架 :为了在所有浏览器平台上轻松实现JavaScript交互性,我们将使用流行的JQuery框架,可以从官方网站(http://www.jquery.com)下载。
- JQuery SVG插件 :用于与SVG绘图进行交互,可从http://plugins.jquery.com/project/svg下载。
- 特定的JavaScript