Hello,
When we drag the map and reach the top of the map , we can see the whitespace around the map. Is there any way to solve the issue. I have attached the screenshot and the code sample for the further reference.
Any suggestions would be helpful.
Thank you.
Code sample: https://developers.arcgis.com/javascript/latest/sample-code/sandbox/?sample=intro-mapview
Hi @KarthikeyanShanmugam ,
You can add minZoom or minScale constraints to set the minimum zoom level or scale for the map view.
https://codepen.io/sagewall/pen/eYQVjbm
require(["esri/Map", "esri/views/MapView"], (Map, MapView) => { const map = new Map({ basemap: "topo-vector" }); const view = new MapView({ container: "viewDiv", map: map, zoom: 4, center: [15, 65], // longitude, latitude constraints: { minZoom: 3 } }); });
I just re-read the question, simply setting the minZoom constraint won't work to prevent the user from panning into the white space. I don't think there is an out of the box way to constrain the map view to a certain extent, but I did find this older post that may help: https://community.esri.com/t5/arcgis-javascript-maps-sdk-questions/getting-mapview-to-stay-within-bounds/td-p/350982. Instead of using the initial extent like that sample in the post is doing you would likely need to create an allowed extent and then do something similar
Far from a perfect solution, but you could also set a CSS background color on the map container to make the edge of the map less jarring
Try the MapView.constraints.geometry property.
Doh... I totally missed that in the doc. I think I was looking for "extent". Thanks @JohnGrayson
Thanks so much guys. Trying it out, will keep you guys posted
Signed in members can post, follow updates, and more. New here? Register a free account.
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.
