topic ImageServer services as basemaps in JSAPI in ArcGIS JavaScript Maps SDK Questions

ImageServer services as basemaps in JSAPI

ScottDickison — Sat, 11 Dec 2021 07:23:12 GMT

I'm defining two basemaps in version 3.12 of the Javascript API as follows:

 esriBasemaps.kytcbase = {
                   baseMapLayers: [{ url: "http://maps.kytc.ky.gov/arcgis/rest/services/BaseMap/KYTCBaseMap/MapServer" }], title: "Basemap",
                   thumbnailUrl: "http://maps.kytc.ky.gov/arcgis/rest/services/BaseMap/KYTCBaseMap/mapserver/info/thumbnail"
               };
               esriBasemaps.imagery = {
                   baseMapLayers: [{ url: "http://kyraster.ky.gov/arcgis/rest/services/ImageServices/Ky_NAIP_2012_1M/ImageServer" }], title: "Imagery",
                   thumbnailUrl: "http://kyraster.ky.gov/arcgis/rest/services/ImageServices/Ky_NAIP_2012_1M/ImageServer/info/thumbnail"
               };

Both of these services have the same spatial reference. What I'm trying to do is use these in the BasemapToggle dijit. The tiled map service displays correctly but the ImageServer service doesn't draw. The error that gets returned is:

TypeError: Unable to get property '_getInfo' of undefined or null referenceTypeError: Unable to get property '_getInfo' of undefined or null reference

My question is:

Are ImageServer services allowed to be used as basemaps?

Re: ImageServer services as basemaps in JSAPI

RobertScheitlin__GISP — Sat, 11 Dec 2021 07:23:14 GMT

Scott,

I have thrown together a simple app for testing purposes and I do see the issue you are running into. I am not sure what the issue is but this simple test app will help esri staff to diagnose the issue.

<!DOCTYPE HTML>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
  <title>Basemap Toggle</title>
  <link rel="stylesheet" href="http://js.arcgis.com/3.12/esri/css/esri.css">
  <style>
    html, body, #map {
      padding:0;
      margin:0;
      height:100%;
    }
    #BasemapToggle {
      position: absolute;
      top: 20px;
      right: 20px;
      z-index: 50;
    }
  </style>
  <script src="http://js.arcgis.com/3.12/"></script>
  <script>
var map;
    require([
      "esri/map",
      "esri/dijit/BasemapToggle",
      "esri/dijit/Basemap",
      "esri/dijit/BasemapLayer",
      "esri/geometry/Extent",
      "esri/basemaps",
      "dojo/domReady!"
    ], function(
      Map,
      BasemapToggle,
      Basemap,
      BasemapLayer,
      Extent,
      esriBasemaps
    )  {

      esriBasemaps.kytcbase = {
        baseMapLayers: [{ url: "http://maps.kytc.ky.gov/arcgis/rest/services/BaseMap/KYTCBaseMap/MapServer" }], title: "Basemap",
        thumbnailUrl: "http://maps.kytc.ky.gov/arcgis/rest/services/BaseMap/KYTCBaseMap/mapserver/info/thumbnail",
        title: "Kentucy Base"
      };
      esriBasemaps.kyimagery = {
        baseMapLayers: [{ url: "http://kyraster.ky.gov/arcgis/rest/services/ImageServices/Ky_NAIP_2012_1M/ImageServer" }], title: "Imagery",
        thumbnailUrl: "http://kyraster.ky.gov/arcgis/rest/services/ImageServices/Ky_NAIP_2012_1M/ImageServer/info/thumbnail",
        title: "Kentucy Imagery"
      };

      map = new Map("map", {
        extent: new Extent({xmin:3595646.0096294726,ymin:2804803.5152565213,xmax:6154239.759629473,ymax:4701504.904145411,spatialReference:{wkid:102763}}),
        zoom: 3,
        basemap: 'kytcbase'
      });

      var toggle = new BasemapToggle({
        map: map,
        basemap: 'kyimagery'
      }, "BasemapToggle");
      toggle.startup();

    });
  </script>
</head>
<body>
  <div id="map" class="map">
    <div id="BasemapToggle"></div>
  </div>
</body>
</html>

Kelly Hutchins‌ Any ideas on this or should Scott just call tech support on this?

Re: ImageServer services as basemaps in JSAPI

ScottDickison — Tue, 24 Feb 2015 18:59:12 GMT

Excellent. Thank you very much.

Re: ImageServer services as basemaps in JSAPI

KellyHutchins — Tue, 24 Feb 2015 19:28:23 GMT

I ran a quick test using your demo code and the code looks ok. I can try and look at it in more depth later but I think Scott should contact support for this one.

Re: ImageServer services as basemaps in JSAPI

KenBuja — Sat, 11 Dec 2021 07:23:17 GMT

I am able to use an ImageServer service as a Basemap in the Basemap Gallery

var basemapGallery = new BasemapGallery({
    showArcGISBasemaps: true,
    map: map
}, "divBasemapGallery");

var chartsBMLayer = new BasemapLayer({
    url: "http://seamlessrnc.nauticalcharts.noaa.gov/arcgis/rest/services/RNC/NOAA_RNC/ImageServer"
});
var chartBaseMap = new Basemap({
    layers: [chartsBMLayer],
    title: "NOAA Charts",
    id: "NOAAChart",
    thumbnailUrl: "../_assets/resources/assets/images/chartbasemap.png"
});
basemapGallery.on("load", function () {
    basemapGallery.add(chartBaseMap);
});

Re: ImageServer services as basemaps in JSAPI

ScottDickison — Tue, 24 Feb 2015 20:09:40 GMT

I can switch over to the Basemap Gallery if necessary but it seemed to be a bit too much since I only had the two layers that I'm dealing with.

Re: ImageServer services as basemaps in JSAPI

ScottDickison — Tue, 24 Feb 2015 20:10:13 GMT

Thanks,

We'll give support a call tomorrow.

Re: ImageServer services as basemaps in JSAPI

ScottDickison — Wed, 25 Feb 2015 13:59:30 GMT

I tried to this yesterday evening and was unable to get it work. I followed your example code and was able to get the exact opposite to occur. This time I was able to see the imageserver service but not the tiled one. This is acting like they're in two different spatial references but they are both wkid: 102763.

I'm not sure if this is a bug as much as it is that I'm not doing something right.

Re: ImageServer services as basemaps in JSAPI

ScottDickison — Wed, 25 Feb 2015 14:01:53 GMT

I'm going to have to put this on the back burner today. I've got some other project demands that I have to meet. I'm going to flag this in my calendar so I can revisit this because I'd really like to get these dijits working with our basemap.