arcgis - 使用 ArcGIS Javascript API 将 WFS 图层从 Geoserver 加载到 webmap

标签 arcgis geoserver arcgis-js-api wms

我正在尝试加载存储在 Geoserver 中的 wfs 图层以使用 ArcGIS Javascript API 创建 web map 。我已经成功地使用 WMS 做到了这一点,但我无法使用 WFSLayer 让它工作。有谁知道这是否可能?

到目前为止我的代码:

var layer = new WFSLayer();
var opts = { "url": "localhost:8080/geoserver/wfs";,
    "version": "1.0.0",
    "name": "RSAC:RSAC_Field_boundary_WGS84_2",
    "wkid": 4326,
    "maxFeatures": 100 }; 
esriConfig.defaults.io.proxyUrl = "/sproxy/";;
layer.fromJson(opts);
map.addLayer(layer); });

最佳答案

您应该为您的网络服务器设置proxy。因为WFSLayer需要使用代理页面。因此在您的代码中,spoxy字符串应该是您本地计算机上的代理路径。

esriConfig.defaults.io.proxyUrl = "/sproxy/";

1.准备代理。Esri提供了3种推荐的代理方式,包括dotnet、php和java。以dotnet方式为例。详细信息或其他设置代理的方式,请参见Using the proxy .

a.下载 dotnet 代理文件;下载github Esri/resource-proxy zip 文件,解压 DotNet 文件夹。

b.关注 dotnet proxy Instructions .

  • Open IIS Manager;

  • If you put the DotNet folder within wwwroot, right-click it and select "Convert to Application".

  • Make sure the "Application pool" is at least 4.0.

c.编辑 proxy.config 文件。将 serverUrl 元素添加到 serverUrls 以指示您要代理的服务器 URL。

<serverUrls>
    <serverUrl url="http://services.arcgisonline.com"
               matchAll="true"/>
    <serverUrl url="http://suite.opengeo.org/geoserver/wfs"
               matchAll="true"/>
    <serverUrl url="http://localhost:8080/geoserver/wfs"
               matchAll="true"/>
</serverUrls>

2.在代码中设置代理 URL。

map = new Map("map", {
  basemap: "topo",
  center: [-122.836, 42.346],
  zoom: 13
});

var layer = new WFSLayer(); 

var opts = {
    "url": "http://suite.opengeo.org/geoserver/wfs",// your wfs layer url goes here
    "version": "1.1.0",
    "name": "citylimits",
    "wkid": 3857,
    "maxFeatures": 100
};

//relative path,namely: C:\inetpub\wwwroot\DotNet\proxy.ashx
esriConfig.defaults.io.proxyUrl = "/DotNet/proxy.ashx";

layer.fromJson(opts);

map.addLayer(layer);

最终代码。注意:为了使代码正常运行,您应该按照上述说明为您的网络服务器设置代理。

<!DOCTYPE html>
<html>

<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no" />
  <title>WFS Layer</title>
  <link rel="stylesheet" href="https://js.arcgis.com/3.20/esri/css/esri.css">
  <style>
    html,
    body,
    #map {
      height: 100%;
      width: 100%;
      margin: 0;
      padding: 0;
    }
  </style>
  <script src="https://js.arcgis.com/3.20/"></script>
  <script>
    var map;

    require(["esri/map", "esri/InfoTemplate", "esri/layers/WFSLayer", "esri/config", "dojo/domReady!"], function(Map, InfoTemplate, WFSLayer, esriConfig) {
      map = new Map("map", {
        basemap: "topo",
        center: [-122.836, 42.346],
        zoom: 13
      });

      var layer = new WFSLayer();

      var opts = {
        "url": "http://suite.opengeo.org/geoserver/wfs",
        "version": "1.1.0",
        "name": "citylimits",
        "wkid": 3857,
        "maxFeatures": 100
      };

      //relative path,namely: C:\inetpub\wwwroot\DotNet\proxy.ashx
      esriConfig.defaults.io.proxyUrl = "/DotNet/proxy.ashx";

      layer.fromJson(opts);

      map.addLayer(layer);

    });
  </script>
</head>

<body>
  <div id="map"></div>
</body>

</html>

enter image description here

希望你能。

关于arcgis - 使用 ArcGIS Javascript API 将 WFS 图层从 Geoserver 加载到 webmap,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44455453/

相关文章:

postgresql - Grib2 到 PostGIS 栅格——有人让它工作吗?

tomcat7 - Geoserver 失败 一个或多个监听器无法启动

javascript - 根据属性在Openlayers中搜索wms图层,如果找到就放大

javascript - 大小与 ArcGIS Javascript SimpleMarkerSymbol JSON 构造函数不一致

javascript - ArcGIS API - 调用函数 onClick()

typescript - Vue+Vite 的多个默认导出错误

c# - 为什么编译器不优化这段代码

javascript - 如何使用 XY 坐标向 ArcGIS map 添加标记

android - 将纬度和经度转换为 esri arcGIS MapPoint

angularjs - 使用 ArcGIS JavaScript API 时模拟 HTTP 调用