nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

Restrict View Port Bounds in Flex Viewer 2.x

BrendanCunningham

Hi,
Is there a quick way to restrict the Max & Min bounding coordinates for a map application?
I have a very localized Flex Viewer application and I don't want end users zooming out or away from the project area. Ideally if they try to pan past a certain bounding coordinate range then they will not be allowed to do so.
Thanks all,
Brendan

Find more posts tagged with

Accepted answers

All comments

DerekHunter1

Thanks Robert. Is that all I would need to make it work in 3.6?

RobertScheitlin__GISP

Derek,

Here is the updated ConstrainedMap.as

package com.esri.viewer
{
    import com.esri.ags.Map;
    import com.esri.ags.esri_internal;
    import com.esri.ags.events.ExtentEvent;
    import com.esri.ags.events.MapEvent;
    import com.esri.ags.geometry.Extent;
    import com.esri.ags.utils.ProjUtils;
   
    import flash.system.Capabilities;
   
    use namespace esri_internal;
   
    public class ConstrainedMap extends Map
    {
        private var m_cExtent:Extent = new Extent(Number.NEGATIVE_INFINITY, Number.NEGATIVE_INFINITY,
            Number.POSITIVE_INFINITY, Number.POSITIVE_INFINITY);
        private var m_initialScale:Number = Number.POSITIVE_INFINITY;
        private var m_initialExtent:Extent = new Extent(
            Number.NEGATIVE_INFINITY, Number.NEGATIVE_INFINITY,
            Number.POSITIVE_INFINITY, Number.POSITIVE_INFINITY);
       
        private var lastDy:Number = 0;
           
        public function set constrainedExtent(value:Extent):void
        {
            m_cExtent = value;
        }
       
        public function get constrainedExtent():Extent
        {
            return m_cExtent;
        }
       
        public function ConstrainedMap()
        {
            this.openHandCursorVisible = true;
            this.extent = m_cExtent.esri_internal::duplicate();
            this.addEventListener(MapEvent.LOAD, loadHandler );
        }
       
        override public function set extent(value:Extent):void
        {
            const newScale:Number = ProjUtils.convertExtentToScale(value, width, Capabilities.screenDPI);
            // trace( newScale.toFixed(0), m_initialScale.toFixed(0));
            // Make sure we do not go over the initial extent.
            if( newScale > m_initialScale )
            {
                super.extent = m_initialExtent.esri_internal::duplicate();;
            }
            else
            {
                super.extent = value;
            }
        }
       
        private function loadHandler(event:MapEvent):void
        {
            this.removeEventListener(MapEvent.LOAD, loadHandler);
            // Note the low priority listener.   
            this.addEventListener(ExtentEvent.EXTENT_CHANGE, extentChangeHandlerOnce, false, -99);
            this.addEventListener(ExtentEvent.EXTENT_CHANGE, extentChangeHandler);
        }
       
        /**
        * Handler used _once_ to get the initial map scale and extent.
        */
        private function extentChangeHandlerOnce(event:ExtentEvent):void
        {
            this.removeEventListener(ExtentEvent.EXTENT_CHANGE, extentChangeHandlerOnce);
            m_initialScale = ProjUtils.convertExtentToScale(m_cExtent, width, Capabilities.screenDPI);
            m_initialExtent = m_cExtent;
        }
   
        private function extentChangeHandler(event:ExtentEvent):void
        {
            if(extent.contains(m_initialExtent))
            {
                return;
            }
            var dx:Number, dy:Number;
            if(m_initialExtent.xmax < extent.xmax)
            {
                dx = extent.xmax - m_initialExtent.xmax;                       
            }
            else if(m_initialExtent.xmin > extent.xmin)
            {
                dx = extent.xmin - m_initialExtent.xmin;
            }
            else
            {
                dx = 0.0;
            }
            if(m_initialExtent.ymax < extent.ymax)
            {
                dy = extent.ymax - m_initialExtent.ymax;
            }
            else if(m_initialExtent.ymin > extent.ymin)
            {
                dy = extent.ymin - m_initialExtent.ymin;
            }
            else
            {
                dy = 0;
            }
            //trace( dx.toFixed(0), dy.toFixed(0));
           
            if(dx.toFixed(0) !== "0." || dy.toFixed(0) !== "0.")
            {
                // Make sure the extent is set on the next display cycle.
                callLater(callLaterHandler, [dx,dy]);
            }
        }
       
        private function callLaterHandler(dx:Number, dy:Number):void
        {
            if(Math.abs(dy).toFixed(0) == Math.abs(lastDy).toFixed(0)){
                //trace("exiting extent change");
                return;
            }
            extent = new Extent(extent.xmin - dx, extent.ymin - dy, extent.xmax - dx, extent.ymax - dy);
            lastDy = dy;
        }       
    }
}

