ArcGIS 中用于更改底图的菜单 API 4.x

menu for changing basemap in ArcGIS API 4.x

有没有一种方法可以在 ArcGIS 中创建用于更改底图的下拉菜单 api 4.x 与此处的菜单类似 https://developers.arcgis.com/javascript/3/sandbox/sandbox.html?sample=map_agol I have a working version of it in 3.x but am hoping to upgrade to 4.x. I found a similar example for changing the basemap here: https://developers.arcgis.com/javascript/latest/sample-code/widgets-basemapgallery/index.html 但我无法实现下拉菜单版本

我找到了创建菜单的教程 (https://dojotoolkit.org/reference-guide/1.10/dijit/DropDownMenu.html),但在实施底图更改部分时遇到了问题

有人有这方面的经验吗?

对于底图更改,您只需更改地图的底图属性。因此,如果用户从下拉列表中选择 "satellite",您只需要使用新值修改 属性。

    var basemapDropdown = document.getElementById("basemap-select");
    basemapDropdown.addEventListener("change", changeBasemap);

    function changeBasemap(event){
      var newBasemap = basemapDropdown.value;
      view.map.basemap = newBasemap;
    }

查看我创建她的示例:https://codepen.io/anon/pen/LoyZaJ

实际上您可以使用 BaseMap Gallery

toggleGallery() {
    
    
    if(this._view.ui.find("basemapGallery")){
      this._view.ui.remove("basemapGallery")
      return;
    }

    const basemapGallery = new BasemapGallery({
      view: this._view,
      container: "basemapGalleryDiv",
      id:"basemapGallery"
    });
    
    // Add the widget to the top-right corner of the view
    this._view.ui.add(basemapGallery, {
      position: "top-right"
    });
  }

并且 Html 使用

<div  id="basemapGalleryDiv"></div>

Base Map Gallery View View