echarts实现三维地球数据箭头流动效果代码

代码语言:html

所属分类:三维

代码描述:echarts实现三维地球数据箭头流动效果代码,可用于展示全球数据流动图表展示。

代码标签: echarts 三维 地球 数据 箭头 流动

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html>

<head>
   
<meta charset="utf-8">

   
<style>
        body
{
         
height: 100%;
         
width: 100%;
         
position: absolute;
         
padding: 0;
         
margin: 0;
         
font-size: 0;
       
}
   
</style>
</head>

<body>
 
   
<canvas id="myCanvas" width="5400" height="2700" style="border:1px solid #d3d3d3;display: none;">
    您的浏览器不支持 HTML5 canvas 标签。
</canvas>

   
<div id="earth" style="width: 100%; height: 100%"></div>

   
<script>


   
</script>

   
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/echarts.js"></script>
   
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/echarts-gl.js"></script>
   
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/world.js"></script>
   
<script>
   
       
    var c = document.getElementById('myCanvas');
var ctx = c.getContext('2d');

var img = new Image();
img.crossOrigin = '';
img.onload = function () {
      ctx.drawImage(img, 0, 0);
 
    ctx.getImageData(0, 0, this.width, this.height);
      var dom = document.getElementById("earth")
            var myChart = echarts.init(dom);
            let routes = [
              [
                [128.112931,36.891701],
                [116.23128,40.22077]
              ],
              [
                [126.567558,39.845796],
                [116.23128,40.22077]
              ],
              [
                [-8.170853,39.047001],
                [116.23128,40.22077]
              ],
              [
                [140.255147,37.480499],
                [116.23128,40.22077]
              ],
              [
                [104.785158,47.470235],
                [116.23128,40.22077]
              ],
              [
                [103.092607,31.072348],
                [116.23128,40.22077]
              ],
              [
                [121.710671,31.262193],
                [116.23128,40.22077]
              ],
              [
                [114.057396,22.703065],
                [11.........完整代码请登录后点击上方下载按钮下载查看

网友评论0