Select to view content in your preferred language

Whitespace appears when we drag the map and reach the top of the map

840
6
07-13-2023 11:10 PM
KarthikeyanShanmugam
New Contributor III

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

Screenshot 2023-07-14 at 11.35.21 AM.png

0 Kudos
6 Replies
Sage_Wall
Esri Contributor

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
          }
        });
      });
Sage_Wall
Esri Contributor

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

Stacy-Rendall
New Contributor III

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

StacyRendall_0-1689621294235.png

 

JohnGrayson
Esri Regular Contributor

Try the MapView.constraints.geometry property.

Sage_Wall
Esri Contributor

Doh... I totally missed that in the doc.  I think I was looking for "extent".  Thanks @JohnGrayson 

KarthikeyanShanmugam
New Contributor III

Thanks so much guys. Trying it out, will keep you guys posted

0 Kudos