首页 / 浏览问题 / WebGIS / 问题详情
cesium如何加载supermap iserver服务
2EXP 2021年07月09日

Cesium可以加载天地图和arcgis的地图服务,如下所示

//arcgis影像
        var arcgis=new Cesium.ArcGisMapServerImageryProvider({            	
            url:'https://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer',  
            tilingScheme:new Cesium.WebMercatorTilingScheme(),            	
            minimumLevel:1,            
            maximumLevel:20        
        });

        //天地图影像服务,必须添加自己的key
        var tdtImagerLayerProvider = new Cesium.WebMapTileServiceImageryProvider({
                url: "http://t0.tianditu.com/img_w/wmts?service=wmts&request=GetTile&version=1.0.0&LAYER=img&tileMatrixSet=w&TileMatrix={TileMatrix}&TileRow={TileRow}&TileCol={TileCol}&style=default&format=tiles&tk=fb788337399e78058af0869a899ba0f8",
                layer: "tdtBasicLayer",
                style: "default",
                format: "image/jpeg",
                tileMatrixSetID: "GoogleMapsCompatible",
                show: false
            });

        var viewer = new Cesium.Viewer('cesiumContainer',{
            imageryProvider:arcgis,

            //projectionPicker : true,
            geocoder:true,//控制右上角第一个位置的查找工具
            homeButton:false,//控制右上角第二个位置的home图标
            sceneModePicker:true,//控制右上角第三个位置的选择视角模式,2d,3d
            baseLayerPicker:false,//控制右上角第四个位置的图层选择器
            navigationHelpButton:false,//控制右上角第五个位置的导航帮助按钮
            animation:false,//控制左下角的动画器件
            timeline:false,//控制下方时间线
            fullscreenButton:false,//右下角全屏按钮
            // vrButton:false//右下角vr按钮
        });

请问大家cesium如何加载超图iserver发布的服务呢?http://10.1.61.207:8081/geoesb/proxy/services/maps/rest/27b39c990c824f9c9e30ca0ff2961cd9/7059396f4c1b4e1ea043ac8c9942c3a1

2 个回答

您好,请问您用的是原生的Cesium还是超图的WebGL呢,加载iServer地图服务需要用WebGL的。如果您要在Cesium那边加,考虑一下发WMTS服务,或者直接咨询Cesium那边的支持。

WebGL加载iServer地图服务示例:
http://support.supermap.com.cn:8090/webgl/examples/webgl/editor.html#SuperMapTileImagery

jjz
4,720EXP 2021年07月09日

使用超图的WebGL  http://support.supermap.com.cn/DataWarehouse/WebDocHelp/iPortal/webgl/docs/Documentation/SuperMapImageryProvider.html

你好,请问超图的这个SuperMapImageryProvide类能加载服务

必须用iserver发布WMTS么?之前上面的rest调用方法类似;我使用SuperMapImageryProvide调用rest服务失败,不显示地图


 map = new SuperMap.Map("mapwg", {
                        controls: [
                            new SuperMap.Control.Navigation(),
                            new SuperMap.Control.Zoom(),
                        ],
                    });
                    map.addControl(new SuperMap.Control.MousePosition());
                    var url =
                        "http://10.1.61.207:8081/geoesb/proxy/services/maps/rest/27b39c990c824f9c9e30ca0ff2961cd9/7059396f4c1b4e1ea043ac8c9942c3a1";
                    layer = new SuperMap.Layer.TiledDynamicRESTLayer(
                        "World",
                        url,
                        { transparent: true, cacheEnabled: true },
                        { maxResolution: "auto" }
                    );
                    //监听图层信息加载完成事件
                    layer.events.on({ layerInitialized: this.addLayer });

这个接口针对的是超图iServer发布的地图服务,如果您不使用iServer,单纯要加载符合OGC标准的WMTS服务,可以用Cesium原生接口:
http://support.supermap.com.cn/DataWarehouse/WebDocHelp/iPortal/webgl/docs/Documentation/WebMapTileServiceImageryProvider.html?classFilter=webm

如果您不用iServer,这个问题和超图WebGL API已经没有关系了,用原生接口就可以,您可以在百度带关键字“Cesium”+ 您想实现的操作即可。

你好,我现在希望使用ceisum调用服务"http://10.1.61.207:8081/geoesb/proxy/services/maps/rest/27b39c990c824f9c9e30ca0ff2961cd9/7059396f4c1b4e1ea043ac8c9942c3a1";该服务使用iserver发布的

想问下,能调用起来么,是不是cesium不支持调用超图的rest服务

您发的url我这边访问不了,无法查看您发了什么服务。超图iServer可以发各种服务,如数据服务,地图服务,WMTS服务等等,每种服务对应不同接口,您只说一个REST服务,我这边不好判断。WMTS服务无论是从什么平台发的,只要符合标准,都可以用我上文提到的原生WMTS接口。iServer发布的地图服务,Cesium的原生接口加起来比较困难,WebGL提供了直接使用的接口,但是您要是想用Cesium加也可以:
https://www.jianshu.com/p/5961495dfeed

