echart3D地球上贴2D组件

globe与geo完美结合

globe

• globe用于绘制3D地球，属于echart-gl.js，本身可以进行坐标和连线的显示，但是要使用lines3D和scatter3D，此时就会有属性的限制。
• 平面上使用的lines和scatter与3D版的在坐标使用上一致，但是有些特效和属性是3D没有的，比如想在3D时绘制在线上也可出现的自定义symbol，lines3D不支持这样的效果。
• 二者的结合就非常重要了。注意：**globe的baseTexture允许放置canvas和echart实例，**那么可以将2d的geo或map与3d的globe结合起来，实现地球上各种特效的骚操作。

// 使用 echarts 绘制世界地图的实例作为纹理
var canvas = document.createElement('canvas');
var mapChart = echarts.init(canvas, null, {
    width: 4096, height: 2048
});
mapChart.setOption({
    series : [
        {
            type: 'map',
            map: 'world',
            // 绘制完整尺寸的 echarts 实例
            top: 0, left: 0,
            right: 0, bottom: 0,
            boundingCoords: [[-180, 90], [180, -90]]
        }
    ]
});
...
baseTexture: mapChart

自定义的地图可以使用geoJSON,也可以放在地球上，实现将地球区域性遮盖的效果
echart文档详实全面，可以仔细研究https://www.echartsjs.com/zh/option-gl.html#globe.baseTexture