用于HTML5浏览器的SVG或Canvas?

时间:2012-07-31 14:27:30

标签: html canvas graph svg

如果最低浏览器支持是IE9,Chrome 16,FF 13,Safari 5.1,那么在HTML / JavaScript中创建图表的最佳方法是什么?歌剧10? SVG或画布?
Google Charts

1 个答案:

答案 0 :(得分:0)

前往https://stackoverflow.com/a/1651167/138772http://dev.opera.com/articles/view/svg-or-canvas-choosing-between-the-two/

  

你应该使用Canvas:

     
      
  • 交互式图像编辑:裁剪,调整大小,过滤(想想去除红眼,棕褐色,着色等)
  •   
  • 生成光栅图形:数据可视化,数据图,渲染分形,功能图。
  •   
  • 图像分析:读取像素以收集直方图,颜色使用情况以及您可以想象的任何其他内容的数据。
  •   
  • 渲染游戏图形,例如精灵和背景。
  •   
     

你应该使用SVG:

     
      
  • 与分辨率无关的Web应用程序用户界面。
  •   
  • 高度互动的动画用户界面。
  •   
  • 数据图表和图表。
  •   
  • 矢量图像编辑。
  •   

所以基本上,如果你想拥有漂亮的矢量图和通过DOM操作它们的能力,可以使用SVG,但是如果你只是想绘制它们而不需要矢量化你可以使用Canvas(你可以设置它它会扩展到页面/窗口大小,无论如何)或DOM使用。我个人推荐SVG,因为我喜欢矢量图形。