使用ArcGIS Javascript API从Geoserver中的WMS层添加要素表

我想知道我正在努力做的事情是否可能。我正在尝试向我的网站添加一个功能表，该功能表是使用ArcGIS Javascript API编写的。我已经成功地从Geoserver链接了我的图层，并在地图上查看了它，但我很难在网站的表格中显示我的记录

这是我目前的代码：

require([
  "esri/layers/FeatureLayer",
  "esri/dijit/FeatureTable",
  "esri/layers/WMSLayer", 
  "esri/layers/WMSLayerInfo",
  "esri/geometry/Extent",
  "esri/graphicsUtils",
  "esri/tasks/query",
  "esri/symbols/PictureMarkerSymbol",
  "esri/map",
  "dojo/dom",
  "dojo/parser",
  "dojo/ready",
  "dojo/on",
  "dijit/layout/ContentPane",
  "dijit/layout/BorderContainer"
], function (
  FeatureLayer, FeatureTable, WMSLayer, WMSLayerInfo, Extent, graphicsUtils, Query, PictureMarkerSymbol, Map,
  dom, parser, ready, on, ContentPane, BorderContainer
) {

  parser.parse();

  ready(function(){
    var map = new Map("map",{
      basemap: "streets", 
      extent: new Extent({xmax: -1.1487, xmin: 51.065,
        ymax: -1.1274, ymin: 51.097,
        "spatialReference":{"wkid":27700,"latestWkid":4326}
      })
    });

    //Load a FeatureTable to the application once map loads
    map.on("load", loadTable);

    function loadTable(){

      // editable FeatureLayer
      var wmsLayer = new WMSLayer("", {
        mode: WMSLayer.MODE_ONDEMAND,
        outFields: ["*"],
        visible: true,
       id: "fLayer2"
     });

      var wmsLayer = new WMSLayer("http://localhost:8080/geoserver/RSAC/ows?service=wfs&version=1.0.0&request=GetCapabilities", {
  format: "png",
  resourceInfo: {
    copyright: "GeoServer",
    description: "RSAC fields",
    extent: new Extent(-1.1487, 51.065, -1.1274, 51.097, {wkid: 4326}),
    featureInfoFormat: "text/plain",
    getFeatureInfoURL: "http://localhost:8080/geoserver/RSAC/ows",
    getMapURL: "http://localhost:8080/geoserver/RSAC/ows",
    hasAttributionData: true,
    layerInfos: [
      new WMSLayerInfo({
        name: "RSAC:Field_boundary_WGS84_updated",
        title: "Field_boundary_WGS84",
        queryable: true,
        showPopup: true
      })
    ],
    spatialReferences:[3857],
    version: "1.3.0"
  },
  version: "1.3.0",
  visibleLayers: [
    "RSAC:Field_boundary_WGS84_updated"
  ]
});

          wmsLayer.on("error", function (response){
  console.log("Error: %s", response.error.message);
});
    map.addLayer(wmsLayer);

      // set a selection symbol for the featurelayer
      var selectionSymbol = new PictureMarkerSymbol("https://sampleserver6.arcgisonline.com/arcgis/rest/services/RedlandsEmergencyVehicles/FeatureServer/1/images/3540cfc7a09a7bd66f9b7b2114d24eee", 48 ,48);

      wmsLayer.setSelectionSymbol(selectionSymbol);

      // listen to featurelayer click event to handle selection 
      // from layer to the table. 
      // when user clicks on a feature on the map, the corresponding 
      // record will be selected in the table.   
      wmsLayer.on("click", function(evt) {
        var idProperty = wmsLayer.id,
          feature,
          featureId,
          query;

        if (evt.graphic && evt.graphic.attributes && evt.graphic.attributes[idProperty]) {
          feature = evt.graphic,
          featureId = feature.attributes[idProperty];

          query = new Query();
          query.returnGeometry = false;
          query.id = [featureId];
          query.where = "1=1";

          wmsLayer.selectFeatures(query, wmsLayer.SELECTION_NEW);
        }
      });


      // Redlands police vehicle locations layer
      // this layer is an editable layer 
      map.addLayer(wmsLayer);

      //create new FeatureTable and set its properties 
      var wmsLayer = new FeatureTable({
        featureLayer : wmsLayer,
        map : map, 
        editable: true,
        syncSelection: true,
        dateOptions: {
          datePattern: 'M/d/y', 
          timeEnabled: true,
          timePattern: 'H:mm',
        },
        // use fieldInfos object to change field's label (column header), 
        // change the editability of the field, and to format how field values are displayed
        // you will not be able to edit callnumber field in this example. 
        fieldInfos: [
          {
            name: 'id', 
            alias: 'Polygon Id', 
            editable: false //disable editing on this field 
          },
          {
            name: 'photos', 
            alias: 'photos', 
            },
        ],
        // add custom menu functions to the 'Options' drop-down Menu 
         menuFunctions: [
        {
          label: "Field_boundary_WGS84", 
          callback: function(evt){
            console.log(" -- evt: ", evt);
            // set definition expression on the layer
            // show only available emergency vehicles 
            wmsLayer.setDefinitionExpression("status = 0");

            // call FeatureTable.refresh() method to re-fetch features
            // from the layer. Table will only show records that meet 
            // layer's definition expression creteria.  
            wmsLayer.refresh();
          }
        },{
          label: "Show All Field Boundaries", 
          callback: function(evt){
            console.log(" -- evt: ", evt);
            wmsLayer.setDefinitionExpression("1=1");
            myFeatureTable.refresh();
          }
        }]
      }, 'myTableNode');

      myFeatureTable.startup();

      // listen to refresh event 
      myFeatureTable.on("refresh", function(evt){
        console.log("refresh event - ", evt);
      });
    }
  });
});

