BaseLayerPicker

BaseLayerPicker 打开下拉面板。

BaseLayerPicker 是一个单按钮小部件，显示可用影像和地形提供者的面板。当选择影像时，将创建相应的影像图层并作为影像集合的基础层插入；移除现有基础层。当选择地形时，将替换当前的地形提供者。可用提供者列表中的每个项包含一个名称、一个代表性图标和一个工具提示，在悬停时显示更多信息。列表最初为空，且必须在使用前进行配置，如下面的示例所示。

默认情况下，BaseLayerPicker 使用默认的示例提供者列表进行演示。特别是这些提供者中的一些，例如 Esri ArcGIS 和 Stadia Maps，具有单独的服务条款，并且在生产使用中需要身份验证。

Throws:

• DeveloperError : 文档中不存在 ID 为“container”的元素.

Example:

// In HTML head, include a link to the BaseLayerPicker.css stylesheet,
// and in the body, include: <div id="baseLayerPickerContainer"
//   style="position:absolute;top:24px;right:24px;width:38px;height:38px;"></div>

//Create the list of available providers we would like the user to select from.
//This example uses 3, OpenStreetMap, The Black Marble, and a single, non-streaming world image.
const imageryViewModels = [];
imageryViewModels.push(new Cesium.ProviderViewModel({
     name: "Open\u00adStreet\u00adMap",
     iconUrl: Cesium.buildModuleUrl("Widgets/Images/ImageryProviders/openStreetMap.png"),
     tooltip: "OpenStreetMap (OSM) is a collaborative project to create a free editable \
map of the world.\nhttp://www.openstreetmap.org",
     creationFunction: function() {
         return new Cesium.OpenStreetMapImageryProvider({
             url: "https://tile.openstreetmap.org/"
         });
     }
 }));

 imageryViewModels.push(new Cesium.ProviderViewModel({
     name: "Earth at Night",
     iconUrl: Cesium.buildModuleUrl("Widgets/Images/ImageryProviders/blackMarble.png"),
     tooltip: "The lights of cities and villages trace the outlines of civilization \
in this global view of the Earth at night as seen by NASA/NOAA's Suomi NPP satellite.",
     creationFunction: function() {
         return Cesium.IonImageryProvider.fromAssetId(3812);
     }
 }));

 imageryViewModels.push(new Cesium.ProviderViewModel({
     name: "Natural Earth\u00a0II",
     iconUrl: Cesium.buildModuleUrl("Widgets/Images/ImageryProviders/naturalEarthII.png"),
     tooltip: "Natural Earth II, darkened for contrast.\nhttp://www.naturalearthdata.com/",
     creationFunction: function() {
         return Cesium.TileMapServiceImageryProvider.fromUrl(
             Cesium.buildModuleUrl("Assets/Textures/NaturalEarthII")
         );
     }
 }));

//Create a CesiumWidget without imagery, if you haven't already done so.
const cesiumWidget = new Cesium.CesiumWidget("cesiumContainer", { baseLayer: false });

//Finally, create the baseLayerPicker widget using our view models.
const layers = cesiumWidget.imageryLayers;
const baseLayerPicker = new Cesium.BaseLayerPicker("baseLayerPickerContainer", {
    globe: cesiumWidget.scene.globe,
    imageryProviderViewModels: imageryViewModels
});

See:

• TerrainProvider
• ImageryProvider
• ImageryLayerCollection