`
mouer
  • 浏览: 98195 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

浏览器绘图的基本原理

阅读更多

基于 HTML 和 JavaScript 的浏览器绘图方式,依赖于各个浏览器内部所提供的图形引擎

但由于不同浏览器所支持的网络图形标准不尽相同,给软件的兼容性造成了很大的困难。

目前几个主流的网络图形标准包括:

IE 支持的 VML。

Firefox,Safari 和 Opera 支持的 SVG。

HTML5 支持的 Canvas。

VML 是微软开发并在 IE 5.0 以上版本提供支持的基于 XML 的一种标记语言,使用 VML 描述的矢量图形,由 shape 和 group 两个基本元素定义,shape 描述了一个矢量图形元素,而 shape 则将这些图形元素集合在一起,从而使其可以作为一个整体被处理。由于使用简单的文本来表示图像,因而 VML 可用很少的字节来表示相对复杂的图像。

SVG 是由 W3C 制定的同样基于 XML 的矢量图形描述语言,SVG 元素是指示如何绘制图像的一些指令,由图形引擎解释这些指令,把 SVG 图像在浏览器上显示出来。使用 SVG 可以在网页上显示出各种各样的高质量的矢量图形,其最明显的特征是灵活的文件格式,矢量图形、位图和文字三部分共同组成一个 SVG 图形,并具备对运行中的 Web 页面图像进行实时修改的能力。

Canvas 是指 HTML 5 中新加入的 canvas 元素,最初由 Apple 的 Safari 浏览器引入,而后受到 Firefox 和 Opera 的广泛支持。Canvas 元素相对 VML 和 SVG 的一个重要不同在于,canvas 提供了通过 JavaScript 绘制图形的方法,每一个 canvas 元素都有一个上下文,在其中可以绘制任意图形;而 SVG 和 VML 都使用 XML 文档来描述图形,开发人员通常通过修改其中的 XML 标记来完成对图像的修改。

简单查了下资料,一般的用DOJO框架可以满足,如果要画特殊的图,那么就要做好兼容性。

分享到:
评论

相关推荐

    浏览器的工作原理

    本资源是本人在学习浏览器工作原理的过程中,无意间在GitHub上找到的...内容包括浏览器的基本结构、渲染引擎、渲染树、布局、绘图、浏览器引擎的线程等内容。分享出来,希望对想要了解浏览器工作原理的朋友有一点帮助。

    Java典型模块

    第1篇 Java开发必备基础 第1章 搭建Java开发环境 1.1 Java的过去、现在和未来 1.1.1 Java的历史 1.1.2 Java的语言特点 1.1.3 Java API简介 1.1.4 Java未来发展 1.2 Java程序设计环境 ...31.1.1 基本原理 ...

    工程硕士学位论文 基于Android+HTML5的移动Web项目高效开发探究

    Viewport不局限于浏览器可视区域的大小,可能比浏览器的可视区域要大,也可能比浏览器的可视区域要小。 媒体查询 CSS媒体查询允许开发者基于浏览网站的设备的特性来应用不同的样式申明,最常用的特性是视口宽度。 ...

    电子地图的设计与实现研究.doc

    实现 0 前言 随着计算机技术及互联网技术的发展, 一种新的地图产品——网络电子地图悄然出现, 它正改变着人们使用地图的方式, 同时,对地图制图的传统理论和技术也是一个新的挑战。网络电子地图以国际互联网为载 体, ...

    智能控制及其MATLAB实现2005李国勇编著.part3.rar

    1.3.1 神经控制的基本原理  1.3.2 神经网络在控制中的主要作用  1.3.3 神经网络控制系统的分类  第2章 MATLAB神经网络工具箱函数  2.1 感知机神经网络工具箱函数  2.2 线性神经网络工具箱函数...

    MATLAB图形图像处理

    2.1.1 基本绘图函数 2.1.2 图形窗口的修饰 2.2 三维绘图 2.2.1 plot3 函数 2.2.2 三维网格图和曲面图 第三章 MATLAB 图形对象 3.1 图形对象 3.1.1 Root 对象 3.1.2 Figure 对象 3.1.3 Uicontrol 对象 ...

    HTML5 CANVAS游戏开发实战(PDF和源代码)

    1.3.1 浏览器的支持 / 7 1.3.2 准备一个本地的服务器 / 8 1.4 开发工具的选择 / 8 1.5 测试与上传代码 / 12 1.6 javascript中的面向对象 / 13 1.6.1 类 / 13 1.6.2 静态类 / 16 .1.6.3 继承 / 16 1.7 小结 ...

    matlab6.5图形图象处理源程序

    2.1.1 基本绘图函数 2.1.2 图形窗口的修饰 2.2 三维绘图 2.2.1 plot3 函数 2.2.2 三维网格图和曲面图 第三章 MATLAB 图形对象 3.1 图形对象 3.1.1 Root 对象 3.1.2 Figure 对象 3.1.3 Uicontrol 对象 ...

    matlab6.5图形图像处理源程序

    2.1.1 基本绘图函数 2.1.2 图形窗口的修饰 2.2 三维绘图 2.2.1 plot3 函数 2.2.2 三维网格图和曲面图 第三章 MATLAB 图形对象 3.1 图形对象 3.1.1 Root 对象 3.1.2 Figure 对象 3.1.3 Uicontrol 对象 ...

    VC++ matlab图像处理

    2.1.1 基本绘图函数 2.1.2 图形窗口的修饰 2.2 三维绘图 2.2.1 plot3 函数 2.2.2 三维网格图和曲面图 第三章 MATLAB 图形对象 3.1 图形对象 3.1.1 Root 对象 3.1.2 Figure 对象 3.1.3 Uicontrol 对象 ...

    图形图像处理源程序-matlab6.5图形图像处理源程序.rar

    2.1.1 基本绘图函数 2.1.2 图形窗口的修饰 2.2 三维绘图 2.2.1 plot3 函数 2.2.2 三维网格图和曲面图 第三章 MATLAB 图形对象 3.1 图形对象 3.1.1 Root 对象 3.1.2 Figure 对象 3.1.3 Uicontrol ...

    数据库课程设计-仓库管理系统.doc

    本文通过分析浏览器/服务器结构的特点并结合企业仓储管理的实际情况,提出了基 于B/S结构中小型企业仓库管理系统的基本设计思想,简要介绍了系统各功能模块及数据 库的设计,着重讨论了用 ASP.NET技术和SQL Server ...

    《iPhone开发实战》.(Christopher Allen).pdf

    全书结合示例对这两种编程方式的基本流程、基本原理和基本原则给出了详细而通俗的讲解。在 web开发方面,分别介绍了三个 iphone web库,即 webkit、iui和 canvas,并讨论了 web开发环境 dashcode,最后阐述 web应用...

    javaSE代码实例

    第2章 基本数据类型——构建Java 大厦的基础 12 2.1 源代码注释 12 2.1.1 单行注释 12 2.1.2 区域注释 12 2.1.3 文档注释 13 2.2 基本数据类型 14 2.2.1 整型 15 2.2.2 浮点型 17 2.2.3 char型 17...

Global site tag (gtag.js) - Google Analytics