如何使用 ArcGIS Javascript API 显示 web 地图的全部范围?

     2023-02-21     261

关键词:

【中文标题】如何使用 ArcGIS Javascript API 显示 web 地图的全部范围?【英文标题】:How to display full extent of a webmap using ArcGIS Javascript API? 【发布时间】:2021-12-25 00:09:57 【问题描述】:

我正在使用 ArcGIS Javascript API 4.20 从 ArcGIS Online 中检索网络地图,并且我可以使用以下简单脚本通过提供其 ID 来加载和显示它:

import MapView from "https://js.arcgis.com/4.20/@arcgis/core/views/MapView.js";
import WebMap from "https://js.arcgis.com/4.20/@arcgis/core/WebMap.js";
import esriId from "https://js.arcgis.com/4.20/@arcgis/core/identity/IdentityManager.js";

var webmap = new WebMap(
    portalItem: 
    id: "1234567890qwertyuiop"
    
);

var view = new MapView(
    map: webmap,
    container: "mapFrame", //ID of the HTML element where the map will be displayed
);

我需要找到一种方法,以便在地图加载时以编程方式调整地图的缩放比例,以便其中包含的每个图层/要素在地图中显示的区域中都可见。

我找到了使用“fullExtent”函数的示例和参考资料,但据我了解,这旨在与图层一起使用。我无法弄清楚如何将相同的想法应用于完整的网络地图并使其发挥作用: https://developers.arcgis.com/javascript/latest/api-reference/esri-layers-FeatureLayer.html#fullExtent

webmap.when(function()
    view.extent = webmap.fullExtent;
);

//I've tried using this. It doesn't raise any errors, but does nothing.

你能告诉我我做错了什么吗?或者分享任何想法以使用不同的方法以编程方式实现我的需求?

【问题讨论】:

【参考方案1】:

WebMap 没有fullExtent 属性,所以这不起作用。

我猜您正在尝试一种方法来动态设置与某些图层功能相关的初始范围。 如果是这种情况,您应该使用所涉及层的fullExtent 属性来计算它。 拉起来应该不会太难,您可以手动迭代所有层的范围并获得最小和最大 x 和 y,或者使用 union 的方法 Extent (1)。

另一种思考问题的方法是使用固定的感兴趣区域,手动计算范围并将其设置为视图。或者选择一个中心并使用缩放级别。

1 - ArcGIS API - Extent union

【讨论】:

按照您的建议,我能够遍历图层并使用union 构建主要范围。但是在尝试将这个新范围设置为我的视图时,我遇到了一个问题。我收到以下错误:[esri.views.MapView] #center incompatible spatialReference "wkid":102644 with view's spatialReference "latestWkid":3857,"wkid":102100 我一直在尝试手动包含 spatialReference 值,但没有成功。你知道我是遗漏了什么,还是做错了什么? 所以基本上错误意味着您正在尝试使用具有不同空间参考的几何图形,该几何参考由基础层设置的地图之一。您需要将几何投影到地图的空间参考。您可以为 ArcGIS API - GeometryService 使用几何服务

实习生 4 无法将 Dojo Loader 与 ArcGIS JavaScript API 一起使用

】实习生4无法将DojoLoader与ArcGISJavaScriptAPI一起使用【英文标题】:Intern4CannotUseDojoLoaderWithArcGISJavaScriptAPI【发布时间】:2018-03-0908:01:01【问题描述】:Intern4Dojo加载程序在ArcGISJavaScriptAPI中找不到Dojo库。有谁知道如何使最新版本的I... 查看详情

如何排查无线ap在使用过程中的故障?

无线网络技术的飞速发展致使无线AP已渐渐融入我们的生活并与之密不可分。无线AP主要运用于企业、商场超市、酒店餐厅、学校工厂、展览展会等场所,为其构建WLAN并提供WiFi覆盖。很多终端用户觉得使用无线AP构建的商用WiFi的... 查看详情

javascriptanimationlibgreensockgsap介绍

...以下几种方式:1.简单的csstransition动画;2.cssanimation动画3.javascript库动画一般来说csshtml5动画只适用于简单的形变动画,动画操作的是css某个属性。但是对于更加复杂的动画,我们可能必须通过javascript来做,其中greensock的gsap就是... 查看详情

如何在 React 中调用注入到 ReactNative 的 WebView 中的 JavaScript 代码?

】如何在React中调用注入到ReactNative的WebView中的JavaScript代码?【英文标题】:HowtocallJavaScriptcodeinjectedintoWebViewofReactNativeinReact?【发布时间】:2019-08-0514:14:43【问题描述】:我在React-Native的WebView中注入了一段JS代码。我想在我的网... 查看详情

301arcgis_for_js安装配置4.21(01)