麻烦您详细描述您的问题,我才好帮您解决。

你好链接在内网才能访问,那个发布的地图服务详情页如下。如方便可以加下qq1792956157.想问下原生cesium是否能调用下面截图的服务。调用的格式是什么

您好,这个就是普通的地图服务,加载方法就是我上个回复说的,您可以选择:

1. 超图WebGL提供的SuperMapImageryProvider接口直接加载
2. 原生Cesium加载:https://www.jianshu.com/p/5961495dfeed

至于您咨询的WMTS服务,请采用原生的WebMapTileServiceImageryProvider接口,这个WebGL和Cesium都有,而且服务和发布的平台没有关系,您想用什么都可以。

你好,超图的SuperMapImageryProvider我按照示例贴进去url和

简书那篇文章效果一样,如下图,下面是我的代码,能帮助看下是哪里格式不对么

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
    <link href="./Build/Cesium/Widgets/widgets.css" rel="stylesheet">
    <link href="./css/pretty.css" rel="stylesheet">
    <script src="./js/jquery.min.js"></script>
    <script src="./js/config.js"></script>
    <script type="text/javascript" src="./Build/Cesium/Cesium.js"></script>
</head>
<body>
<div id="cesiumContainer"></div>
<script>
    var viewer = new Cesium.Viewer('cesiumContainer');
    viewer._cesiumWidget._creditContainer.style.display = "none";//不显示超图logo

    function SuperMap3DImageryProvider(viewer, url, options) {
                this.layerProvider = ''
                this.options = options || {}
                this.viewer = viewer
                var _that = this
                $.ajax({
                    type: "get",
                    url: url + '/config',
                    success: function(result) {
                        var xml = string2XML(result)
                        var allobjs = xml.children[0]
                        var name = _that.options.name || allobjs.getElementsByTagName('sml:CacheName')
                        var xmlbounds = allobjs.getElementsByTagName('sml:Bounds')
                        var bounsleft = parseFloat(xmlbounds[0].children[0].innerHTML)
                        var bounstop = parseFloat(xmlbounds[0].children[1].innerHTML)
                        var bounsright = parseFloat(xmlbounds[0].children[2].innerHTML)
                        var bounsbottom = parseFloat(xmlbounds[0].children[3].innerHTML)
                        var xmllevels = allobjs.getElementsByTagName('sml:Levels')
                        var xmlminlevel = _that.options.minimumLevel || parseInt(xmllevels[0].children[0].innerHTML)
                        var xmlmaxlevel = _that.options.maximumLevel || parseInt(xmllevels[0].children[xmllevels[0].children.length - 1].innerHTML)

                        _that.layerProvider = new Cesium.UrlTemplateImageryProvider({
                            url: url + '/data/index/{y}/{x}.{fileExtension}?level={level}',
                            rectangle: Cesium.Rectangle.fromDegrees(bounsleft, bounsbottom, bounsright, bounstop),
                            minimumLevel: xmlminlevel,
                            maximumLevel: xmlmaxlevel,
                            tilingScheme: new Cesium.GeographicTilingScheme(),
                            customTags: {
                                fileExtension: function(imageryProvider, x, y, level) {
                                    return 'jpg_png'
                                },
                                level: function(imageryProvider, x, y, level) {
                                    return level
                                }
                            }

                        });

                        var layer = viewer.imageryLayers.addImageryProvider(_that.layerProvider);
                        _that.viewer.zoomTo(layer)
                        return layer
                    },
                    error: function(msg) {
                        console.log(msg);
                    }
                })
            }

    // //使用本地的一张图片初始化地球,建议图片长宽比2:1
    // viewer.imageryLayers.addImageryProvider(new Cesium.SingleTileImageryProvider({
    // url :  './images/worldimage.jpg'}));

    //begin西安市发布的地图
    var urlXiAn ="http://10.16.65.207:8081/geoesb/proxy/services/maps/rest/27b39c990c824f9c9e30ca0ff2961cd9/7059396f4c1b4e1ea043ac8c9942c3a1";
    var layer = SuperMap3DImageryProvider(viewer, urlXiAn);
    var imgLayer = viewer.imageryLayers.addImageryProvider(layer)
    //end西安市发布的地图


    // //begin天地图地图服务WMTS
    // //天地图影像服务,必须添加自己的key
    // var tdtImagerLayerProvider = new Cesium.WebMapTileServiceImageryProvider({
    //     url: "http://t0.tianditu.com/img_w/wmts?service=wmts&request=GetTile&version=1.0.0&LAYER=img&tileMatrixSet=w&TileMatrix={TileMatrix}&TileRow={TileRow}&TileCol={TileCol}&style=default&format=tiles&tk=fb788337399e78058af0869a899ba0f8",
    //     layer: "tdtBasicLayer",
    //     style: "default",
    //     format: "image/jpeg",
    //     tileMatrixSetID: "GoogleMapsCompatible",
    //     show: false
    // });
    // var imgLayerTDT = viewer.imageryLayers.addImageryProvider(tdtImagerLayerProvider)
    // //end天地图地图服务WMTS

    viewer.camera.flyTo({
            destination : Cesium.Cartesian3.fromDegrees(108.59 , 34.11, 1000),
            orientation : {
                heading : Cesium.Math.toRadians(0.0),
                pitch : Cesium.Math.toRadians(-25.0),
                roll : 0.0
            }
        });
