1-浏览器可视化的新宠 WebGL,媒体现在开始考虑如何使用 WebGL 来绘制高性能的3D图;
2-如今时兴的两种浏览器绘图模式:
-SVG (代表：D3.js, Raphael.js) ,svg可以绘制矢量图，在网页上使用。也可以通过ai画出图形导出svg格式；SVG 生成矢量图，并且和浏览器 DOM 的完全融合，这使它支持最灵活的交互效果和 CSS 样式。但是也正是因为每一个 SVG 元素都是一个 DOM 元素，绘制或移动一个 SVG 元素，浏览器都需要重新绘制、渲染页面，导致速度变慢，性能变差。要保证在浏览器绘制 SVG 过程中无时滞，一个页面静态 SVG 元素大约可以绘制一万个，动态的 SVG 元素，就最好不要超过一千个。
-Canvas (代表: Echarts, Google Charts, p5.js)与 SVG 绘图不同的是，Canvas 内绘制的元素都是预先生成，预先定下元素特性，预先写好动画路径。使用 Canvas 绘图，你需要写下每一个元素的输出的轨迹。由于 Canvas内绘制的元素并不涉及 DOM 元素，和 SVG 绘制的元素相比，交互性差，但也正因如此，在元素自身的动画特效上不受 DOM 位置限制，能够绘制表现力更强的图形，同时 canvas 生成位图，在浏览器性能（载入速度）上比 SVG 更佳。
-WebGL:与 Canvas 和 SVG 不同的是，WebGL 通过 WebGL JS API 连接 Javascript 和 GPU 编译程序。GPU 绘图的渲染大部分在 GPU 上进行，对浏览器压力减小，性能几个量级地提高，使 WebGL 成为浏览器内的3D渲染、大数据可视化唯一的选择。
3-web based visualisation
网友评论