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
有没有一种方法可以在 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