====== ThinkGeo UI Desktop for WPF Quickstart Guide ======
{{thinkgeo12:screenshots:quickstartguide:quickstart_initialize_mapview.png}}
\\
//Figure 5. Add Map Control to your application.//
If you have not set up a developer license, the ThinkGeo UI Product Center will pop up when you debug the app. You need to generate your developer license. For more details, please refer to http://wiki.thinkgeo.com/wiki/map_suite_developer_license_guide.
\\
Once the developer license is ready, run the application. Your map should look like the one below: (see Figure 6).
{{thinkgeo12:screenshots:quickstartguide:quickstart_initialized_mapview.png}}
//Figure 6. The normal map is rendered after the developer license file has been got.//
==== ThinkGeo UI Desktop for WPF "Quickstart" ====
In creating our “Quickstart" application, our first step is to set references to the ThinkGeo.Core and ThinkGeo.UI.Wpf workspaces at the very top of our code, as we will use many classes within them. We do this so that we do not have to use the fully qualified name of the classes throughout our code. Setting a reference to the ThinkGeo workspace can be done in the “code-behind” of the form by selecting the form and hitting the F6 function key. Set the reference like this:
using ThinkGeo.Core;
using ThinkGeo.UI.Wpf;
Now let's look at a code sample to bring this concept to fruition. We'll look at how to show a base map.
Add "Loaded" handle for Map View:
Our next step is to define and add our base map overlay. All of the following code can be placed in the ''MapViewLoaded'' event of the form. Here is the code to use for our example(see Figure 7).
using System.Windows;
using ThinkGeo.Core;
using ThinkGeo.UI.Wpf;
namespace Quickstart
{
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
}
private void MapViewLoaded(object sender, RoutedEventArgs e)
{
// Set the Map Unit.
mapView.MapUnit = GeographyUnit.Meter;
// Add a background layer
var backgroundOverlay = new LayerOverlay();
backgroundOverlay.Layers.Add(new BackgroundLayer(new GeoSolidBrush(GeoColor.FromHtml("#F0EEE8"))));
// Add a base map overlay.
var cloudRasterBaseMapOverlay = new ThinkGeoCloudRasterMapsOverlay("USlbIyO5uIMja2y0qoM21RRM6NBXUad4hjK3NBD6pD0~", "f6OJsvCDDzmccnevX55nL7nXpPDXXKANe5cN6czVjCH0s8jhpCH-2A~~", ThinkGeoCloudRasterMapsMapType.Light);
mapView.Overlays.Add(cloudRasterBaseMapOverlay);
mapView.CurrentExtent = new RectangleShape(-20000000, 20000000, 20000000, -20000000);
}
}
}
{{thinkgeo12:screenshots:quickstartguide:quickstart_add_base_map_overlay.png}}
//Figure 7. Add base map overlay to map view.//
You can get a normal map render (See Figure 8)
{{thinkgeo12:screenshots:quickstartguide:quickstart_base_map_screenshot.png}}
\\
//Figure 8 Quickstart Run Result.//
**NOTE:** It is important that the "MapUnit" property of a Map object be set using the "GeographyUnit" enumeration, which can be in DecimalDegree, feet, meters, etc., and our map has no idea about what the unit of measurement is until we set it. This information is normally found somewhere in the documentation or within the supplemental data file as discussed in the section on ShapeFiles.
==== Navigate the Map ====
With the above code, you can both display a map and navigate it. You can pan by dragging the map, zoom in by double-clicking, track zoom in by drawing a rectangle with your left mouse button mouse while holding the shift key, or zoom in and out by using the mouse wheel. Very powerful for just couple lines of code, isn't it?
That was an easy start! Now, let's add a Shapefile to the sample. The capitals of the world countries ("WorldCapitals.shp").
Our next step is to define and add Shapefile layer. All of the following code can be placed in the ''MapViewLoaded'' event of the form. Here is the code to use for our example(see Figure 9).
private void MapViewLoaded(object sender, RoutedEventArgs e)
{
// Set the Map Unit.
mapView.MapUnit = GeographyUnit.Meter;
// Add a background layer
var backgroundOverlay = new LayerOverlay();
backgroundOverlay.Layers.Add(new BackgroundLayer(new GeoSolidBrush(GeoColor.FromHtml("#F0EEE8"))));
// Add a base map overlay.
var cloudRasterBaseMapOverlay = new ThinkGeoCloudRasterMapsOverlay("USlbIyO5uIMja2y0qoM21RRM6NBXUad4hjK3NBD6pD0~", "f6OJsvCDDzmccnevX55nL7nXpPDXXKANe5cN6czVjCH0s8jhpCH-2A~~", ThinkGeoCloudRasterMapsMapType.Light);
mapView.Overlays.Add(cloudRasterBaseMapOverlay);
// Add a shapefile layer with point style.
var customDataOverlay = new LayerOverlay();
var capitalLayer = new ShapeFileFeatureLayer(@"AppData/WorldCapitals.shp");
capitalLayer.FeatureSource.ProjectionConverter = new ProjectionConverter(4326, 3857);
var capitalStyle = new PointStyle()
{
SymbolType = PointSymbolType.Circle,
SymbolSize = 8,
FillBrush = new GeoSolidBrush(GeoColors.White),
OutlinePen = new GeoPen(GeoColors.Black, 2)
};
capitalLayer.ZoomLevelSet.ZoomLevel01.DefaultPointStyle = capitalStyle;
capitalLayer.ZoomLevelSet.ZoomLevel01.ApplyUntilZoomLevel = ApplyUntilZoomLevel.Level20;
customDataOverlay.Layers.Add(capitalLayer);
mapView.Overlays.Add(customDataOverlay);
capitalLayer.Open();
// Set the extent of capitalLayer for the Map.
mapView.CurrentExtent = capitalLayer.GetBoundingBox();
}
{{thinkgeo12:screenshots:quickstartguide:quickstart_addlayer_shapefile_piontstyle.png}}
//Figure 9. Define and add Shapefile layer.//
And the result is as follows (Figure 10):
{{thinkgeo12:screenshots:quickstartguide:quickstart_shapefile_piontstyle_screenshot.png}}
\\
//Figure 10. Shapefile layer rendering result.//
So what has occurred here? We have created a layer and added it to the Map and the Map has rendered according to its default style parameters. Also, we have used ZoomLevel to display the map the way that we want.
This completes this scenario. The next thing you might want to do is to make it run on another machine that does not have a developer license. A runtime license is the one we are looking for. Here is a guide to generate a runtime license to satisfy it, please refer to (http://wiki.thinkgeo.com/wiki/map_suite_runtime_license_guide_for_desktop ) for details.
===== Summary =====
You now know the basics of using the ThinkGeo Map controls and are able to get started adding functionality into your own applications. Let's recap what we have learned about the object relationships and how the pieces of ThinkGeo UI work together:
-It is of the utmost importance that the units (feet, meters, decimal degrees, etc.) be set properly for the Map control based on the data.
-Shapefiles provide the data used by a Map control to render a map.
-A Map is the basic control that contains all of the other objects that are used to tell how the map is to be rendered.
-A Map has many layers. A Layer correlates one-to-one with a shape file (.shp).
-A Layer can have several ZoomLevels. ZoomLevels help to define ranges (upper and lower) of when a Layer should be shown or hidden.