专题演讲嘉宾 :沈毅

百度前端研发工程师

浙江大学毕业后一直在百度做前端开发,目前为百度资深研发工程师,主要从事 ECharts 的研发。个人研究领域有二维,三维的前端图形绘制,前端可视化等。视觉系,对游戏开发,程序生成设计,绘画等感兴趣。

演讲:WebGL 在前端可视化中的实践

时间:04月16日 14:55
地点:307B
所属专题:前端工程实践

现在传统的前端数据可视化解决方案大都选择 Canvas 或者 SVG 作为绘图接口,我们在前端可视化库 ECharts 中选择了 Canvas 作为底层的绘图接口,ECharts 目前在 GitHub 上拥有 16k 的star ,其拥有丰富绚丽的可视化效果,深度全面的交互操作,以及对大数据量稳定高效的展现等特性,是 GitHub 上以及国内最热门的开源前端可视化库之一,能够实现这些特性主要得益于 Canvas 的强大能力以及我们基于 Canvas 封装的二维图形库 ZRender 对图形操作的便捷性。

但是随着可视化形式的拓展,Canvas 在某些展现方式上也显得力不从心,例如:

  1. 用Canvas 绘制几十万的图形依然有压力;
  2. 各种三维数据的展现需求,以及大屏需要的一些酷炫的三维效果;
  3. 用 JS 计算布局存在的性能瓶颈,需要通过一些新的思路去有进一步的提升。

本次分享主要介绍我们是如何在现在的 ECharts 中集成 WebGL 去解决这些问题的,内容包括:

  1. ECharts 目前架构的介绍;
  2. 用 WebGL 绘制地球,三维的散点图,Surface 等三维图表;
  3. 用 WebGL 加速散点图等常见二维图表的绘制;
  4. 以及利用 GPGPU 进行一些布局运算的性能优化。

听众受益

  1. 了解 ECharts 的架构,如何在应用里集成 Canvas,WebGL 等多种图形接口;
  2. 了解 WebGL 的能力和场景,以及为如何在数据可视化等前端场景中应用 WebGL 提供一些思路;
  3. 了解使用 WebGL 中会碰到的一些坑及解决方案。

本专题下其他演讲

关注主办方(InfoQ)

InfoQ Qcon

交通指南