Custom layer (WMS) - example in AMD version

WojciechRozkowski — Thu, 08 Sep 2016 13:01:17 GMT

I've found an example of creating custom request to WMS service written in non-AMD style:

Custom layer - WMS | ArcGIS API for JavaScript 3.17

I'm trying to implement this kind approach but in modern AMD approach.

Unfortunately, as a beginner, I don't know how to rewrite this example to fit AMD style. Especially the part with defining my.CityStatesRiversUSAWMSLayer() function with callback is out of my reach.

Could you please provide the mentioned example in AMD style?

Re: Custom layer (WMS) - example in AMD version

RobertScheitlin__GISP — Sat, 11 Dec 2021 13:39:08 GMT

Wojciech,

Here is the code updated to AMD:

<!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>WMS</title>

    <link rel="stylesheet" href="https://js.arcgis.com/3.17/dijit/themes/claro/claro.css">
    <link rel="stylesheet" href="https://js.arcgis.com/3.17/esri/css/esri.css">

    <script src="https://js.arcgis.com/3.17/"></script>
    <script>
    var map;
    require([
      "dojo/_base/declare",
      "esri/map",
      "esri/geometry/Extent",
      "esri/layers/DynamicMapServiceLayer",
      "esri/SpatialReference",
      "dojo/domReady!"
    ], function(
      declare, Map, Extent,
      DynamicMapServiceLayer, SpatialReference
    ) {
      declare("my.CityStatesRiversUSAWMSLayer", DynamicMapServiceLayer, {
        constructor: function() {
          this.initialExtent = this.fullExtent = new Extent({"xmin":-16476154.32,"ymin":2504688.54,"xmax":-6457400.14,"ymax":7514065.62,"spatialReference":{"wkid":102100}});
          this.spatialReference = new SpatialReference({wkid:102100});
          this.loaded = true;
          this.onLoad(this);
        },

        getImageUrl: function(extent, width, height, callback) {
          var params = {
            request:"GetMap",
            transparent:true,
            format:"image/png",
            bgcolor:"ffffff",
            version:"1.1.1",
            layers:"0,1",
            styles: "default,default",
            exceptions: "application/vnd.ogc.se_xml",

            //changing values
            bbox:extent.xmin + "," + extent.ymin + "," + extent.xmax + "," + extent.ymax,
            srs: "EPSG:" + extent.spatialReference.wkid,
            width: width,
            height: height
          };

          callback("https://sampleserver1.arcgisonline.com/arcgis/services/Specialty/ESRI_StatesCitiesRivers_USA/MapServer/WMSServer?" + dojo.objectToQuery(params));
        }
      });

      map = new Map("map", {
        basemap: "satellite",
        center: [-103.008, 40.98],
        zoom: 4
      });
      map.addLayer(new my.CityStatesRiversUSAWMSLayer());
    });
    </script>
  </head>
  <body class="claro">
    <div id="map"  style="position:relative; width:1024px; height:512px; border:2px solid #000;"></div>
  </body>
</html>
‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

Re: Custom layer (WMS) - example in AMD version

WojciechRozkowski — Thu, 08 Sep 2016 15:06:28 GMT

Thank you very much Robert.

Someone from Esri can take your work and update the example:)

topic Re: Custom layer (WMS) - example in AMD version in ArcGIS JavaScript Maps SDK Questions

Custom layer (WMS) - example in AMD version

Re: Custom layer (WMS) - example in AMD version

Re: Custom layer (WMS) - example in AMD version