echarts-gl
介绍一下echarts-gl，charts-gl专门为echarts补充了丰富三维可视化组件。这里的gl应该是global的意思，很多地方简写GL，不建议这样写，因为和真实的GL太冲突，更何况最近肖某的事情，和BL有着千丝万缕的关系，所以，就别和GL扯上关系，我们还是写全称echarts-gl。
echarts-gl map3D
这次介绍echarts-gl map3D，就是用echarts-gl实现的地图的3D模式，也是在系列03的基础上进行的改造，开启3D，切换地图，效果如下：
echarts-gl安装
cnpm install echarts-gl --save
页面引入
import 'echarts/dist/echarts-gl'
特别注意一下：如果集成了百度地图，这个引入不要放入到app.tsx里面，会出现一直加载不完的情况，所以最好放到chart.tsx
控制参数
在样式里面，添加控制参数，开启3D
render调整
在render下面的map.ts调整图形，主要是series的属性
map：'' // 注意与echarts.registerMap第一个参数保持一致
type: 'map3D' // 通过type指定必须是map3D，还有一种方式geo3D，见echarts官方实例
完成以上配置，效果就有了
echarts-gl事件存在问题
echarts-gl图表事件一直存在问题，算是个坑，截止目前，我统计了一下官方issue关于事件目前一直open的最少四个，echarts-gl目前维护进度也较慢。
试了几个版本的echarts-gl，发现对于不同的版本：
- 有版本需要加
getZr()，有的版本不需要 - 有的事件需要加
getZr()，有的事件不需要 - 有的版本获取不到区域名称，只能获取到坐标，有的版本能
- 有的版本区域域名加了
getZr()能获取到，有的不加能获取到，有的都能，有的都不能
我目前使用的版本1.1.1，单击事件不用加getZr()，右键事件需要加，但是右键事件获取不到区域名称，如果发现某个版本单击和右键事件都有，并能获取到取到区域名称，烦请留言告知，在此谢过。
就拿我们用的单击和右键事件来说：
单击事件实现方式：
// 方式一
myChart.on('click', function (params) {
console.log(params);
});
// 方式二
myChart.getZr().on('click', function (params) {
console.log(params);
});
右键事件
// 方式一
myChart.on('contextmenu', function (params) {
console.log(params);
});
// 方式二
myChart.getZr().on('contextmenu', function (params) {
console.log(params);
});
几个推荐和注意
echarts-gl地图下钻
如果echarts-gl 地图下钻，一些类似边框、颜色等属性，需要在下钻事件里面重新调整，否则下钻到新的地图属性不能匹配。
echarts-gl map3D组合图形
如果仅仅echarts-gl map3D效果没那么出众，一般都是配合其它图形，在地图上放柱形、雨滴等会更突出3D效果，所以可以进一步扩展。
echarts-gl性能
这里map3D较简单，性能未发现问题，echarts-gl有很多空间性很强的图形，这种图形渲染加载都会比2D慢，所以性能也是需要考虑的，其它3D图形用的维度指标较多，性能有待测试验证。
geo3D和map3d区别
geo3D不支持visualMap，显示3D地理，上面可以加柱状图，各省份数据无法展示。
map3d支持visualMap，可以显示区域数据，不能绘制柱状图，但是也有说可以隐藏一个geo3D来实现，所以待验证，大家可以尝试一下。
交流学习
刚建的群，学习Metabase、Davinci等开源BI，群号：72569367，感兴趣的可以加一下。
blog地址：https://dumplingbao.github.io/2020/04/03/davinci-dev-egl/
