Cesium加载高德地图(含源代码)

相比较天地图需要申请自己的Key,高德地图的加载方便很多,并不需要申请key,可以直接加载到我们的Cesium中。

//1.Cesium加载高德矢量地图

var layer = new Cesium.UrlTemplateImageryProvider({

url: "http://webrd02.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=8&x={x}&y={y}&z={z}",

minimumLevel: 4,

maximumLevel: 18

})

viewer.imageryLayers.addImageryProvider(layer);

//2.Cesium加载高德影像

var imgLayer = new Cesium.UrlTemplateImageryProvider({

url: "https://webst02.is.autonavi.com/appmaptile?style=6&x={x}&y={y}&z={z}",

minimumLevel: 3,

maximumLevel: 18

})

viewer.imageryLayers.addImageryProvider(imgLayer);

//3.Cesium加载注记要素

var annLayer = new Cesium.UrlTemplateImageryProvider({

url: "http://webst02.is.autonavi.com/appmaptile?x={x}&y={y}&z={z}&lang=zh_cn&size=1&scale=1&style=8",

minimumLevel: 3,

maximumLevel: 18

})

viewer.imageryLayers.addImageryProvider(annLayer);

源代码:

加载高德地图

html,

body,

#cesiumContainer {

width: 100%;

height: 100%;

margin: 0;3

padding: 0;

overflow: hidden;

background-color: #000000;

}

Cesium.Ion.defaultAccessToken = "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiIwNGNmNWUwMi02NWEyLTQxNzItOTNhNC1mY2NiZTcxNDc2OWYiLCJpZCI6MTU5NDQsInNjb3BlcyI6WyJhc2wiLCJhc3IiLCJhc3ciLCJnYyJdLCJpYXQiOjE1NjkyMjk3MTN9.PYUfCHykW23NuwRzzz04yW7JyZ4vQlcb4kToZ44r42w";

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

terrainProvider: Cesium.createWorldTerrain(),

animation: false,  //动画控制不显示

timeline: false,    //时间线不显示

fullscreenButton: false, //全屏按钮不显示

infoBox: false,

geocoder:false, //右上角 搜索

homeButton:false, //右上角 Home

sceneModePicker:false, //右上角 2D/3D切换

baseLayerPicker:false,  //右上角 地形

navigationHelpButton:false, //右上角 Help

});

viewer._cesiumWidget._creditContainer.style.display = "none";

//1.Cesium加载高德矢量地图

var layer = new Cesium.UrlTemplateImageryProvider({

url: "http://webrd02.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=8&x={x}&y={y}&z={z}",

minimumLevel: 4,

maximumLevel: 18

})

viewer.imageryLayers.addImageryProvider(layer);

//2.Cesium加载高德影像

var imgLayer = new Cesium.UrlTemplateImageryProvider({

url: "https://webst02.is.autonavi.com/appmaptile?style=6&x={x}&y={y}&z={z}",

minimumLevel: 3,

maximumLevel: 18

})

viewer.imageryLayers.addImageryProvider(imgLayer);

//3.Cesium加载注记要素

var annLayer = new Cesium.UrlTemplateImageryProvider({

url: "http://webst02.is.autonavi.com/appmaptile?x={x}&y={y}&z={z}&lang=zh_cn&size=1&scale=1&style=8",

minimumLevel: 3,

maximumLevel: 18

})

viewer.imageryLayers.addImageryProvider(annLayer);

你可能感兴趣的:(Cesium加载高德地图(含源代码))