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; } } }

javascript basic viewer and WMS or KML operational layers

NakishaFouch

I am using the javascript basic viewer template and accessing the basemaps and my own rest services operational layers using the json example (http://help.arcgis.com/en/webapi/javascript/arcgis/help/jssamples_start.htm). Has anyone attempted to integrate WMS or KML operational layers into the javascript basic viewer template? Any insight on how to do this would be greatly appreciated.

Vind meer berichten getagd met

Accepted answers

All comments

NakishaFouch

Yeah, I can download the data add it to our rest services too. I did notice when I checked the firebug Net tab that it doesn't seem to be even attempting to load the wms layer. When I run the KML layer I see the utility.arcgis.com that is getting the kml...nothing like that is happening for the wms layer.

JohnGravois

hmmm.... not sure whats going on there.

i think it would be worthwhile to echo Kelly's earlier comments... even if you are hosting WMS layers on your own ArcGIS Server machine, you can still mash the content up in arcgis.com and create a webmap pretty conveniently. anytime the webmap is consumed, the content is still going to be pulled from your own machine. arcgis.com is only saving the url of the resource.

NakishaFouch

Hmm well since I am using the basic viewer template, the extent code is a little more complicated. On the backend the extent settings seem to be setup to use whatever extent comes with first operational layer. I am explicitly setting my extent to near se asia with a spatial reference of 4326, which looks to be what that wms layer is using based on the examples. However, even after commenting out that explicit extent setting, as well as the other operational layers, I am still not having much luck getting the layer to appear.

JohnGravois

i wasn't able to see the wms in that sample either (until i commented out the other layers and the web mercator map extent).

app.map = new esri.Map("map"/*, {
          "extent": new esri.geometry.Extent({"xmin":-13074922,"ymin":4015867,"xmax":-13073339,"ymax":4016413,"spatialReference":{"wkid":102100}})
        }*/);

//app.map.addLayer(satellite);
//app.map.addLayer(labels);
//app.map.addLayer(poolFeatureLayer);

NakishaFouch

Very helpful!

I added the code, it's running without error but the layer doesn't show up in the layer dropdown, on the legend, or on the basemap. I haven't changed anything, I am using the example wms exactly.

The KML is up and running.

I also found this link:

http://resources.arcgis.com/en/help/main/10.1/index.html#//0154000004w8000000

which provides lots of examples for the webmap json.

JohnGravois

hi Nakisha,

since our print samples convert the contents of the application to webmap json, i was able to get another valid example for wms by including it in the following app, and then snooping the network traffic.

hopefully it helps!

var wmsLayer = new esri.layers.WMSLayer("http://sampleserver1.arcgisonline.com/ArcGIS/services/Specialty/ESRI_StatesCitiesRivers_USA/MapServer/WMSServer");
wmsLayer.setVisibleLayers([0,1,2]);
wmsLayer.setImageFormat("png");

{
"id" : "layer0",
"url" : "http://sampleserver1.arcgisonline.com/ArcGIS/services/Specialty/ESRI_StatesCitiesRivers_USA/MapServer/WMSServer",
"title" : "Specialty/ESRI_StatesCitiesRivers_USA",
"opacity" : 1,
"type" : "wms",
"version" : "1.3.0",
"transparentBackground" : true,
"visibleLayers" : ["0", "1", "2"]
}

NakishaFouch

Thanks Kelly. I assume the wms layer code is pretty similar, just a type = wms?

We have a couple of wms and kml layers, but most the data we are using is from our own rest services. We wanted the option of using the basic template, since it provides a nice user interface with lots of functionality built in, but we wanted to hang it off our server instead of using Arcgis.com since it is using mostly internal data.

Again, thanks for the assistance!

khutchins

We don't have the web map spec documented yet so it isn't a simple task to create a web map using json. You could use ArcGIS.com to build the web map with all the layers that you want to include then use Chrome Dev Tools or Firebug to inspect the requests to see the web map json for that map.

I added a KML layer to a sample map and here's how the KML operational layer looked.

{
        "url": "http://dl.dropbox.com/u/2654618/kml/Wyoming.kml",
        "id": "kml_6802",
        "visibility": true,
        "opacity": 1,
        "title": "Wyoming",
        "type": "KML",
        "visibleFolders": [0, 1]
    }

A simpler alternative would be to just build the web map in arcgis.com and use the id in the basic viewer app. Is there a reason you don't want to do this?

NakishaFouch

I have seen those examples, but I am trying to use the javascript basic viewer template so I am trying to add wms layers and kml layers based on the way the code is structured in that basic viewer template, which is more like this...

var webmap = {};
        webmap.item = {
          "title":"",
          "snippet": "",
          "extent": [[ 30.05859375, -42.36328125],[188.26171875, 63.10546875]]
        };

        webmap.itemData = {
        "operationalLayers": [
    {
   "url":"http://.../ArcGIS/rest/services/.../MapServer/",
   "visibility":true,
   "opacity":0.4,
   "title":"Human Footprint Index v.2 1995-2004"
},

   {
                     "url": "http://.../ArcGIS/rest/services/.../MapServer/",
                     "visibility": true,
              visibleLayers": [0],
                     "opacity": 0.75,
                     "title": "World DB on Protected Areas"
    }],
          "baseMap": {
            "baseMapLayers": [{
              "opacity": 1,
              "visibility": true,
              "url": "http://services.arcgisonline.com/ArcGIS/rest/services/World_Terrain_Base/MapServer"
              },
     {
              "isReference": true,
              "opacity": 1,
              "visibility": true,
              "url": "http://services.arcgisonline.com/ArcGIS/rest/services/Reference/World_Reference_Overlay/MapServer"
              }],
            "title": "World_Terrain_Base"
          },
          "version": "1.1"
        };

      //get the localization strings
      i18n = dojo.i18n.getLocalization("esriTemplate", "template");
      configOptions = {
         webmap:webmap,
        //The id for the web mapping applciation item that contains configuration info - in most
        //cases this will be null.
        appid: "",
        //set to true to display the title
        displaytitle: true,
        //Enter a title, if no title is specified, the webmap's title is used.
        title: "OPG Community MapIT",
        //Enter a description for the application. This description will appear in the left pane
        //if no description is entered the webmap description will be used.
        description: "",
layer: "http://Maps.clemson.edu/ArcGIS/rest/services/anjo_web/MapServer",
        //specify an owner for the app - used by the print option. The default value will be the web map's owner
        owner: '',
//Specify a color theme for the app. Valid options are gray,blue,purple,green and orange
        theme: 'gray',
        //Optional tools - set to false to hide the tool
        //set to false to hide the zoom slider on the map
        displayslider: true,
        displaymeasure: true,
        displaybasemaps: true,
        displayoverviewmap: true,
        displayeditor: true,
        etc......

And so far I can't get the wms and kml layers to work in this structure. So any insight on how to do this is greatly appreciated.

JohnGravois

by JSON example, do you mean this one?
http://help.arcgis.com/en/webapi/javascript/arcgis/help/jssamples/layers_wms.html

have you seen our KML and WMS samples?

Doe mee aan het gesprek

Aangemelde leden kunnen berichten plaatsen, updates volgen en meer. Nieuw hier? Registreer een gratis account.

Snelle Links

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