由于图层操作是最基本的操作，cesium自己封装了现成的组件：BaseLayerPicker。本篇博客我们就学习下内置BaseLayerPicker的使用以及如何自定义实现BaseLayerPicker（基础底图）。
1、修改内置BaseLayerPicker
在初始化Viewer时，将baseLayerPicker设置为true即可显示BaseLayerPicker控件。我们可以通过将viewer.baseLayerPicker.viewModel.selectedImagery 设置为viewer.baseLayerPicker.viewModel.imageryProviderViewModels[6]来设置BaseLayerPicker的默认数据源（注：我们这里设置的[5]）。
//一：使用cesium内置数据源选择工具：BaseLayerPicker
var viewer = new Cesium.Viewer('cesiumContainer', {
TerrainProvider:null,
selectionIndicator:false,
animation:false, //是否显示动画控件
baseLayerPicker:true, //是否显示图层选择控件
geocoder:false, //是否显示地名查找控件
timeline:false, //是否显示时间线控件
sceneModePicker:true, //是否显示投影方式控件
navigationHelpButton:false, //是否显示帮助信息控件
infoBox:false, //是否显示点击要素之后显示的信息
fullscreenButton:true
});
//取消双击事件
viewer.cesiumWidget.screenSpaceEventHandler.removeInputAction(Cesium.ScreenSpaceEventType.LEFT_DOUBLE_CLICK);
//设置homebutton的位置
Cesium.Camera.DEFAULT_VIEW_RECTANGLE=
Cesium.Rectangle.fromDegrees(110.15,34.54, 110.25, 34.56);//Rectangle(west, south, east, north)
//设置初始位置
viewer.camera.setView({
destination:Cesium.Cartesian3.fromDegrees(110.20, 34.55, 3000000)
});
//设置默认地图源
viewer.baseLayerPicker.viewModel.selectedImagery= viewer.baseLayerPicker.viewModel.imageryProviderViewModels[5];
2 、自定义BaseLayerPicker
除了使用baseLayerPicker中默认的地图数据源，我们可以使用cesium提供的ProviderViewModel接口自己扩展数据源。在初始化viewer时设置imageryProviderViewModels为自定义的providerViewModels。例如我们添加一个esri自定义数据源过程：
var viewer = new Cesium.Viewer('cesiumContainer');
//定义ImageryProvider：
var esriMap = new Cesium.ArcGisMapServerImageryProvider({
url:'https://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer',
enablePickFeatures:false
});
//设置ProviderViewModel：
var esriMapModel = new Cesium.ProviderViewModel({
name:'esri Maps',
iconUrl:Cesium.buildModuleUrl('./Widgets/Images/ImageryProviders/esriWorldImagery.png'),
tooltip:'ArcGIS 地图服务',
creationFunction:function () {
return esriMap;
}
});
//只有一个
var providerViewModels = [];
providerViewModels.push(esriMapModel);
viewer.baseLayerPicker.viewModel.imageryProviderViewModels = providerViewModels;
//新增一个
//var providerViewModels = viewer.baseLayerPicker.viewModel.imageryProviderViewModels;
//providerViewModels.push(esriMapModel);
//viewer.baseLayerPicker.viewModel.imageryProviderViewModels = providerViewModels;
image.png
