topic Re: Zoom in beyond the basemap's maximum zoom level in Javascript in ArcGIS JavaScript Maps SDK Questions

Zoom in beyond the basemap's maximum zoom level in Javascript

CrisBarredo — Mon, 22 Jul 2013 06:04:08 GMT

Can someone help me on how to zoom in beyond the basemap's maximum zoom level in Javascript?
I'm using satellite as my basemap and I want to zoom in more than the maximum zoom level.
I'm also using ArcGIS Online to publish feature services created using ArcGIS Desktop.

Re: Zoom in beyond the basemap's maximum zoom level in Javascript

SteveCole — Mon, 22 Jul 2013 14:15:03 GMT

I haven't personally done this but I'm thinking that you need to create a custom Level of Detail (LOD) option that you would specify when you create your new map. Look at the new map options section for LODs. This sample isn't quite what you need to do but it does illustrate some of what you will need to do.

I think you can just mimic the default LOD levels for your satellite basemap but add the additional LODs for zooming in beyond it's maximum detail.

Re: Zoom in beyond the basemap's maximum zoom level in Javascript

JohnGravois — Mon, 22 Jul 2013 15:51:17 GMT

my understanding is that this is not currently possible, but something the development team is actively working on including in a future release.

Re: Zoom in beyond the basemap's maximum zoom level in Javascript

MStayner — Mon, 30 Sep 2013 18:56:50 GMT

Any update on this?

Re: Zoom in beyond the basemap's maximum zoom level in Javascript

JeffPace — Mon, 30 Sep 2013 19:10:55 GMT

We currently go down to level 20 with custom LODs.

The constraint is really the basemap. I hope they consider adding another level

Re: Zoom in beyond the basemap's maximum zoom level in Javascript

JohnGravois — Mon, 30 Sep 2013 19:32:48 GMT

i haven't done any testing, but in version 3.6 of the JS API they listed the bug below as 'resolved':

[NIM093459: Resample tiledMapServiceLayer at the levels where it doesn't have data available and the service returns 404 for missing tiles.]

Re: Zoom in beyond the basemap's maximum zoom level in Javascript

ThomasRoussell — Sat, 11 Dec 2021 20:35:46 GMT

I just tried this, and it works at version 3.7 of the javascript api.

    var c = new esri.geometry.Point(2473044, 7636297, new esri.SpatialReference({ wkid: 2953 }));

    var lods = [
    {"level" : 0, "scale" : 3000000, "resolution" : 793.75158750317507}, 
    {"level" : 1, "scale" : 2000000, "resolution" : 529.16772500211675}, 
    {"level" : 2, "scale" : 1000000, "resolution" : 264.58386250105838}, 
    {"level" : 3, "scale" :  500000, "resolution" : 132.29193125052919}, 
    {"level" : 4, "scale" :  250000, "resolution" : 66.145965625264594}, 
    {"level" : 5, "scale" :  125000, "resolution" : 33.072982812632297}, 
    {"level" : 6, "scale" :   50000, "resolution" : 13.229193125052918}, 
    {"level" : 7, "scale" :   30000, "resolution" : 7.9375158750317505}, 
    {"level" : 8, "scale" :   12500, "resolution" : 3.3072982812632294}, 
    {"level" : 9, "scale" :    5000, "resolution" : 1.3229193125052918}, 
    {"level" :10, "scale" :    2500, "resolution" : 0.66145965625264591}, 
    {"level" :11, "scale" :    1000, "resolution" : 0.26458386250105836}, 
    {"level" :12, "scale" :     500, "resolution" : 0.13229193125052918}, 
    {"level" :13, "scale" :     250, "resolution" : 0.066145965625264591}, 
    {"level" :14, "scale" :     100, "resolution" : 0.026458386250105836}, 
    ];

    map = new esri.Map("map", {
        basemap: standard_basemap_basemap,
        center: c,
        zoom: 6,
        slider: false,
        logo: false,
        spatialReference: new esri.SpatialReference({ wkid: 2953 }),
        lods: lods
    });

Re: Zoom in beyond the basemap's maximum zoom level in Javascript

JohnGravois — Mon, 07 Oct 2013 15:09:06 GMT

awesome Thomas. thanks for sharing!

Re: Zoom in beyond the basemap's maximum zoom level in Javascript

JeffPace — Mon, 07 Oct 2013 16:41:18 GMT

not resolved.

Trying to get to level 20 of the street map returns no tiles

Would love to get to level 20 and 21

-Jeff

Re: Zoom in beyond the basemap's maximum zoom level in Javascript

ThomasRoussell — Mon, 07 Oct 2013 17:43:08 GMT

The code above allows you to zoom in beyond the basemap's maximum zoom level, but you won't see any basemap tiles since none exist at those scales. I use the code so that I could zoom in to a Dynamic MapService Layer at larger scales than is provided by the basemap. At the larger scales the Dynamic mapservice layer is displayed without a basemap in the background.

Re: Zoom in beyond the basemap's maximum zoom level in Javascript

JeffPace — Mon, 07 Oct 2013 17:44:40 GMT

oh ok i see the difference.

Yes I would actually like to display

Re: Zoom in beyond the basemap's maximum zoom level in Javascript

TracySchloss — Mon, 07 Oct 2013 19:15:54 GMT

Personally I would like to at least see all the basemaps match to have the same thresholds. For whatever reason, the gray canvas background ends at 16, which is much farther out than the others!

Re: Zoom in beyond the basemap's maximum zoom level in Javascript

JordanBaumgardner — Thu, 22 Jun 2017 15:13:03 GMT

Just to save someone some linking in the future. I pulled the relevant code:

require([
"esri/Map",
"esri/views/MapView",
"esri/layers/support/LOD",
"dojo/domReady!"
], function (Map, MapView, LOD) {

var lods = [];
var tilesize = 256;
var earthCircumference = 40075016.685568;
var halfEarthCircumference = halfEarthCircumference * 0.5;
var inchesPerMeter = 39.37;
var initialResolution = earthCircumference / tilesize;
for (var zoom = 0; zoom <= 27; zoom++) {
var resolution = initialResolution / Math.pow(2, zoom);
var scale = resolution * 96 * inchesPerMeter;
lods.push(new LOD({
level: zoom,
scale: scale,
resolution: resolution
}));
}

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

var view = new MapView({
container: "viewDiv",
map: map,
zoom: 18,
center: [-104.991531, 39.742043],
constraints: {
lods: lods
}
});
});