SVG VS帆布爲「風」圖表

Question

我所遇到this question，我知道有沒有銀彈，但我希望做一個圖表沿this NYTimes interactive

我行通過檢查員看到它是用帆布製成的。我想知道，這是否有一個令人信服的理由？在SVG中可以執行相同的圖表+動畫嗎？還是一般的規則，帆布應該用於這個複雜的動畫？

Answer 1

我不知道表現，但有多種原因可以選擇另一種。這裏有一個頁面，可以讓你瞭解差異。這也許可以解釋他們的決定：

http://www.htmlgoodies.com/html5/other/html5-canvas-vs.-svg-choose-the-best-tool-for-the-job.html#fbid=uWFouE4ztEY

當然還有其他因素在起作用，如數據源，等等。例如，SVG看起來誘人，如果你得到從數據的一大塊服務器，因爲您可以將它格式化爲XML並提供服務。

此外，這個決定可能更平庸;它可能只是他們所知道的，有工具的，或者他們能夠最快找到文檔的東西。不幸的是，並非所有的軟件決策都是基於優點。決策往往更機會主義和衝擊。

Answer 2

我個人的經驗，基本上遵循以下幾點：

使用SVG當有rquire連接個別事件的形狀要素（circles.rect，橢圓形，路徑，多邊形）（的onclick，鼠標懸停等）

當您可以訪問像素以呈現圖形時使用CANVAS。像素控制允許SVG無法使用複雜的圖形，並且在許多情況下效果更好。

只是我輸入...

Answer 3

是的，<canvas>做到這一點。

SVG VS帆布：如何選擇：

• SVG：用於查看和打印高保真復矢量文件，靜態圖像
• <canvas>：複雜場景和實時動畫，高性能（過濾器，光線追蹤器），視頻處理。

訪問SVG vs canvas: how to choose瞭解更多詳情。