SVG/VML+JS實現跨瀏覽器的向量圖形實現方案

來源:互聯網
上載者:User

文章簡介:SVG/VML+JS實現跨瀏覽器的向量圖形實現方案.

Raphael JS庫是在webrebuild交流會上聽專家將到的,後來就看了下,果然很強大——通過SVG/VML+JS實現跨瀏覽器的向量圖形實現方案。

這其實和cufon等網路字型的實現原理是有些類似的:非IE瀏覽器使用SVG繪圖,然後IE中使用VML。它的目的是想要提供一種簡單易用的真正跨瀏覽器的向量圖形實現方案,包括一些動畫效果。

Raphael的文法也很簡單,基本上瞭解SVG就會很容易上手的:

var c = paper.path("M10 10L90 90");// 畫一條線;

瀏覽器支援

IE6+、Firefox 3.0+、chrome、opera等都是很好支援的。

一些酷酷的例子:

使用Raphael繪製的117個向量表徵圖:

嗯,這些表徵圖都是用Raphael實現的,點擊例子頁面中的表徵圖下面就會顯示代碼。

簡單的動畫效果,雖然也可以用JS+CSS3實現,但是這個可是跨瀏覽器的哦。。。

感興趣的同學可訪問官方網站查看更多demo,以及參考文檔



相關文章

Beyond APAC's No.1 Cloud

19.6% IaaS Market Share in Asia Pacific - Gartner IT Service report, 2018

Learn more >

Apsara Conference 2019

The Rise of Data Intelligence, September 25th - 27th, Hangzhou, China

Learn more >

Alibaba Cloud Free Trial

Learn and experience the power of Alibaba Cloud with a free trial worth $300-1200 USD

Learn more >

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。