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
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-bo.... 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