topic Re: esri/basemap baseLayers collection in ArcGIS JavaScript Maps SDK Questions

esri/basemap baseLayers collection

MichaelTownshend — Wed, 15 Feb 2017 15:47:39 GMT

I am in the process of building a custom web app that I have working properly using the JSAPI v 3.19. This is my first experience with the 4.2 version. I can not find examples of how to properly build a new Basemap in the 4.2 docs.

When I replace the reference to customBaseMap in the Map object with "hybrid" it works fine as it is using a basemap from AGOL. When I reference customeBaseMap in the Map object I get a blank map. When I use FireBug or the IE Developer tools I get no error. Attached is the full code. Below is a snip of the JS:

var imageURL = "http://firstmap.gis.delaware.gov/arcgis/rest/services/DE_Imagery/DE_Imagery_2012/ImageServer";
var labelURL = "http://firstmap.gis.delaware.gov/arcgis/rest/services/BaseMap/DE_AerialCache/MapServer";

var customBasemap = new Basemap({
baseLayers: [
{ url: imageURL },
{ url: labelURL }
],
title: "Satellite",
id: "myMap"
});

var map = new Map({
basemap: customBasemap
});

var view = new MapView({
container: "viewDiv",
map: map,
extent: {
xmin: -8444782,
ymin: 4634522,
xmax: -8360273,
ymax: 4853595,
spatialReference: 102100
}
});

});
</script>

Has anyone run into this before or know if some solid documentation on how to build a collection of custom basemaps?

Re: esri/basemap baseLayers collection

thejuskambi — Wed, 15 Feb 2017 16:11:47 GMT

Hello Michael,

The value you have passed for the baseLayers is wrong. You either need to send an instance of layer or object which it can identify as layer. Right now it might not be able identify which type of layer it is by just url.

Here is an example for creating custom basemap.

Custom Basemap | ArcGIS API for JavaScript 4.2

Hope this was helpful.

Re: esri/basemap baseLayers collection

MichaelTownshend — Wed, 15 Feb 2017 16:37:13 GMT

I get what you are saying... My method in the attached example does work using 3.19 so this is a little different. I tried creating 2 instances of a TileLayer and then adding them to the baseLayers property of the Basemap object. The map still does not display and I still do not get errors.

require([

"esri/Map",

"esri/views/MapView",

"esri/layers/TileLayer",

"esri/Basemap",

"dojo/domReady!"

function(

Map, MapView, Basemap, TileLayer

) {

var imageLayer = new TileLayer({

url: "http://firstmap.gis.delaware.gov/arcgis/rest/services/DE_Imagery/DE_Imagery_2012/ImageServer"

});

var labelLayer = new TileLayer({

url: "http://firstmap.gis.delaware.gov/arcgis/rest/services/BaseMap/DE_AerialCache/MapServer"

});

var customBasemap = new Basemap({

baseLayers: [imageLayer, labelLayer],

title: "Satellite",

id: "myMap"

});

var map = new Map({

basemap: customBasemap

});

var view = new MapView({

container: "viewDiv",

map: map,

extent: { // autocasts as new Extent()

xmin: -8444782,

ymin: 4634522,

xmax: -8360273,

ymax: 4853595,

spatialReference: 102100

}

});

</script>

Re: esri/basemap baseLayers collection

MichaelTownshend — Wed, 15 Feb 2017 18:59:05 GMT

Disregard my last response... Your recommendation worked. Basemap and TileLayer were in the wrong order.