SVG 具體的應用場景是怎樣的？為什麼代替 Flash 的是 Canvas 而不是 SVG 呢？

12-28

有哪些網站或者應用使用呢？為什麼代替flash的是HTML5而不是svg呢？

svg既是一種繪圖標準/API，也是一種文件格式。canvas只是一套繪圖API，需要JS來進行調用。
svg可以是一個*.svg/*.svgz的實體文件，可以當圖片用，可以當字體用。canvas不行。
svg可以被市面上幾乎所有的矢量圖編輯軟體進行編輯和生成，canvas不行。
svg的應用遠不止是在web瀏覽器里，canvas基本上只能在web瀏覽器里。

從歷史的角度看，SVG是老技術，Canvas是新技術，SVG標準退出有十多年了，要替代Flash早就替代了，而Canvas年輕氣壯，勢頭正旺，有革命之勢

svg是用來處理矢量格式的，而canvas是用來處理點陣圖的，svg的優點是支持原生事件和豐富的DOM介面，缺點是性能較差。兩個技術的應用場景不一樣。

SVG是被微軟坑的。

微軟先自己搞了私有的VML，然後和其他瀏覽器成立了SVG的工作組起草標準。

然後，標準有了，但是IE一直沒升級，不是1年兩年，好像是10年，而且IE7還沒完全支持。

在當時IE佔主流市場的時候，缺乏支持就是兼容性的硬傷，何況當初設計是為了和html xml互操作的。
儘管有Adobe的插件，需要單獨安裝，且互操作有限制。

Flash以私有標準快速發展，鋪開全平台插件，本身看視頻什麼的就有一些普及率，開發工具又給力。從開發成本上就低了無數倍，當然很少有人選擇SVG了。

SVG得以全面鋪開還是受到智能手機發展的影響，移動版本先得到全瀏覽器兼容。

現在時機已經錯過，不排除SVG作為HTML5的一個內嵌元素存在，性能等等還是有問題，所以目前Canvas會略勝一籌。

首先我感覺這個技術已經有點過時了 W3C的標準瀏覽器基本已經很好支持canvas ,可以考慮使用canvas做替代方案

其次如果非要應用這個技術，這個技術還是有很多應用場景的，比如一些基於web的地圖應用，使用SVG和VML技術(主要是考慮到客戶端兼容性才使用)做地圖建築物的輪廓高亮;圖表的框架中用來繪製圖形等

給你個應用場景：
目前智能手機屏幕解析度越來越高，比如iPhone4的屏幕解析度為2x(屏幕象素和css象素比)，某些Android手機也有1.5x-2x的解析度；
普通解析度的圖片（比如PC上）在高分屏上看起來是模糊的，所以當前適配高分屏的方法是給一張圖片做兩個版本，一個正常大小，一個雙倍尺寸（適配1.5x-2x解析度），如果有更高解析度屏幕出現的話，還需要再做一個對應尺寸的版本；
但是SVG屬於矢量格式，可以無限縮放，所以對於上面的情況，只要一張SVG圖片就可以適配各種解析度。

準備關注yoyo的時候發現了這個問題，我目前正在用svg做基於web的監控topo圖。
原因是：
1. 純js不太好控制連線和節點的坐標
2. flash平台有官方解決方案，可惜各種依賴，部署不方便，且是收費產品。
3. svg基於xml，開發方面具有良好的社區支持。
4. w3c推薦標準，css/js 全能派上用場，不需要ued和視覺專門投入時間去學習svg的美化和交互。
5. 節點自動布局演算法可以很方便的在server端處理，避免瀏覽器端計算。

還是覺得canvas更好用些