1. 首頁
  2. 問答
  3. html5 canvas元素和svg

html5 canvas元素和svg

2009-10-30 148 views

回答

35

SVG和canvas並非真正可互換的技術。 SVG是一種保留模式圖形，其中的一切都來自相當抽象的模型（SVG文檔）。另一方面帆布是一種即時模式圖形，沒有模型和客戶端（JavaScript）必須照顧重繪，動畫等。

來源

2009-10-30 17:18:16 foolip

+7

Jennifer Yu說SVG非常適合高分辨率，Canvas適用於快速動畫。她建議在另一個上面的這段視頻從11混合使用這兩種，其一：http://media.ch9.ms/ch9/FDB1/595AD4A8-9399-439C-840A-9EAF0092FDB1/MIX11HTM15_high_ch9.mp4 – 2011-05-14 17:39:42

+0

技術上你是對的由於矢量和光柵圖形之間的差異，它們不可互換。但是，你能告訴我一件事，我可以向最終用戶展示一個我無法與另一個展示的產品？我認爲就最終用戶而言，它們實際上是完全可以互換的。 – 2013-07-18 23:34:00

0

因爲我們再不需要擔心什麼支持這種嵌入;-)

在這種方式中的重點應用developpers是要堅持標準，讓客戶端設計師這樣做。並因此讓所有人都擔心插件，版本，安全設置等......

來源

2009-10-30 15:26:13 mjv

+0

瀏覽器是否能支持SVG命名空間，像壁虎呢，你不應該擔心或者，用另外的事實是，在SVG你確實有一個DOM操作。 – 2009-10-30 15:31:30

+1

如果瀏覽器支持HTML5而不是SVG命名空間，就像IE可能會？ – ceejayoz 2009-10-30 15:40:52

+0

只需使用SVGWeb for IE，這真的很容易。 http://code.google.com/p/svgweb/ – 2009-10-30 16:56:42

6

http://people.mozilla.com/~vladimir/xtech2006/有很好的比較。

使用畫布，您不必處理DOM，從而更快，更容易編寫代碼。 SVG也是一個混亂的規範，...

來源

2009-10-31 05:48:30 Nickolay

+4

你在這裏有一些鏈接腐爛..有沒有替代的鏈接？ – 2011-11-02 09:27:50

+0

@TimPost：不，但有人在mozilla可能有。本次介紹與https://developer.mozilla.org/en/XTech_2006_Presentations ... – Nickolay 2011-11-04 13:28:18

17

SVG是矢量圖形的標記語言，並具有DOM。這使得創建後的內容變得非常容易。

畫布是一個繪畫的表面，就像MS Paint沒有撤消按鈕。你不能改變內容。你只能覆蓋它。這是非常高效的，因爲瀏覽器不需要爲圖像處理完整的DOM。而畫布未來可能會處理3D繪圖。

來源

2009-10-31 19:50:19

1

下面是如何分析一個簡單的SVG和繪製在畫布上的說明..

http://www.ikeralbeniz.net/2010/11/03/jugando-con-html5-canvas-y-svg-i/ http://www.ikeralbeniz.net/2010/11/04/jugando-CON-HTML5的畫布-Y-SVG-II/

進一步帖子

SVG的解析器將透明膠片和梯度

來源

2010-11-04 21:17:32 iker

+0

聯繫我忘了說，職位是在西班牙，但你可以在這裏得到完整的示例代碼：HTTP：//www.ikeralbeniz。淨/可溼性粉劑內容/上傳/ 2010/11/test.html中 – iker 2010-11-04 21:28:05

0

這不是一個真正的技術答案，但我認爲這是正確的答案。

底線是我們不需要兩個。是的，我知道矢量和光柵圖形和兩種控制路徑，對象，動畫等不同方式之間存在差異，但對於最終用戶來說，它們都是一樣的。是的，SVG現在稍微強大一些，因爲它的存在時間更長，但只需要更多的工作，您可以使用Canvas做同樣的事情。

我相信現實是Canvas是Web開發中反對XML本身的壓倒性反彈的一部分。我相信大多數Web開發人員，尤其是那些在「企業」環境之外使用有限時間和資源的開發人員，不喜歡XML的複雜性。 Canvas是一組首選的只做一件事技術的一部分，就像HTML5比XHTML更受青睞，JSON優於XML，甚至YAML優於XML。

我認爲這個想法與* nix哲學相似，即有許多特定的工具正確而有效地完成一件事，而不是一件做很多事情的大型工具。（這也類似於許多固定齒輪自行車騎手的理念，他們通過簡單的一個直接驅動裝置避開令人難以置信的精確和先進的撥鏈器技術。）

不要誤解我的意思，我相信XML是一個令人難以置信的強大以及由輝煌人士精心研發的卓越技術，成爲網絡，編程，配置，數據存儲等終極瑞士軍刀;但這並不意味着更容易管理和設計一系列複雜的路徑，而不是僅僅在a上繪製像素。

我知道我的答案是自以爲是，我不打算這是火焰。我喜歡SVG，我希望這些年來能夠得到更多的支持（尤其是來自IE），但是我感受到了標準制定者和影響他們的網絡開發人員的心理。

長期我想看到SVG使XML可選，並移動到一個更JSON狀結構這就是簡單的用JavaScript來操縱，甚至可能成爲基於矢量的畫布背景。在我看來，這將是網絡的最佳解決方案。

來源

2013-07-18 23:30:50

相關問題

 相關問題