参考技术A1,arcgis_for_javascript的使用方式arcgis_for_javascript有两种使用方式,AMD和ES其中AMD方式是用的require(),适合于dojo或者没使用前端框架如果使用VUE等前端框架,则需要使用ES的方式,用的是import方式2,在vue中使用arcgis_for_javascrip... 查看详情

朋友送了一台arubaap61无线ap,和传统的无线ap不太一样,没有reset按键,也没有说明书,不知道如何部署?

aruba的ap和普通的ap不一样,比如你家的ap是胖ap单台就能工作,而aruba的ap要有一个管理的设备,就是控制器,首先这些东西并不适合你使用,他主要用在工业,大型企业,医院,仓库等需要多台设备配合使用的地方,建议还给你... 查看详情

arcgis学习推荐

...图、数据管理、编辑、分析和地理处理。开发人员,他们使用.NET、Java、C++、Web编程AP 查看详情

如何使用 argparse 模块?

】如何使用argparse模块?【英文标题】:Howtousetheargparsemodule?【发布时间】:2020-03-0620:19:11【问题描述】:这是我的半色调代码的一部分,有错误使代码无法运行。ap=argparse.ArgumentParser("ClassicalHalfToning[2x2Mask]")ap.add_argument(\'-i\',\'--i... 查看详情

`ap zip tail` 表达式是如何工作的

】`apziptail`表达式是如何工作的【英文标题】:Howdoestheexpression`apziptail`work【发布时间】:2013-10-1111:49:45【问题描述】:我想知道如何写fx=zipx(tailx)inpointfree。所以我使用了pointfree程序,结果是f=apziptail。ap是Control.Monad中的一个函... 查看详情

如何将某些内容附加到数组?

...array?【发布时间】:2010-09-2523:16:34【问题描述】:如何在JavaScript中将对象(例如字符串或数字)附加到数组中?【问题讨论】:【参考方案1】:使用Array.prototype.push方法将值附加到数组的末尾://initializearrayvararr=["Hi","Hello","Bonjo... 查看详情

如何在 .net 中获取可用的 wifi AP 及其信号强度?

】如何在.net中获取可用的wifiAP及其信号强度?【英文标题】:HowdoIgettheavailablewifiAPsandtheirsignalstrengthin.net?【发布时间】:2010-10-0412:55:05【问题描述】:是否有任何方法可以使用.NET访问所有WiFi接入点及其各自的RSSI值?如果我可... 查看详情

如何使用本地存储使用javascript登录

】如何使用本地存储使用javascript登录【英文标题】:howtouselocalstorageforloginusingjavascript【发布时间】:2015-02-2008:04:54【问题描述】:我已经编写了一个使用javascript登录的代码functioncheckLogin()if(localStorage.login=="true")window.location.href="... 查看详情

JavaScript 文件是如何附加到 React 中的 HTML 的?

】JavaScript文件是如何附加到React中的HTML的?【英文标题】:HowistheJavaScriptfileattachedtotheHTMLinReact?【发布时间】:2018-10-0315:14:42【问题描述】:我最近在一次采访中偶然发现了这个问题。我似乎无法在网上找到太多关于它的信息。... 查看详情

如何使用 JavaScript 创建会话?

】如何使用JavaScript创建会话?【英文标题】:HowtocreateasessionusingJavaScript?【发布时间】:2011-01-1611:45:26【问题描述】:如何在JavaScript创建会话?我尝试这样:<scripttype="text/javascript">Session["controlID"]="Thisismysession";</script>... 查看详情

如何使用javascript上传文件?

】如何使用javascript上传文件?【英文标题】:Howtouploadafileusingjavascript?【发布时间】:2018-12-0417:42:26【问题描述】:我想用js创建一个上传器。谁能帮助我如何使用javascript上传文件?【问题讨论】:我们不能帮助你,除非你已经... 查看详情

如何使用命令行美化 JavaScript 代码?

】如何使用命令行美化JavaScript代码?【英文标题】:HowcanIbeautifyJavaScriptcodeusingCommandLine?【发布时间】:2010-09-0608:20:31【问题描述】:我正在编写一个批处理脚本来美化JavaScript代码。它需要在Windows和Linux上运行。如何使用命令行... 查看详情

ArcGIS JavaScript api Map update-end 停止触发

】ArcGISJavaScriptapiMapupdate-end停止触发【英文标题】:ArcGISJavaScriptapiMapupdate-endstopsfiring【发布时间】:2015-11-1116:56:48【问题描述】:我们有一个使用arcgisJavaScriptapi的复杂网络地图应用程序。以下代码用于通知ui地图图层已加载:on(... 查看详情

javascript如何使用javascript连接restapi(代码片段)

查看详情