AnsweredAssumed Answered

ArcGISDynamicMapServiceLayer Not displaying on Map

Question asked by swsmith14 on Oct 13, 2014
Latest reply on Oct 13, 2014 by swsmith14

I have been working on a project using the JS API where I need to overlay a map of street centerlines on a base street map.  I took one of the samples from the API sample code and modified to use my layer, however, it does not display.  The layer will load into ArcMap and ArcGIS viewer properly.  I'm a little stuck at this point and could use some help. 

 

<style>

    html, body, #ui-esri-map {

      width:   100%;

      height:  100%;

      margin:  0;

      padding: 0;

    }

    #ui-esri-dijit-geocoder {

      top:      20px;

      left:     70px;

      position: absolute;

      z-index:  3;

    }

    #Legend {

      top:      20px;

      left:     1000px;

      position: absolute;

      z-index:  3;

    }

    .esriPopup .titlePane {

      text-shadow: none;

    }

 

    .esriPopup .titleButton.next {

      right: 40px;

    }

 

    .esriPopup .titleButton.prev {

      right: 53px;

    }

  </style>

 

<script src="http://js.arcgis.com/3.10/"></script>

<script>

    var map;

    require([

      "dojo/dom-construct",

      "esri/Color",

      "esri/dijit/Geocoder",

      "esri/dijit/Popup",

      "esri/InfoTemplate",

 

      "esri/layers/ArcGISDynamicMapServiceLayer",

      "esri/map",

      "esri/symbols/SimpleFillSymbol",

      "esri/symbols/SimpleLineSymbol", "dojo/domReady!"

    ], function (

      domConstruct, Color, Geocoder, Popup, InfoTemplate,

      ArcGISDynamicMapServiceLayer, Map, SimpleFillSymbol, SimpleLineSymbol

    ) {

        var sls = new SimpleLineSymbol("solid", new Color("#444444"), 3);

        var sfs = new SimpleFillSymbol("solid", sls, new Color([68, 68, 68, 0.25]));

 

        var popup = new Popup({

            fillSymbol: sfs,

            lineSymbol: null,

            markerSymbol: null

        }, domConstruct.create("div"));

 

                map = new Map("ui-esri-map", {

                    basemap: "streets",

                    center: [-76.347304, 39.533987], // long, lat

                    zoom: 11,

                    sliderStyle: "small"

                });

//        map = new Map("ui-esri-map", {

//            basemap: "topo",

//            center: [-94.75290067627297, 39.034671990514816], // long, lat

//            zoom: 12,

//            sliderStyle: "small",

//            infoWindow: popup

//        });

 

var geocoder = new Geocoder({

            arcgisGeocoder: {

                placeholder: "Search "

            },

            map: map

        }, "ui-esri-dijit-geocoder");

 

                var centerlineLayerURL = "http://gismaps.harfordcountymd.gov/arcgis/rest/services/ICT/CenterlineWebMercator/MapServer";

                var centerlineLayerOptions = {

                    "id": "centerlineLayer",

                    "opacity": 1,

                    "showAttribution": false,

                    "disableClientCaching": true

                };

         var centerlineLayer = new ArcGISDynamicMapServiceLayer(centerlineLayerURL, centerlineLayerOptions);

   

        centerlineLayer.setVisibleLayers([1,2]);

          map.addLayer(centerlineLayer);

        geocoder.startup();

    });

 

    var formatNumber = function (value, key, data) {

        var searchText = "" + value;

        var formattedString = searchText.replace(/(\d)(?=(\d\d\d)+(?!\d))/gm, "$1,");

        return formattedString;

    };

  </script>

Outcomes