</script>
</body>
</html>

不好意思有个问题不太清楚问下您,您现在用的是Cesium还是WebGL?WebGL直接用SuperMapImageryProvider加载就可以,只推荐这一种用法。简书方法仅适用于Cesium,而且不是超图官方推荐的方法,我是在网上找到的,可能对您有帮助,所以贴出来给您。

如果您想用Cesium原生方法加载服务遇到问题,请您移步Cesium社区:
https://www.cesium.com/

用超图webgl中的SuperMapImageryProvider加载格式我写错了么

//创建provider。
var provider = new Cesium.SuperMapImageryProvider({url : "http://10.16.65.207:8081/geoesb/proxy/services/maps/rest/27b39c990c824f9c9e30ca0ff2961cd9/7059396f4c1b4e1ea043ac8c9942c3a1"});
//创建影像图层。
var layer = viewer.imageryLayers.addImageryProvider(provider);

就是使用SuperMapImageryProvider加载出来就是上面一个地球,没有iserver发布的地图服务

我现在的代码

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
    <link href="./Build/Cesium/Widgets/widgets.css" rel="stylesheet">
    <link href="./css/pretty.css" rel="stylesheet">
    <script src="./js/jquery.min.js"></script>
    <script src="./js/config.js"></script>
    <script type="text/javascript" src="./Build/Cesium/Cesium.js"></script>
</head>
<body>
<div id="cesiumContainer"></div>
<script>
    var viewer = new Cesium.Viewer('cesiumContainer');
    viewer._cesiumWidget._creditContainer.style.display = "none";//不显示超图logo
    // //使用本地的一张图片初始化地球,建议图片长宽比2:1
    // viewer.imageryLayers.addImageryProvider(new Cesium.SingleTileImageryProvider({
    // url :  './images/worldimage.jpg'}));

    //begin西安市发布的地图
    var urlXiAn ="http://10.16.65.207:8081/geoesb/proxy/services/maps/rest/27b39c990c824f9c9e30ca0ff2961cd9/7059396f4c1b4e1ea043ac8c9942c3a1";
    var provider = new Cesium.SuperMapImageryProvider({url : urlXiAn});
    var imgLayer = viewer.imageryLayers.addImageryProvider(provider)
    //end西安市发布的地图


    // //begin天地图地图服务WMTS
    // //天地图影像服务,必须添加自己的key
    // var tdtImagerLayerProvider = new Cesium.WebMapTileServiceImageryProvider({
    //     url: "http://t0.tianditu.com/img_w/wmts?service=wmts&request=GetTile&version=1.0.0&LAYER=img&tileMatrixSet=w&TileMatrix={TileMatrix}&TileRow={TileRow}&TileCol={TileCol}&style=default&format=tiles&tk=fb788337399e78058af0869a899ba0f8",
    //     layer: "tdtBasicLayer",
    //     style: "default",
    //     format: "image/jpeg",
    //     tileMatrixSetID: "GoogleMapsCompatible",
    //     show: false
    // });
    // var imgLayerTDT = viewer.imageryLayers.addImageryProvider(tdtImagerLayerProvider)
    // //end天地图地图服务WMTS

    viewer.camera.flyTo({
            destination : Cesium.Cartesian3.fromDegrees(108.59 , 34.11, 1000),
            orientation : {
                heading : Cesium.Math.toRadians(0.0),
                pitch : Cesium.Math.toRadians(-25.0),
                roll : 0.0
            }
        });
</script>
</body>
</html>

从您新贴的这段代码:
 

//创建provider。
var provider = new Cesium.SuperMapImageryProvider({url : "http://10.16.65.207:8081/geoesb/proxy/services/maps/rest/27b39c990c824f9c9e30ca0ff2961cd9/7059396f4c1b4e1ea043ac8c9942c3a1"});
//创建影像图层。
var layer = viewer.imageryLayers.addImageryProvider(provider);

来看,没有问题。但是您这个url和我们一般的服务不太一样,不知道您是做了什么设置。建议您F12看一下瓦片是否请求到了,如下图就是请求到了,返回是200,且有瓦片:

如果没有请求到,那么这个问题您不应从WebGL入手,建议查一下url的问题,如果是对iServer进行了设置,可以在社区使用云GIS分类提问,看下是否能这么用。

请问,该问题解决了吗,我这边也遇见了相同的问题,求帮助,谢谢
6EXP 2022年05月10日
你好,为了在问题解决后,便于所有人检索查看。现将您的新问题迁移到一个新的问题链接,链接地址见:https://ask.supermap.com/107898
...