在WebGL Earth的表面上绘制路径

时间:2018-07-20 23:06:42

标签: json d3.js path webgl webgl-earth

我最近开始弄乱WebGL Earth,并从最近一次环球旅行中获取了一些JSON数据。唯一的问题是WebGL Earth似乎没有路径或折线选项。可以绘制多边形,但是多边形的笔划会穿过地球的球体,并且放大/缩小时不会保留在表面上的填充物。

我的工作正在进行中的Codepen:https://codepen.io/maarondesigns/pen/vaymwM

我为多边形创建了一个空数组

var polygons = [];

从我的json文件中提取经度和纬度的变量

let lat = data.all_steps[i].location.lat;
let long = data.all_steps[i].location.lon;
let nextLat = data.all_steps[i + 1].location.lat;
let nextLong = data.all_steps[i + 1].location.lon;

并将点与非常瘦,笨拙的多边形相连。

      polygons[i] = WE.polygon(
    [
      [lat, long],
      [nextLat, nextLong],
      [nextLat + 0.1, nextLong],
      [lat + 0.1, long]
    ],
    {
      color: "#ff0",
      opacity: 0.01,
      fillColor: "#f00",
      fillOpacity: 1,
      weight: 1
    }
  ).addTo(earth);

我主要使用d3.js。

任何建议都值得赞赏,我不怕数学。我在摘要中遇到了数学上的解释以完成此任务,但是我无法弄清楚如何转换为可与WebGL Earth API或JSON文件一起使用的javascript。

0 个答案:

没有答案