This has code to avoid the earthquake effect.

DerekHunter1

Has anyone compiled this successfully for 3.6?

RobertScheitlin__GISP

Nancy,

If you don't have flash builder or some other Flex IDE then you need to forget about this altoghther. Constraining the map is for developer.

NancyGnanicys

Paul,

As I explained to some one else a minute ago there is no compiling of just a certain portion of the Viewer. You make the changes in the source code and then compile the whole Flex Viewer project each time.

In the Flex Viewer Builder there is no compiling correct? I changed the lines and copied and pasted the mapmanager.mxml and the constraint.as into my folder containing the application and ran it, but how does the config.xml know to even use them or does it just know? I may be getting confused as to Flex Viewer VS Flash Builder, I do not have FLash builder though. Would the source code for my project be in the config.xml then?

MatthewGoulet1

Has anyone gotten the zoom in/out functionality to work with Mansour's/Robert's constraint code? Panning seems fine (I'm using Viewer 3.2), but whenever I zoom in or out, the map goes to it's full extent and "shakes" up and down.

Is the only solution to prevent zooming?

Thanks.

RobertScheitlin__GISP

Paul,

As I explained to some one else a minute ago there is no compiling of just a certain portion of the Viewer. You make the changes in the source code and then compile the whole Flex Viewer project each time.

AyieKepong

i just fix the problem.

I don't know it is possible when i just change into "Units.esri_internal::UNITS_UNKNOWN_UNITS" because the map also able to fix.

Thanks.

AyieKepong

Robert,

I got a problem to set unit in ConstrainedMap.as .

From ReadMe.txt in folder ConstrainedMap_for_FlexViewer2.2, you ask to change the units in ConstrainedMap.as based on unit based map that we used.

So, i don't know how to change "Units.esri_internal::UNITS_METERS" because i'm already try change but not successful yet. Map stilll not fixed when i'm setting map Extent area.
Now, i'm using own based map using projection Kertau_RSO_Malaya_Meters.
How can i change to my based map projection?

Thanks

AyieKepong

Ok Robert,

Thanks for the ideas. I just want to know if there have any ideas to solve this matter.
Anyway I think I must go through using added SQL statement as I'm was thinking yesterday and the same idea with you.

Thanks Robert for your reply.

RobertScheitlin__GISP

Wan,

Why not add to the users query an additional SQL portion that states " AND STATE = 'x'" that way there are no results returned.

AyieKepong

Robert,

Sorry, I've a question about this map constraints.

I already set map constrain extend. For example, map will be constrained to the State A. When I make a query and the data list also come from others state for example State B.

So, when I click that result row, map will stop because the data is out of map constrain extend and looks like 'hang'. Do you have any suggestion for me to solve this problem? or I can popup some message to tell users that the data is out of map area constraint.

Thanks

AyieKepong

Ok Robert.

It works now.

Thanks a lot Robert.

RobertScheitlin__GISP

Wan,

I just tested in Flex Viewer 2.3.1 and it works as expected. If you have not changed the extent in the MapManagerSkin.mxml as the instructions say that you optionally can then the map will be constrained to the extend of the United States.

AyieKepong

Robert,

This code is function or not in FlexViewer 2.3.1? because i already running this code but not successful yet. or must added some configuration to apply at Flexviewer 2.3.1?

Thanks

RobertScheitlin__GISP

Brendan,

Here is the FlexViewer 2.x Version of the constrained map code that is adapted from Mansour's blog that Dasa mentioned.

ConstrainedMap_for_FlexViewer2.2.zip

DasaPaddock

You may find this blog post helpful:
http://thunderheadxpler.blogspot.com/2009/01/constraining-map-extent.html

JonFisher

Hi,
Is there a quick way to restrict the Max & Min bounding coordinates for a map application?
I have a very localized Flex Viewer application and I don't want end users zooming out or away from the project area. Ideally if they try to pan past a certain bounding coordinate range then they will not be allowed to do so.
Thanks all,
Brendan

I've wondered the same thing, and while I haven't found a way to prevent panning, you can:

control the map LODs using the LOD tag: http://help.arcgis.com/en/webapps/flexviewer/help/mainconfig.htm
set both initialextent and fullextent to your study area
potentially you could use the splash screen to let users know there's nothing to see outside of the study area, and to use the full extent button to return if they get lost

Ultimately I've found that it's not as big a deal as I was worried about, as most users who pan away from the map area quickly see that it's not very rewarding 😉

Join the Conversation

Signed in members can post, follow updates, and more. New here? Register a free account.

Quick Links

Community Help
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.