nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

esri.layers and AMD - urgent

gsimpson4

I know that version 3.2 of the JS API is not totally AMD compliant yet, but the application I am writing is. So far I haven't had many issues except for the use of esri.layers within an AMD module. More specifically, I get

TypeError: Unable to draw graphic (geometry:null, symbol:null): _14 is undefined
http://serverapi.arcgisonline.com/jsapi/arcgis/3.2/js/esri/layers/FeatureLayer.js
Line 19

when trying to create FeatureLayers. What can I do within my module to get the layer constructors to work? I've noticed that these errors go away with 3.3 of the API, but since that version is not yet final there are other features that are broken for now (using stores with FilteringSelect).

define(["dojo/_base/declare", "esri/layers/FeatureLayer", "esri/layers/agstiled", "esri/layers/dynamic" ], function (declare, FeatureLayer, TiledLayer, DynamicLayer) {      return declare([], {         id: null,         agsid: null,         URL: null,         layertype: null,         maplayer: null,         constructor: function (lyr) {             this.id = lyr.Layer_ID;             this.ags_id = lyr.AGS_ID;             this.layertype = lyr.LayerType;              switch (this.layertype) {                 case "featurelayer":                     this.URL = lyr.Service_URL + "/FeatureServer/" + this.agsid;                     this.maplayer = new esri.layers.FeatureLayer(this.URL, {                         mode: esri.layers.FeatureLayer.MODE_ONDEMAND,                         outFields: ["*"]                     });                     break;                 case "tiled":                     this.URL = lyr.Service_URL + "/MapServer" + ((this.agsid) ? ("/" + this.agsid) : (""));                     this.maplayer = new TiledLayer(this.URL);                     break;                 case "dynamic":                     this.URL = lyr.Service_URL + "/MapServer" + ((this.agsid) ? ("/" + this.agsid) : (""));                     this.maplayer = new DynamicLayer(this.URL);                     //this.maplayer = new esri.layers.ArcGISDynamicMapServiceLayer(this.URL);                     break;                 default:                     this.URL = lyr.Service_URL + "/MapServer" + ((this.agsid) ? ("/" + this.agsid) : (""));                     this.maplayer = new DynamicLayer(this.URL);                     //this.maplayer = new esri.layers.ArcGISDynamicMapServiceLayer(this.URL);                     break;             }         }     }); });

タグ付けされた投稿をもっと見る

Accepted answers

derekswingley1

I don't see a good reason for doing what you're doing in your class but hey, everybody's got their reasons.

On line 21, you reference agsid when you're building this.URL. This should be ags_id as that's what you use at the top of your constructor.

Here's a working example:

define(["dojo/_base/declare", "esri/layers/FeatureLayer", "esri/layers/agstiled", "esri/layers/dynamic"],  function (declare, FeatureLayer, TiledLayer, DynamicLayer) {    return declare([], {     id: null,     agsid: null,     URL: null,     layertype: null,     maplayer: null,     constructor: function (lyr) {       this.id = lyr.Layer_ID;       this.ags_id = lyr.AGS_ID;       this.layertype = lyr.LayerType;        switch (this.layertype) {       case "featurelayer":         this.URL = lyr.Service_URL + "/FeatureServer/" + this.ags_id; // was previously agsid ... missing underscore         this.maplayer = new esri.layers.FeatureLayer(this.URL, {           mode: esri.layers.FeatureLayer.MODE_ONDEMAND,           outFields: ["*"]         });         break;       case "tiled":         this.URL = lyr.Service_URL + "/MapServer" + ((this.agsid) ? ("/" + this.agsid) : (""));         this.maplayer = new TiledLayer(this.URL);         break;       case "dynamic":         this.URL = lyr.Service_URL + "/MapServer" + ((this.agsid) ? ("/" + this.agsid) : (""));         this.maplayer = new DynamicLayer(this.URL);         //this.maplayer = new esri.layers.ArcGISDynamicMapServiceLayer(this.URL);         break;       default:         this.URL = lyr.Service_URL + "/MapServer" + ((this.agsid) ? ("/" + this.agsid) : (""));         this.maplayer = new DynamicLayer(this.URL);         //this.maplayer = new esri.layers.ArcGISDynamicMapServiceLayer(this.URL);         break;       }     }   }); });

And the page that uses the class:

<!DOCTYPE html> <html>   <head>     <meta http-equiv="Content-Type" content="text/html; charset=utf-8">     <meta http-equiv="X-UA-Compatible" content="IE=7,IE=9" />     <!--The viewport meta tag is used to improve the presentation and behavior of the samples        on iOS devices-->     <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">     <title></title>     <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.2/js/esri/css/esri.css" />          <style>       html, body { height: 100%; width: 100%; margin: 0; padding: 0; }       .esriScalebar{         padding: 20px 20px;       }       #map{         padding:0;       }     </style>     <script>       var dojoConfig = {          packages: [{           "name": "extras",           "location": location.pathname.replace(/\/[^/]+$/, '') + ""         }]       };     </script>     <script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/3.2compact"></script>     <script type="text/javascript">       var map;       require([         "dojo/parser",         "dijit/layout/BorderContainer", "dijit/layout/ContentPane",         "esri/map", "extras/LayerWrapper"       ], function(parser, BC, CP, Map, Layer) {         // create layout dijits         parser.parse();          // create a map         map = new esri.Map("map", {           "extent": new esri.geometry.Extent({"xmin":-13635599,"ymin":4545388,"xmax":-13632458,"ymax":4546651,"spatialReference":{"wkid":102100}})         });          // add streets         var url = "http://server.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer";         var tiled = new esri.layers.ArcGISTiledMapServiceLayer(url);         map.addLayer(tiled);          // add the feautre layer, via the layer wrapper         var flInfo = {           "Layer_ID": "counties",           "AGS_ID": 0,           "LayerType": "featurelayer",           "Service_URL": "http://sampleserver6.arcgisonline.com/arcgis/rest/services/SF311"         };         var fl = new Layer(flInfo);         console.log("created fl: ", fl);         map.addLayer(fl.maplayer);       });     </script>   </head>      <body>     <div dojotype="dijit.layout.BorderContainer" design="headline" gutters="false" style="width: 100%; height: 100%; margin: 0;">       <div id="map" dojotype="dijit.layout.ContentPane" region="center" style="border:1px solid #000;padding:0;">      </div>     </div>   </body> </html>

All comments

derekswingley1

Gladly... I see you marked your original post as the answer, did you mean to do that?

gsimpson4

D'oh! Thanks for the eyes

derekswingley1

define(["dojo/_base/declare", "esri/layers/FeatureLayer", "esri/layers/agstiled", "esri/layers/dynamic"],  function (declare, FeatureLayer, TiledLayer, DynamicLayer) {    return declare([], {     id: null,     agsid: null,     URL: null,     layertype: null,     maplayer: null,     constructor: function (lyr) {       this.id = lyr.Layer_ID;       this.ags_id = lyr.AGS_ID;       this.layertype = lyr.LayerType;        switch (this.layertype) {       case "featurelayer":         this.URL = lyr.Service_URL + "/FeatureServer/" + this.ags_id; // was previously agsid ... missing underscore         this.maplayer = new esri.layers.FeatureLayer(this.URL, {           mode: esri.layers.FeatureLayer.MODE_ONDEMAND,           outFields: ["*"]         });         break;       case "tiled":         this.URL = lyr.Service_URL + "/MapServer" + ((this.agsid) ? ("/" + this.agsid) : (""));         this.maplayer = new TiledLayer(this.URL);         break;       case "dynamic":         this.URL = lyr.Service_URL + "/MapServer" + ((this.agsid) ? ("/" + this.agsid) : (""));         this.maplayer = new DynamicLayer(this.URL);         //this.maplayer = new esri.layers.ArcGISDynamicMapServiceLayer(this.URL);         break;       default:         this.URL = lyr.Service_URL + "/MapServer" + ((this.agsid) ? ("/" + this.agsid) : (""));         this.maplayer = new DynamicLayer(this.URL);         //this.maplayer = new esri.layers.ArcGISDynamicMapServiceLayer(this.URL);         break;       }     }   }); });

And the page that uses the class:

<!DOCTYPE html> <html>   <head>     <meta http-equiv="Content-Type" content="text/html; charset=utf-8">     <meta http-equiv="X-UA-Compatible" content="IE=7,IE=9" />     <!--The viewport meta tag is used to improve the presentation and behavior of the samples        on iOS devices-->     <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">     <title></title>     <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.2/js/esri/css/esri.css" />          <style>       html, body { height: 100%; width: 100%; margin: 0; padding: 0; }       .esriScalebar{         padding: 20px 20px;       }       #map{         padding:0;       }     </style>     <script>       var dojoConfig = {          packages: [{           "name": "extras",           "location": location.pathname.replace(/\/[^/]+$/, '') + ""         }]       };     </script>     <script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/3.2compact"></script>     <script type="text/javascript">       var map;       require([         "dojo/parser",         "dijit/layout/BorderContainer", "dijit/layout/ContentPane",         "esri/map", "extras/LayerWrapper"       ], function(parser, BC, CP, Map, Layer) {         // create layout dijits         parser.parse();          // create a map         map = new esri.Map("map", {           "extent": new esri.geometry.Extent({"xmin":-13635599,"ymin":4545388,"xmax":-13632458,"ymax":4546651,"spatialReference":{"wkid":102100}})         });          // add streets         var url = "http://server.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer";         var tiled = new esri.layers.ArcGISTiledMapServiceLayer(url);         map.addLayer(tiled);          // add the feautre layer, via the layer wrapper         var flInfo = {           "Layer_ID": "counties",           "AGS_ID": 0,           "LayerType": "featurelayer",           "Service_URL": "http://sampleserver6.arcgisonline.com/arcgis/rest/services/SF311"         };         var fl = new Layer(flInfo);         console.log("created fl: ", fl);         map.addLayer(fl.maplayer);       });     </script>   </head>      <body>     <div dojotype="dijit.layout.BorderContainer" design="headline" gutters="false" style="width: 100%; height: 100%; margin: 0;">       <div id="map" dojotype="dijit.layout.ContentPane" region="center" style="border:1px solid #000;padding:0;">      </div>     </div>   </body> </html>

会話に参加する

サインインしたメンバーは投稿、更新のフォローなどができます。初めてですか？無料アカウントを登録してください。

クイックリンク

Community Help
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.