前端可视化

前端可视化是一个比较大的方向，目前也有专门的可视化工程师，前端可视化其实主要基于两种方式去实现，一种是html5新出的canvas，另一种是svg。

在我看来，canvas更像自己用手画上去的，它是一种位图，在网页中具有保存的功能，另外缺点就是放大会失真，但是毫无疑问性能比svg要好，而svg更像html标签一样，另外我们用纯div+css也可以做到可视化，不过性能就更差了，svg是基于xml的一个个标签，而这些标签可以添加dom事件，同样svg是一种矢量图，放大不会失真。

所以一般都是基于canvas对网页进行可视化展示的，不过canvas与页面元素交互效果并不好，毕竟不是dom元素，他需要测量canvas的坐标的一定范围确定位置，所以需要复杂的封装才可以交互，就目前来说canvas更火一点！！

介绍一下svg'和canvas的基本框架，canvas基本上都会采用echarts，相信大多数前端工作者或多或少都会接触到echarts，可以说真的十分神奇，包含了一些基本的可视化内容。图表、柱状图、折线图、热力图、地图.......而svg基本的框架则是d3.js，不是很了解，不过听说是可视化方面的jq，可见是多么的重要。而可视化之所以可以独立出来是因为它不只可以做基本的图标交互，甚至还可以做h5游戏，3D效果图等。

WebGL（全写Web Graphics Library）是一种3D绘图协议，这种绘图技术标准允许把JavaScript和OpenGL ES 2.0结合在一起，通过增加OpenGL ES 2.0的一个JavaScript绑定，WebGL可以为HTML5 Canvas提供硬件3D加速渲染，这样Web开发人员就可以借助系统显卡来在浏览器里更流畅地展示3D场景和模型了，还能创建复杂的导航和数据视觉化。显然，WebGL技术标准免去了开发网页专用渲染插件的麻烦，可被用于创建具有复杂3D结构的网站页面，甚至可以用来设计3D网页游戏等等。

这是一些介绍，主要的框架是three.js，这是一种很大的可视化知识，就像小程序可以从前端当中分离出去一样，可视化也在渐渐的从前端分离出去，但是前端工程师也必须用到一些知识，个人认为会用上面其中一种就够用了。