javascript形状绘图 - 拉斐尔的图书馆如何详细工作？ （没有<canvas>）</canvas>

Question

最近我发现raphael的图书馆很棒。 例如：

Raphael Chart -Demo

当我检查代码时，我感到震惊（以积极的方式）。

它没有使用HTML5画布或任何额外的div，如here（不喜欢）

我的问题是：这究竟是如何运作的？像素操纵？什么是基本渲染代码？

谢谢！

Answer 1

它主要使用SVG这是一个类似XML的标记来表示向量。对于＆lt; IE9浏览器，我认为它使用VML这是IE仍然支持的弃用矢量标记。

SVG / VML是vector graphics的形式。它们的形状由数学公式表示。这使得它们适用于可缩放图形，因为在缩放时重新计算公式，保持锐利边缘，而不像raster graphics像素化。

Answer 2

使用firebug或Chrome的检查员检查来源。它会生成SVG。