在 Cesium 应用程序中成功集成并使用天地图服务

小豆包3D世界

于 2024-09-12 14:45:12 发布

阅读量422

点赞数 12

文章标签： javascript

本文链接：https://blog.csdn.net/qq_37030315/article/details/142175681

版权

使用 CesiumJS 实现天地图（Tianditu）的集成是一个比较直接的过程，主要涉及到将天地图的瓦片服务集成到 Cesium 中。天地图提供了多种地图服务，包括矢量地图、影像地图、地形图等。以下是一个基本的步骤指南和示例代码，展示如何在 Cesium 应用程序中集成天地图。

步骤 1: 准备 CesiumJS

首先，确保你的项目中已经集成了 CesiumJS。你可以从 CesiumJS 官网下载并集成库到你的项目中，或者使用 CDN 链接。

步骤 2: 获取天地图的密钥

在使用天地图的服务之前，你需要到天地图的官方网站注册并申请一个 API 密钥（AccessKey）。这是访问天地图服务的必要条件。

步骤 3: 创建 Cesium 视图

在你的 HTML 文件中，设置 Cesium 地图的容器，并初始化 Cesium 视图。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Cesium + Tianditu</title>
    <script src="https://cesium.com/downloads/cesiumjs/releases/1.95/Build/Cesium/Cesium.js"></script>
    <link href="https://cesium.com/downloads/cesiumjs/releases/1.95/Build/Cesium/Widgets/widgets.css" rel="stylesheet">
</head>
<body>
    <div id="cesiumContainer" style="width: 100%; height: 100vh;"></div>
    <script>
        Cesium.Ion.defaultAccessToken = '你的 Cesium Ion 访问令牌（如果没有使用 Ion 可以忽略）';

        var viewer = new Cesium.Viewer('cesiumContainer', {
            terrainProvider: Cesium.createWorldTerrain()
        });

        // 添加天地图瓦片层
        addTiandituLayer(viewer);

        function addTiandituLayer(viewer) {
            var imageryProvider = new Cesium.UrlTemplateImageryProvider({
                url: 'http://{s}.tianditu.gov.cn/vec_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=vec&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles&TILECOL={x}&TILEROW={y}&TILEMATRIX={z}&KEY=你的天地图API密钥',
                subdomains: ['t0', 't1', 't2', 't3', 't4', 't5', 't6', 't7'],
                minimumLevel: 1,
                maximumLevel: 18
            });

            viewer.imageryLayers.addImageryProvider(imageryProvider);
        }
    </script>
</body>
</html>

注意事项

API 密钥：请确保替换 URL 中的 你的天地图API密钥 为你从天地图网站获取的实际 API 密钥。
子域：天地图可能使用多个子域来分散加载请求，示例中包含了 8 个子域，但请根据你实际从天地图获取的 URL 进行调整。
服务类型：示例中使用的是矢量地图服务（vec），你可以根据需要更换为其他服务类型，如影像地图（img）、地形图（ter）等。
图层级别：根据天地图提供的服务，调整 minimumLevel 和 maximumLevel 的值。

通过上述步骤，在 Cesium 应用程序中成功集成并使用天地图服务。

本内容来源于小豆包，想要更多内容请跳转小豆包》

小豆包3D世界

关注

12
点赞
踩
4

收藏

觉得还不错? 一键收藏
打赏
0
评论
在 Cesium 应用程序中成功集成并使用天地图服务

使用 CesiumJS 实现天地图（Tianditu）的集成是一个比较直接的过程，主要涉及到将天地图的瓦片服务集成到 Cesium 中。天地图提供了多种地图服务，包括矢量地图、影像地图、地形图等。以下是一个基本的步骤指南和示例代码，展示如何在 Cesium 应用程序中集成天地图。
复制链接

扫一扫