Cesium.js加载ArcGIS Server中发布的地图服务

Cesium.js地图加载实战

最新推荐文章于 2025-07-17 16:28:52 发布

原创最新推荐文章于 2025-07-17 16:28:52 发布 · 2.2k 阅读

3 ·

CC 4.0 BY-SA版权

文章标签：

#arcgis server #gis

Cesium.js 专栏收录该内容

1 篇文章

订阅专栏

本文分享了使用Cesium.js加载地图数据的实战经验，详细介绍了如何解决跨域问题及配置Node.js服务器来成功加载地图服务。通过示例代码展示了如何指定地图服务器URL并实现地图的正常显示。

这是一篇长期更新的文章，学到多少更多少

Cesium.js

首先贴上代码

Cesium.Ion.defaultAccessToken = '密钥';
var viewer;
viewer= new Cesium.Viewer('cesiumContainer');

var imageryLayers = viewer.imageryLayers;
imageryLayers.addImageryProvider(new Cesium.ArcGisMapServerImageryProvider({
    url : 'http://localhost:6080/arcgis/rest/services/SampleWorldCities/MapServer'
}));

上面是成功运行的，用的nodejs配置的服务器

配置node.js

一路默认安装之后，打开cmd

C:\Cesium-1.59>npm install
C:\Cesium-1.59>node server js
Cesium development server running locally.  Connect to http://localhost:8080/

后来思考觉得webstrom的内置服务器好像也行了。

ArcGIS Server

其实cesium并没有遇到什么问题，毕竟代码也简单。
但是地图数据的加载遇得了不少坑

1、Cors跨域问题

第一次加载的是WMS的URL，出现了下面的跨域问题。考虑可能是端口不统一（网页是4111，地图资源是6080），又考虑是地图坐标系不对导致的数据不显示。最后尝试后发现都不对。（未完待续。。。）

2、地图加载

第二次换成了默认的地图发布服务

//REST URL:
http://localhost:6080/arcgis/rest/services/SampleWorldCities/MapServer

加载成功！

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

专注GIS三十年

关注关注

0
点赞
踩
3

收藏

觉得还不错? 一键收藏
2
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

专栏目录

cesium 加载arcgis server pbf

北京-giser的博客

01-14

1199

cesium 加载arcgis server pbf

Cesium 之加载ArcGIS Server 4490切片服务（含orgin -400 400）

qq_39014170的博客

03-06

782

理论上加载数据比瓦片稍慢（实际上没啥区别）：）不需要考虑地图坐标系。

2 条评论您还未登录，请先登录后发表或查看评论

Cesium 加载影像服务接口分析

总得学点什么的博客

04-26

3666

