Javascript Template without ArcGIS.com Map Services?

[ChrisPyle]

Is it possible to use the ArcGIS.com javascript templates w/out ArcGIS.com hosted maps?

We're trying to edit a feature service that's on our intranet, and so it is not accessible via ArcGIS.com. I've seen how to add a map definition using JSON instead of just a mapID.
I've been able to load a map hosted on Arcgis.com via the JSON definitition, but when I try to point to our internal services, the map fails to initialize. When initializing, the layer objects under each map layer are all undefined.

So, using the Editor_Chrome template, this works to define the ConfigOptions.webmap:

        var webmap = {}; webmap.item = { "title": "Soil Survey Map of USA", "snippet": "Detailed description of data", "extent": [[-139.4916, 10.7191], [-52.392, 59.5199]] };
        webmap.itemData = { "operationalLayers": [{
        "url": "http://server.arcgisonline.com/ArcGIS/rest/services/Specialty/Soil_Survey_Map/MapServer",
        "visibility": true,
        "opacity": 0.75,
        "title": "Soil Survey Map",
        "itemId": "204d94c9b1374de9a21574c9efa31164"
        }],
        "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"    };
  

But this does not:

        var webmap = {}; webmap.item = { 
        "title": "San Diego Special Events", 
        "snippet": "Special Events Locations", 
        "extent": [[6171671, 1760860], [6621931, 2102353]] };
 
        webmap.itemData = { "operationalLayers": [{
        "url": "http://vmgisprod3/ArcGIS/rest/services/SEPS_Edit/FeatureServer",
        "visibility": true,
        "opacity": 1,
        "title": "Special Events Map",
        "itemId": "204d94c9b1374de9a21574c9efa31164"
        }],
        "baseMap": {
        "baseMapLayers": [{
        "opacity": 1,
        "visibility": true,
        "url": "http://citymaps.sannet.gov/ArcGIS/rest/services/SanGIS_Basemap/MapServer"
        }, {
        "isReference": true,
        "opacity": 1,
        "visibility": true,
        "url": "http://citymaps.sannet.gov/ArcGIS/rest/services/SanGIS_Basemap/MapServer"
        }],
        "title": "San Diego Basemap"
        },
        "version": "1.1"
        };
 

Is there a definition of the JSON webmap syntax somewhere that might give me a clue?

Thanks,
-Chris

[SamLarsen]

I too am attempting to create an application using webmap JSON which is failing.
I am using version 2.6 of the JavaScript API and the JSON sample from:
http://help.arcgis.com/en/webapi/javascript/arcgis/help/jshelp_start.htm#jshelp/intro_webmap.html
Which is clearly an older version of the webmap JSON specification than what is currently being used on ArcGIS.com.
It would really help with development if this specification was published somewhere.  Currently the only way i can get it to work is to look at the JSON responses of the ArcGIS.com webmaps, save the files and then edit them with my own content.

[KellyHutchins]

Chris,