---

FeatureTable

类是一个仅用于功能层的小部件。因此，将wmslayer对象设置为其featurelayer参数来创建其实例是错误的

如果必须使用featureTable小部件，可以执行以下操作

获取ArcGIS shapefile或其他受支持的类型

• 在geoserver中获取wmslayer的相应数据
• 在arcgis中将数据转换为shapfile或其他支持的格式

使用shapefile可使用arcgis server发布要素服务，这样您就可以拥有要素服务。例如：

https://services.arcgis.com/V6ZHFr6zdgNZuVG0/arcgis/rest/services/california_census_blocks/FeatureServer/0

使用AGSAPI为js编写代码

• 创建地图
• 添加featurelayer
• 添加功能表

以下是一个例子：

使用FeatureTable
html，
身体，
#地图{
宽度：100%；
身高：100%；
保证金：0；
填充：0；
}
要求([
“esri/图层/功能图层”，
“esri/dijit/FeatureTable”，
“esri/geometry/webMercatorUtils”，
“esri/map”，
“dojo/dom构造”，
“dojo/dom”，
“dojo/parser”，
“dojo/ready”，
“dojo/on”，
“dojo/_base/lang”，
“dijit/注册表”，
“dijit/form/Button”，
“dijit/layout/ContentPane”，
“dijit/layout/BorderContainer”，
“dijit/form/TextBox”
]，功能(
FeatureLayer、FeatureTable、webMercatorUtils、地图、，
domConstruct，dom，parser，ready，on，lang，
注册表、按钮、内容窗格、边框容器、文本框
) {
parser.parse（）；
就绪（函数（）{
var-myFeatureLayer；
var map=新映射（“映射”{
底图：“深灰色”
});
地图上（“装载”，装载台）；
函数loadTable（）{
//创建要素图层
myFeatureLayer=新的FeatureLayer（“https://services.arcgis.com/V6ZHFr6zdgNZuVG0/arcgis/rest/services/Warren_College_Trees/FeatureServer/0", {
模式：FeatureLayer.mode\u ONDEMAND，
可见：对，
外场：[
“已收集”、“状态”、“Spp\U代码”、“高度”、“Cmn\U名称”、“Sci\U名称”、“街道”、“本地”
],
id:“fLayer”
});
//设置映射范围
打开（myFeatureLayer，“加载”，功能（evt）{
变量范围=myFeatureLayer.fullExtent；
if（webMercatorUtils.canProject（范围、地图））{
map.setExtent（webmercatutils.project（extent，map））；
}
});
map.addLayer（myFeatureLayer）；
myFeatureTable=新的FeatureTable({
“featureLayer”：myFeatureLayer，
“外场”：[
“已收集”、“Spp_代码”、“高度”、“Cmn_名称”、“Sci_名称”、“本地”
],
现场信息：[{
名称：“Spp_代码”，
别名：“物种代码”，
},
{
名称：“Cmn_名称”，
别名：“公共名称”，
},
{
名称：“Sci_名称”，
别名:"学名",，
}
],
“地图”：地图
}，“myTableNode”）；
myFeatureTable.startup（）；
}
});
});

那么什么不起作用呢？会发生什么？是否已发送请求？如果已发送，请求中包含什么内容？是否已发送响应？如果已发送，响应内容是什么？您是否启用了CORS？