Visually Located

XAML and GIS

Working with the MapView control in the ArcGIS Runtime

This is the third in a series of posts covering the new ArcGIS Runtime SDK. In part 2, I discussed the basic mapping layers within the ArcGIS Runtime. Now that we know how to add a map and layers to your app, let’s see what we can do with the map! As I mentioned in the first post, the new ArcGIS Runtime has a MapView, rather than a Map that you put in your app. The MapView has a Map property that must be set, but all of the functionality lies in the MapView. We’ll start out with some of the key dependency properties. We’ll then look at the map events, and finish with the few methods.

Dependncy Properties

The new MapView control has 11 dependency properties (with one additional attached dependency property). In this blog we’ll focus on seven of them. Not to worry about the other four. One we have already covered (Map), one will be covered in the next blog and two more when discussing GIS focused work. In this blog I’ll cover the following dependency properties.

MapGrid

The MapGrid is a new addition from the older .NET SDKs. I must say that this one is really cool. This allows you to display a map grid on the map. If you want to build an app with map, and not a GIS focused app, you may be wondering why this is useful. You could create your own MapGrid and have them be borders in a map. Maybe you are creating a multi-player game with a map. Each player has different zones they are responsible for.

The SDK comes with four map grids. The LatLonMapGrid shows latitude and, longitude on the map. The MgrsMapGrid displays the Military Grid Reference System. The UsngMapGrid shows the United States National Grid reference system. Finally, the UtmMapGrid shows the Universal Transverse Mercator coordinate system.

<esri:MapView>
    <esri:MapView.Map>
        <esri:Map>
            <layers:ArcGISTiledMapServiceLayer ServiceUri="http://services.arcgisonline.com/arcgis/rest/services/World_Street_Map/MapServer"/>
        </esri:Map>
    </esri:MapView.Map>
    <esri:MapView.MapGrid>
        <esri:LatLonMapGrid/>
    </esri:MapView.MapGrid>
</esri:MapView>
MaximumExtent

The MaximumExtent property allows you to control how far out the map should be allowed to zoom. This property only controls zoom, it does not allow you to restrict where the user can pan the map. This property must be set using the spatial reference that the map uses. It would be great if you could specify an extent using lat/lon but have a map with a coordinate system of Web Mercator. The following example sets the maximum extent of the map to be the lat/lon borders of Colorado.

<esri:MapView>
    <esri:MapView.Map>
        <esri:Map>
            <layers:ArcGISTiledMapServiceLayer ServiceUri="http://services.arcgisonline.com/arcgis/rest/services/ESRI_StreetMap_World_2D/MapServer"/>
        </esri:Map>
    </esri:MapView.Map>
    <esri:MapView.MaximumExtent>
        <geom:Envelope YMax="41.0014594" YMin="37.9358477" XMin="-111.09373110000001" XMax="-101.893834999999970000">
            <geom:Envelope.SpatialReference>
                <geom:SpatialReference Wkid="4326"/>
            </geom:Envelope.SpatialReference>
        </geom:Envelope>
    </esri:MapView.MaximumExtent>
</esri:MapView>
Min and MaxScale

The MinScale and the MaxScale properties control how far out or in, respectively, the map is allowed to zoom. A MaxScale of 1,000 will allow the map to be zoomed in to about a neighborhood level. A value of 10,000 no closer than a town, and 100,000 about the Denver metro area. The MinScale works the same way, but allowing the map to be zoomed out. When using the MinScale, ensure the map has an initial extent set so the user is not lost in the ocean.

From the documentation

A scale is usually referred to as 1:X, where X is the scale specified here. This value is the relative scale to the real world, where on inch on the screen is X inches in the real world. Note that this is only an approximation and is dependent on the map's projection that can add some distortion, as well as the system's reported DPI setting which doesn't necessarily match the actual DPI of the screen.

Rotation

The Rotation property allows you to… you guessed it, rotate the map. This is really useful when you want to orientate the map with the compass on the device or allow for a manual rotation of the map using an orientation control within the app.

ShowMagnifierOnTapAndHold

ShowMagnifierOnTapAndHold allows a magnifier to appear when you tap and hold the map. This property only works when using a finger to tap a touch device. I’ve been told the intent of this property is to better aid editing work flows. This property could be used for much more and make a mapping experience a lot better.

WrapAround

This is a handy property that allows to specify if the map can be continually panned east or west and have the map continue. Think of the WrapAround property as the ability a globe to spin continuously.

Events

The MapView control has four events that you’ll want to familiarize yourself with. The ExtextChanged event notifies you when the map is zoomed or panned. The MapView has three other events for touch or click manipulation. These events are MapViewDoubleTapped, MapViewHolding, and MapViewTapped.

Methods

The MapView has two utility methods and methods to zoom and center the map. Use the LocationToScreen and ScreenToLocation methods to convert between map points to screen points. These methods are handy within events. The MapView four methods for zooming and 15 methods for centering the map! Three methods are synchronous and 12 are asynchronous. To be fair, there are two methods, SetView  with two overloads and SetViewAsync with 11 overloads. Working with map APIs, you usually have one, at most two ways of centering a map. Oddly enough, the MapView does not have a MapCenter dependency property to center the map with binding.

I’ll continue the next post discussing location within an ArcGIS Runtime map app.

blog comments powered by Disqus