输入经纬度批量查询高程

利用Cesium批量获取并导出高程数据

最新推荐文章于 2024-05-30 11:34:29 发布

原创最新推荐文章于 2024-05-30 11:34:29 发布 · 2.5k 阅读

6 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #前端

最近在找相关的工具实现标题所说的问题。后来发现借助Cesium的sampleTerrainMostDetailed方法就可以批量获取高程。

话不多说，直接上代码。

// 创建Cesium Viewer对象
var viewer = new Cesium.Viewer("cesiumContainer", {
  // 是否显示信息窗口
  infoBox: false,
  // 设置地形
  terrainProvider: Cesium.createWorldTerrain({
    requestVertexNormals: true,
    requestWaterMask: true,
  })
});

var positions = []
fetch('http:你的存放经纬度的数据.json').then(response => response.json()).then((datas) => {
  console.log(datas.length)
  for (var i = 0; i < 7714; i++) {
    // 做一个坐标转换，datas[i].longitude和datas[i].latitude就是我们平常经常见到的经纬度
    positions.push(Cesium.Cartographic.fromDegrees(datas[i].longitude, datas[i].latitude))
  }
})

const height = [];  // 存放所有的高程值
Cesium.sampleTerrainMostDetailed(viewer.terrainProvider, positions).then(function (updatedPositions) {
  for (updatedPosition of updatedPositions) {
    // updatedPosition.height就是每一个经纬度对应的高程
    height.push(updatedPosition.height)
  }

整体思路也很简单，就是获取经纬度然后调用sampleTerrainMostDetailed接口方法直接去查询相应经纬度的高程，然后存到一个数组里面。

但是会有一个问题，就是如何把这么多的高程信息进行导出呢？在上面的代码中，我直接使用的就是Cesium开发包里面的HelloWorld.html，是没有用到nodejs的环境的，也就不存在使用fs模块将数据写到文件。

在这提供一个思路：将heights这个数组转换成csv文件，然后使用a标签，只要点击a标签就可以下载一个csv文件，这个文件里面也就保存了所有经纬度对应的高程值。

  const heights = [
    ["height"],
  ];
  heights.push(height)

  // 将数组转换为 CSV 格式
  const csv = heights.map(row => row.join(",")).join("\n");

  // 创建 Blob 对象
  const blob = new Blob([csv], { type: "text/csv" });

  // 创建下载链接
  const url = URL.createObjectURL(blob);
  const link = document.createElement("a");
  link.href = url;
  link.download = "data.csv";
  link.innerHTML = "Download CSV";
  document.body.appendChild(link);

如果发现启动后找不到这个a标签就直接使用开发者模式，肯定是可以找到a标签的，直接点击就可以下载一个data.csv文件。而一旦有了csv文件，处理起来就方便多了。