针对基于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/