Cesium本身提供了不同接口来加载各类影像地图服务，包括本地和服务数据，总结接口使用情况如下：个人建议影像服务还是加载本地服务数据比较好，接口推荐createTileMapServiceImageryProvider，数据类型TMS瓦片数据，数据来源：91位图之类的工具下载然后导出为TMS格式，直接iis下发布请求即可。先上代码 /* * @Author: Wang JianLei *...

Cesium添加arcgis server 4490 orgin -400 400 地图切片服务

08-09

源码主要修改地方是： 176512行 -- 将服务切片数据赋值到 tilingScheme._tileInfo = = data.tileInfo 17364行、17383行 -- 根据切片数据，计算不同比例尺，瓦片行列总数 176917行 -- 增加判断，根据orgin -400 与 cesium默认的-180 进行计算，增加瓦片行列的偏移量

cesium加载地图服务

热门推荐

weixin_40161953的博客

07-09

2万+

1.地图服务介绍本次发布的地图服务共有两种，WMS地图服务跟WMTS地图服务，下面分别介绍一下两种地图服务的调用方式： (1) WMS（Web Map Sever)，由OGC制定的网络地图发布规范，通过一定协议规定方式发布在网络中，实现地图资源的共享。下面是WMS服务的调用的一个实例： http://localhost:8080/geoserver/test/wms?service=WMS...

cesium笔记加载arcgis server服务

qq_40216244的博客

05-13

2281

viewer.imageryLayers.remove(this.addArcgisLayer);//移除上一次加载的图层 let res = this.$refs.tree.getCheckedNodes(true);//只获取所有子节点 let arr = [] res.forEach((item) => { arr.push(i...

【cesium-1】cesium地形、地图加载

WXG1011的博客

12-06

2782

cesium基础篇

Three.js与arcgis的交互与渲染

03-23

2. **ArcGIS API for JavaScript**：ArcGIS API是JavaScript开发人员用来与ArcGIS Server和ArcGIS Online交互的工具集。它可以创建地图、图层、地理处理任务，以及进行空间分析等。 3. **3D场景集成**：将Three.js...

arcgis加载4490图层所需js

04-17

这个文件可能是对Esri地图服务的Cesium实现，允许在Cesium环境中加载ArcGIS图层。 4. **Cesium**：这是一个强大的开源JavaScript库，用于创建高性能的3D地球视图。Cesium提供了丰富的地理空间功能，可以与ArcGIS...

Cesium JS GIS开源框架

08-29

Cesium-1.36GIS开源的前端框架，类似于leaflet.js，从官网下载慢，可以从这里下载.

基于Cesium的三维GIS实现

04-22

基于Cesium的三维GIS实现，详细解析了Cesium实现三维GIS的数据格式、标准、框架等，对希望从事Cesium研发的人员，极具参考价值，具备实操性，深入浅出。

cesium加载wms与arcgis服务

m0_65745337的博客

08-03

485

1、加载geoserver的wms服务。2、加载arcgis服务。

Cesium ArcGisMapServerImageryProvider API 介绍

qq_61140658的博客

01-25

1801

在Cesium中，通过使用这个API，你可以将ArcGIS提供的地图服务直接集成到3D地图中。是一个非常有用的API，它允许开发者使用由ArcGIS MapServer提供的切片图像作为背景图层。这个API对于需要在Web应用中整合ArcGIS地图服务的开发者来说，提供了一个便捷的接口。就像你在地图上铺了一层卫星图像，然后在上面展示你的3D模型，用户可以从全球任何角度查看你的模型，背景都是清晰的卫星图像。方法加载 ArcGIS 的卫星图层，然后让用户在虚拟世界中“飞行”，同时看到真实世界的卫星影像。

cesium加载ArcGIS Server发布的地图服务（WMS)

diz5280的博客

09-02

2339

cesium加载代码如下： var layer='0'; for(i=1;i<2;i++) { layer+=','+i }; // console.log(layer); var imageryProvider=new Cesium.WebMapServiceImageryProvider({ url:'http:/...

cesium 加载arcgis 发布的静态切片服务

chpswg的专栏

11-23

2143

arcgis 发布的服务有静态地图服务（缓存切片）和动态地图服务，参考网上的ArcGisMapServerImageryProvider，cesium 可以正常加载arcgis瓦片如： var vec2s = new Cesium.ArcGisMapServerImageryProvider({ url:"https://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer",

cesium加载arcgis server地图服务

Xiaok的专栏

04-05

5722

1、制作arcgis server服务从bigmap中下载了全球1-8级 arcgis 瓦片，配置arcgis地图服务，并发布服务 http://www.bigemap.com/helps/doc2018011781.html cesium中调用arcgis 地图服务 https://blog.csdn.net/weixin_40161953/article/details/80971167 2、cesium加载失败 cesium1.43没有加载成功，不知道为什么？搜索了一下，有人提出了这样的

cesium加载arcgisserver发布的imageserver类型的服务

weixin_45627964的博客

09-10

1704

起因：从事gis行业已经3年多了，是时候把自己遇到的一些问题和解决方法发出来，让别人也站在我的肩膀上了问题： cesium加载arcgisserver发布的imageserver类型的服务从事cesium的人都知道，cesium是没有直接加载imageserver的图层的，只有一个加载mapserver的ArcGisMapServerImageryProvider，当你尝试用这个图层加载im...

使用cesium 加载arcgis发布的wmts服务

06-02

可以使用Cesium的ImageryLayer来加载ArcGIS发布的WMTS服务。以下是一个基本的代码示例： ```javascript var viewer = new Cesium.Viewer('cesiumContainer'); var imageryProvider = new Cesium.ArcGisMapServerImageryProvider({ url : 'https://services.arcgisonline.com/arcgis/rest/services/World_Imagery/MapServer/WMTS', layer : 'World_Imagery', style : 'default', format : 'image/jpeg', tileMatrixSetID : 'default028mm', maximumLevel : 19, credit : 'Tiles © Esri — Source: Esri, i-cubed, USDA, USGS, AEX, GeoEye, Getmapping, Aerogrid, IGN, IGP, UPR-EGP, and the GIS User Community' }); viewer.imageryLayers.addImageryProvider(imageryProvider); ``` 在以上代码中，我们首先创建了一个Cesium的Viewer实例，然后使用ArcGisMapServerImageryProvider来创建一个ImageryLayer。其中，url参数指定了WMTS服务的地址，layer参数指定了图层名称，style参数指定了样式，format参数指定了图片格式，tileMatrixSetID参数指定了瓦片矩阵集，maximumLevel参数指定了最大级别，credit参数指定了数据来源的版权信息。最后，我们将创建的ImageryLayer添加到Viewer的imageryLayers中，即可在地球上显示出ArcGIS发布的WMTS服务。