針對基於HTML5的動畫線圖的設計建議

Question

我正在計劃開發可在瀏覽器中運行的可滾動/實時/動畫線圖（使用HTML5）。它將被集成到一個應用程序中，該應用程序執行一些計算量很大的工作（DSP），所以我需要圖形/動畫快速並且具有最小的開銷。我在Silverlight中創建了這樣一個應用程序，但由於支持此平臺的平臺數量有限，我認爲我更擅長關注HTML5，假設它足夠快。

-關於canvas/svg會更合適還是有一些現有的庫/應用我可能會看？

- 任何平臺特定的考慮事項（尤其是移動/平板電腦的使用）？

謝謝！

Answer 1

SVG將是最簡單的編碼 - 基本上只是使標記的線條和使用對象或iframe開行圖

<?xml version="1.0" standalone="no"?> 
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" 
"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> 

<svg width="100%" height="100%" version="1.1" 
xmlns="http://www.w3.org/2000/svg"> 

<line x1="0" y1="0" x2="300" y2="300" 
style="stroke:rgb(99,99,99);stroke-width:2"/> 

</svg> 

的計算密集的東西，可以在服務器上完成，並且風格上可以像HTML中的樣式一樣處理類。

SVG的侷限性在於對動畫標籤的瀏覽器支持。 SVG還沒有完全支持HTML內聯，所以你需要像對待圖像一樣對待它。

畫布要求你用Javascript繪製線條。再次，計算密集型的東西可以在服務器上完成，並且只傳遞需要繪製的JavaScript。但更多的時間可能需要用畫布來完成。

您還可以使用腳本SVG的幾個例子在這裏：http://www.carto.net/papers/svg/manipulating_svg_with_dom_ecmascript/