In your second example you are trying to add a layer from a feature service without specify the index of the layer to display. Here's an example that shows how to add a feature service layer:

 "operationalLayers": [{
    "url": "http://sampleserver3.arcgisonline.com/arcgis/rest/services/HomelandSecurity/operations/FeatureServer/2",
    "id": "operations_9184",
    "visibility": true,
    "opacity": 1,
    "mode": 1,
    "title": "operations - Incident Areas",
    "popupInfo": {
      "title": "Incident Areas: {ftype}",
      "fieldInfos": [{
        "fieldName": "objectid",
        "label": "Object ID",
        "isEditable": false,
        "tooltip": "",
        "visible": false,
        "stringFieldOption": "textbox"
      }, {

[MatthewPilgrim]

Hi,

Can anyone provide step-by-step instructions (based on the basic viewer template) on how to replace the webmap id with code that will load map services from an independent server? 

The templates are a good start for learning the javascript api but I could do with some help understanding how to modify them to use a internal map server.

Thanks,

Matt

[TracySchloss]

I haven't been able to figure this out, but I do know from looking at the API reference that map and webmap are two different things.  So it's going to take more than just a few changes in URL etc to get this to work.

I have been successful so far with just adding some lines in the layout.js in the function unitUI.  It still relies on the webmap from arcgis.com, but at least I have been add an additional feature layer over the top.  It's a start anyway.

I inserted these lines after the line map.graphics.add(maxExtentGraphic); 

I'm having problems with the title of the infoTemplate, basically I'm defining it, but it's not showing up as a title.  I think I'm getting infoWindows and popUps confused. 

 var title = "${FACILITY}";
 var content = "<b>${FACILITY}</b>" + "<br>${ADDRESS}" + "<br>${CITY}" ;
   
   var template = new esri.InfoTemplate(title,content); 
   //var template = new esri.InfoTemplate();
   //template.setTitle("hospital");
   //template.setContent(content);
  
        var featureLayer = new esri.layers.FeatureLayer("http://myserver/arcgis/rest/services/myserviceName/MapServer/1",{ 
          mode: esri.layers.FeatureLayer.MODE_SNAPSHOT, 
         outFields: ["*"],
         infoTemplate:template 
        }); 
        var pictureSymbol = new esri.symbol.PictureMarkerSymbol('images/hospital_square.png', 12, 12);    

   
 var featureRenderer = new esri.renderer.SimpleRenderer(pictureSymbol);
 featureLayer.renderer = featureRenderer;
 
 map.addLayer(featureLayer);

[NilsBabel]

Hey there, any more info on converting the map templates to use map services instead of webMaps?  I'm trying to do the same thing.  and am hacking my around layout.js with no success.  Step by step instructions would be great.  Sounds like an idea for an ESRI blog!

Thanks.

[MatthewPilgrim]

I have not focused on this recently.  However at the London Development Conference it was mentioned that a specification for WebMap will be released.  After a bit of digging I found the following which might be useful:

• Initialise a map using an ArcGIS map id.


• As above but pass the id as a URL parameter.


• Initialise a map using JSON.

In the last example I can�??t find documentation for ItemData �?? I assume this is what will be published.  The flex documents describe ItemData as �??The item data returned by getItem(), createMapById() and createMapByItem() in WebMapUtil. This includes the layer information.�?�  They also give another example.

I figure we can probably sniff out enough of the ItemData syntax to store it in a local config file (with services directed to the local server) and then use it to initialise a map.

Hope that helps, Matt

[JohnGravois]

its a bit of a hack, but until the web map specification documentation is released, you can always snoop the itemData JSON for published web maps to get a look at syntax using the following Url format

http://www.arcgis.com/sharing/content/items/[webmapid]/data?f=pjson

for example
http://www.arcgis.com/sharing/content/items/a96ce92a485f4ab4b609cd2f1a7e6e40/data?f=pjson

[KevinMacLeod1]

Thanks all for the info and this question. I am also looking to do this exact same thing: use Basic Viewer template but get rid of dependency on ArcGIS.com, except to call basemap layers on their own.

I'm an extreme beginner with it all (HTML, CSS, JavaScript, ESRI JS API, Dojo etc). But I am making our local web mapping applications and Javascript has been selected for its write-once, run on all platforms capabilities.

I am using Vis. Studio 2012 from Microsoft with all this. I figured out Code Assist.

The Basic Viewer template at first seems simple enough but upon digging in to it not so "basic", for my very humble skills.

What I've done so far is get rid of the ESRI logo (replaced with link to transparent image, I couldn't get any code snippets to work that told it to "turn off") and put a custom logo up at the top of the page via an img src= HTML tag. I added layers via ArcGIS.com and set the initial extent this way. Will these settings hold if I remove dependencies on ArcGIS.com with the webmap ID?

I like that Basic Viewer "just works". But, it's actually a big stack of code and more step-by-step documentation on how to remove ArcGIS.com dependency would be great.

The other thing that first threw me for a loop is the naming convention ESRI has established in Basic Viewer using things like "map" that are easy to confuse with operators or whatever they are called, methods(?), the things you call from Dojo.

Also all this with JSON, sounds intimidating. ESRI can you consider releasing a "local" version of Basic Viewer that is all set up to accept links to our own servers? So we just drop in the URLs to our Services we are publishing with Arc Server? Similar to how it works now only without ArcGIS.com. Kelly or anyone else from ESRI what are your thoughts here?

I hope someone figures an answer out, and much thanks if anyone can post it or a link to it here!  Looking at this thread...is it the consensus that we're stuck waiting for web map "specification" documentation from ESRI?

[JohnGravois]

documentation on the web map spec was released the other day.

it is my understanding that the JavaScript team has no plans to develop and maintain a single configurable "Viewer" which will include a full pallete of widgets and allow you to plug and play with your own services.