跨瀏覽器解決方案可以使用SVG文件？

Question

什么樣的跨瀏覽器JavaScript SVG庫將允許我顯示預制的 SVG圖像並與之交互。

我知道這些庫：

• Raphaël ：我目前正在將其與SVG加載插件一起使用。 但是該插件不支持Inkscape或Adobe Illustrator SVG（即大多數SVG）。
• cang ：這個庫看起來很有前途，但是它需要<canvas>支持，而IE本身沒有。
• svgweb ：另一個更有前途的庫。 它需要Flash，但是大多數IE用戶都具有Flash。
• jQuery SVG ：似乎能夠加載SVG圖像，但是開發似乎已經停止。 它要求我使用jQuery 1.3的修改版。

我基本上是在嘗試使任意圖像塊“可選”。

任何幫助將不勝感激。

Answer 1

Raphaël通過使用此出色的插件 確實支持導入Illustrator SVG。 您所要做的就是將ai文件另存為SVG，使用文本編輯器將其打開，復制代碼並使用插件導入。 效果很好，除了：僅支持“路徑”對象，沒有文本，沒有漸變，沒有陰影...

Answer 2

我正在使用http://excanvas.sourceforge.net/獲得IE中的Canvas支持，並使用Canvas使用Cang獲得了SVG支持。

Answer 3

我發現的最佳解決方案是將Raphael與此工具一起使用，它使您幾乎可以按原樣將SVG文件（以我的情況為例，由Illustrator生成）轉換為Raphael代碼。 而且由於Raphael是IE6 +，因此您只需付出一些努力就可以輕松瀏覽。

這是我結合這兩種方法可以實現的示例。

Answer 4

您可以做的是使用cang和svgweb的組合，您可以檢查瀏覽器是否允許使用畫布，如果允許，則加載cang並使用它。 否則，請檢查它們是否具有閃存，如果有，請使用svgweb。 如果它們都沒有，請告訴他們升級其瀏覽器。

如果不確定javascript功能檢測，則可以閱讀http://ejohn.org/blog/future-proofing-javascript-libraries/ 。

Answer 5

我很想使用Google Chrome瀏覽器內嵌框架 （IE插件）。 這將節省您維護兩套代碼（一套用於IE用戶，另一套用於常規瀏覽器用戶）。 在頁面上添加以下元標記將使SVG能夠在IE中（通過GCF）呈現：

<meta http-equiv="X-UA-Compatible" content="chrome=1">

請參閱此處以獲取有關如何檢測並可能提示用戶安裝GCF的說明。