map_suite_ios_edition_quick_start_guide

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revision Previous revision
Next revision
Previous revision
map_suite_ios_edition_quick_start_guide [2015/09/09 08:45]
admin [Map_Suite_iOS_Edition_Quick_Start_Guide]
map_suite_ios_edition_quick_start_guide [2017/03/17 02:23] (current)
tgwikiupdate
Line 1: Line 1:
 ====== Map Suite iOS Edition Quick Start Guide ====== ====== Map Suite iOS Edition Quick Start Guide ======
 +
 +{{section>​upgrade_map_suite_to_10.0}}
  
 <div msgbox> <div msgbox>
-The Map Suite iOS Edition illustrated QuickStart Guide will guide you through the process of creating a sample application and will help you become familiar with Map Suite. This edition of the QuickStart Guide supports iOS Edition 9.0.0.0 and higher, and will show you how to create an iOS application using Map Suite iOS Edition.<​br/><​br/>​If you want to build an Android application using the standard Map Suite Android Edition product, please see the [[Map Suite Android Edition Quick Start Guide|Android QuickStart Guide]] instead.</​div>​+The Map Suite iOS Edition illustrated QuickStart Guide will guide you through the process of creating a sample application and will help you become familiar with Map Suite. This edition of the QuickStart Guide supports iOS Edition 9.0.0.0 and higher, and will show you how to create an iOS application using Map Suite iOS Edition. 
 + 
 +\\ 
 + 
 +If you want to build an Android application using the standard Map Suite Android Edition product, please see the [[Map Suite Android Edition Quick Start Guide|Android QuickStart Guide]] instead.</​div>​
  
 Welcome to Map Suite™ from ThinkGeo, a full-featured mapping control that makes it easy for any Microsoft .NET developer to add mapping functionality to a Microsoft .NET application quickly and efficiently. Using the intuitive object model, even developers inexperienced with Geographic Information Systems (GIS) can have fully functional maps working in minutes. Welcome to Map Suite™ from ThinkGeo, a full-featured mapping control that makes it easy for any Microsoft .NET developer to add mapping functionality to a Microsoft .NET application quickly and efficiently. Using the intuitive object model, even developers inexperienced with Geographic Information Systems (GIS) can have fully functional maps working in minutes.
Line 10: Line 16:
 How do we begin taking advantage of the power of Map Suite? The best way to learn is to make a sample application with it. How do we begin taking advantage of the power of Map Suite? The best way to learn is to make a sample application with it.
  
-Before we get started, make sure you've installed the [[ThinkGeo Product Center]] and that you've either started an evaluation or activated a full license of Map Suite iOS Edition. ​ By default, this will install the Map Suite iOS Edition 9.0 assemblies to <​kbd>​C:\Program Files (x86)\ThinkGeo\Map Suite 9.0\Map Suite iOS</​kbd>​.+Before we get started, make sure you've installed the [[ThinkGeo Product Center]] and that you've either started an evaluation or activated a full license of Map Suite iOS Edition. ​ By default, this will install the Map Suite iOS Edition 9.0 assemblies to __C:\Program Files (x86)\ThinkGeo\Map Suite 9.0\Map Suite iOS__.
  
 ===== Download the Sample ===== ===== Download the Sample =====
-{{Filelink}}[[:​File:HelloWorld iOS.zip|Download Sample Code From This Exercise]] //(1.5 MB)//+<faicon fa fa-download ​ fa-lg> ​{{filehistory:HelloWorld iOS.zip|Download Sample Code From This Exercise}} //(1.5 MB)//
  
 ===== Setting up the Environment ===== ===== Setting up the Environment =====
Line 20: Line 26:
 Let's start by creating a new iOS Universal project in Microsoft Visual Studio (2012 or newer) named HelloWorld (see Figure 1). We can create the project with .NET Framework 4.5 or higher. Let's start by creating a new iOS Universal project in Microsoft Visual Studio (2012 or newer) named HelloWorld (see Figure 1). We can create the project with .NET Framework 4.5 or higher.
  
-{{Figure|QSG_iOS_Img01.png|Figure 1. Creating a new project in the Visual Studio IDE.}}+{{iosedition:QSG_iOS_Img01.png}} 
 +\\ 
 +//Figure 1. Creating a new project in the Visual Studio IDE.//
  
 The project HelloWorld is created in a new solution called HelloWorld. The wizard creates a single iOS Application. The project HelloWorld is created in a new solution called HelloWorld. The wizard creates a single iOS Application.
Line 26: Line 34:
 Next we need to prepare our map data. Create an AppData folder and put the map data under it. Make sure the resources’ build action is Content (see Figure 2). Next we need to prepare our map data. Create an AppData folder and put the map data under it. Make sure the resources’ build action is Content (see Figure 2).
  
-{{Figure|QSG_iOS_PrepareData.jpg|Figure 2. Add resources and set build action to Content.}}+{{iosedition:QSG_iOS_PrepareData.jpg}} 
 +\\ 
 +//Figure 2. Add resources and set build action to Content.//
  
 ===== Build Host Settings ===== ===== Build Host Settings =====
 In Windows for Visual Studio 2012 or newer, Go to Tools > Options in Visual Studio and open the Xamarin > iOS Settings panel to access the iOS Mac Build Host settings: In Windows for Visual Studio 2012 or newer, Go to Tools > Options in Visual Studio and open the Xamarin > iOS Settings panel to access the iOS Mac Build Host settings:
  
-{{wiki:​QSG_iOS_Options.png ​Figure 3. Accessing the iOS Mac Build Host settings.}} +{{iosedition:​QSG_iOS_Options.png ​?500}} 
 +\\ 
 +// Figure 3. Accessing the iOS Mac Build Host settings.// 
 +\\ 
 +\\
 You can change the Mac Build Host by clicking the Find Mac Build Host button. The following screen is displayed to update the Mac Build Host: You can change the Mac Build Host by clicking the Find Mac Build Host button. The following screen is displayed to update the Mac Build Host:
  
-{{wiki:​QSG_iOS_Hosts.png ​Figure 4. Updating the Mac Build Host.}} +{{iosedition:​QSG_iOS_Hosts.png ​?500}} 
 +\\ 
 +//Figure 4. Updating the Mac Build Host.// 
 +\\ 
 +\\
 //Note: The version of Xamarin.iOS being used with VisualStudio must be the same as on the Mac. The simplest method to keep them in sync is to have both machines running on the same branch (e.g. both on the Stable release branch).// //Note: The version of Xamarin.iOS being used with VisualStudio must be the same as on the Mac. The simplest method to keep them in sync is to have both machines running on the same branch (e.g. both on the Stable release branch).//
  
 Enter the PIN number generated from Mac Xamarin.iOS Enter the PIN number generated from Mac Xamarin.iOS
  
-{{wiki:​QSG_iOS_EnterPinNumber.png ?500}}+{{iosedition:​QSG_iOS_EnterPinNumber.png ?500}}
  
 Active iPhoneSimulator platform in Configuration Manager: Active iPhoneSimulator platform in Configuration Manager:
  
-{{wiki:​QSG_iOS_Configuration.png ?500}}+{{iosedition:​QSG_iOS_Configuration.png ?500}}
  
 In Mac, we need to open Xamarin.Host to pair. In Mac, we need to open Xamarin.Host to pair.
  
-{{wiki:​QSG_iOS_Mac_Hosts.png ?500}}+{{iosedition:​QSG_iOS_Mac_Hosts.png ?500}}
  
 Our App can run on the Simulator we selected: Our App can run on the Simulator we selected:
  
-{{wiki:​QSG_iOS_Simulator.png ?500}}+{{iosedition:​QSG_iOS_Simulator.png ?500}}
  
 ===== Adding the Map View to our Controller ===== ===== Adding the Map View to our Controller =====
-We need to add ProtableCore.dll and iOSEdition.dll to the reference. Right-click the Reference in Solution Explorer and select "Add Reference",​ navigate to the <kbd>C:\Program Files (x86)\ThinkGeo\Map Suite 9.0\Map Suite iOS\Current Version\Managed Assemblies</kbd> ​folder and select "​MapSuitePortableCore.dll"​ and "​iOSEdition.dll"​.+We need to add ProtableCore.dll and iOSEdition.dll to the reference. Right-click the Reference in Solution Explorer and select "Add Reference",​ navigate to the //C:\Program Files (x86)\ThinkGeo\Map Suite 9.0\Map Suite iOS\Current Version\Managed Assemblies/folder and select "​MapSuitePortableCore.dll"​ and "​iOSEdition.dll"​.
  
-{{Figure|QSG_iOS_AddReference.png}}+{{iosedition:QSG_iOS_AddReference.png}}
  
 **Note: Although it is not a ThinkGeo assembly, we also need to add "​System.Windows.dll " to the references. System.Windows can be found on the .NET tab of the Add Reference dialog. If we don't do this, we'll get the following error when we compile the project: **"The type '​System.Collections.Specialized.INotifyCollectionChanged'​ is defined in an assembly that is not referenced. We must add a reference to assembly '​System.Windows,​ Version=2.0.5.0,​ Culture=neutral,​ PublicKeyToken=7cec85d7bea7798e,​ Retargetable=Yes'​."​ **Note: Although it is not a ThinkGeo assembly, we also need to add "​System.Windows.dll " to the references. System.Windows can be found on the .NET tab of the Add Reference dialog. If we don't do this, we'll get the following error when we compile the project: **"The type '​System.Collections.Specialized.INotifyCollectionChanged'​ is defined in an assembly that is not referenced. We must add a reference to assembly '​System.Windows,​ Version=2.0.5.0,​ Culture=neutral,​ PublicKeyToken=7cec85d7bea7798e,​ Retargetable=Yes'​."​
  
-{{Figure|QSG_iOS_AddSystemWindows.png|Figure 3. Add System.Windows Reference.}}+{{iosedition:QSG_iOS_AddSystemWindows.png}} 
 +\\ 
 +//Figure 3. Add System.Windows Reference.//
  
 The next step is to create Map view in HelloWorldViewController ViewDidLoad override method, and define it as "​mapView"​. The next step is to create Map view in HelloWorldViewController ViewDidLoad override method, and define it as "​mapView"​.
Line 68: Line 86:
 Every Content View Hierarchy has a corresponding View Controller to power user interaction. The role of the View Controller is to manage the Views in     the Content View Hierarchy. The View Controller is not part of the Content View Hierarchy, and it's not an element in the interface. Rather, it provides the code that powers the user's interactions with the objects on the screen. Every Content View Hierarchy has a corresponding View Controller to power user interaction. The role of the View Controller is to manage the Views in     the Content View Hierarchy. The View Controller is not part of the Content View Hierarchy, and it's not an element in the interface. Rather, it provides the code that powers the user's interactions with the objects on the screen.
  
-<source lang="csharp">+<code csharp>
 public override void ViewDidLoad() public override void ViewDidLoad()
 { {
Line 76: Line 94:
      ​View.AddSubview(mapView);​      ​View.AddSubview(mapView);​
 } }
-</source>+</code>
  
 Now we have our "​iOSEdition.dll"​ and "​MapSuitePortableCore.dll"​ referenced and a MapView added. Now we have our "​iOSEdition.dll"​ and "​MapSuitePortableCore.dll"​ referenced and a MapView added.
Line 84: Line 102:
  
 ==== Map Suite Android "Hello World" ==== ==== Map Suite Android "Hello World" ====
-The first step in creating our "Hello World" sample application is to set references to the <​code>​MapSuite.Core</​code> ​and <​code>​MapSuite.iOSEdition</​code> ​workspaces at the very top of our code, since we'll use many classes within them. Set the reference like this:+The first step in creating our "Hello World" sample application is to set references to the ''​MapSuite.Core'' ​and ''​MapSuite.iOSEdition'' ​workspaces at the very top of our code, since we'll use many classes within them. Set the reference like this:
  
-<source lang="csharp">+<code csharp>
 using ThinkGeo.MapSuite.Core;​ using ThinkGeo.MapSuite.Core;​
 using ThinkGeo.MapSuite.iOSEdition;​ using ThinkGeo.MapSuite.iOSEdition;​
-</source>+</code>
  
 ==== Display World Map ==== ==== Display World Map ====
 Now, Let's add a base overlay to display the world map witch called "​WorldMapKitOverlay"​. Now, Let's add a base overlay to display the world map witch called "​WorldMapKitOverlay"​.
  
-<source lang="csharp">+<code csharp>
         public override void ViewDidLoad()         public override void ViewDidLoad()
         {         {
Line 102: Line 120:
             View.Add(mapView);​             View.Add(mapView);​
  
-            ​<​nowiki>​//</​nowiki> ​Set the Map Unit to DecimalDegrees,​ the Shapefile’s unit of measure. ​+            // Set the Map Unit to DecimalDegrees,​ the Shapefile’s unit of measure. ​
             mapView.MapUnit = GeographyUnit.DecimalDegree;​             mapView.MapUnit = GeographyUnit.DecimalDegree;​
  
-            ​<​nowiki>​//</​nowiki> ​Create a WorldMapKitOverlay.+            // Create a WorldMapKitOverlay.
             WorldMapKitOverlay worldMapKitOverlay = new WorldMapKitOverlay();​             WorldMapKitOverlay worldMapKitOverlay = new WorldMapKitOverlay();​
  
-            ​<​nowiki>​//</​nowiki> ​Add a WorldMapKitOverlay.+            // Add a WorldMapKitOverlay.
             mapView.Overlays.Add("​WorldMapKit",​ worldMapKitOverlay);​             mapView.Overlays.Add("​WorldMapKit",​ worldMapKitOverlay);​
  
-            ​<​nowiki>​//</​nowiki> ​Set a proper extent for the map. The extent is the geographical area you want it to display.+            // Set a proper extent for the map. The extent is the geographical area you want it to display.
             mapView.CurrentExtent = new RectangleShape(5,​ 78, 30, 26);             mapView.CurrentExtent = new RectangleShape(5,​ 78, 30, 26);
             mapView.Refresh();​             mapView.Refresh();​
         }         }
-</source>+</code>
  
 If we compile and run what we have now, our map should look like the one below. (see Figure 3). If we compile and run what we have now, our map should look like the one below. (see Figure 3).
  
-{{Figure|QSG_iOS_Img10.png|Figure 3. A simple map of Europe.}}+{{iosedition:QSG_iOS_Img10.png}} 
 +\\ 
 +//Figure 3. A simple map of Europe.//
  
 ==== Shapefiles ==== ==== Shapefiles ====
Line 155: Line 175:
  
  
-PresetZoomLevels has a very useful property called ​<​code>​ZoomLevel.ApplyUntilZoomLevel</​code>​, which you can easily use to extend your ZoomLevels. Let's say you want a particular style to be visible at ZoomLevel03 through ZoomLevel10. To make that work, simply code as follows:+PresetZoomLevels has a very useful property called ​''​ZoomLevel.ApplyUntilZoomLevel''​, which you can easily use to extend your ZoomLevels. Let's say you want a particular style to be visible at ZoomLevel03 through ZoomLevel10. To make that work, simply code as follows:
  
-<source lang="csharp">+<code csharp>
 capitalLayer.ZoomLevelSet.ZoomLevel01.DefaultPointStyle = PointStyles.CreateSimpleCircleStyle(GeoColor.StandardColors.White,​ 7, GeoColor.StandardColors.Brown);​ capitalLayer.ZoomLevelSet.ZoomLevel01.DefaultPointStyle = PointStyles.CreateSimpleCircleStyle(GeoColor.StandardColors.White,​ 7, GeoColor.StandardColors.Brown);​
 capitalLayer.ZoomLevelSet.ZoomLevel01.ApplyUntilZoomLevel = ApplyUntilZoomLevel.Level05;​ capitalLayer.ZoomLevelSet.ZoomLevel01.ApplyUntilZoomLevel = ApplyUntilZoomLevel.Level05;​
-</source>+</code>
  
 ==== Map Suite iOS "Hello World" ==== ==== Map Suite iOS "Hello World" ====
-In creating our "Hello World" sample application,​ our first step is to set references to the <​code>​MapSuite.Core</​code> ​and <​code>​MapSuite.iOSEdition</​code> ​workspaces at the very top of our code, since we'll use many classes within them. Set the reference like this:+In creating our "Hello World" sample application,​ our first step is to set references to the ''​MapSuite.Core'' ​and ''​MapSuite.iOSEdition'' ​workspaces at the very top of our code, since we'll use many classes within them. Set the reference like this:
  
-<source lang="csharp">+<code csharp>
 using ThinkGeo.MapSuite.Core;​ using ThinkGeo.MapSuite.Core;​
 using ThinkGeo.MapSuite.iOSEdition;​ using ThinkGeo.MapSuite.iOSEdition;​
-</source>+</code>
  
 Now let's look at a code sample to bring this concept to fruition. We'll look at Shapefiles relating to the entire world. In our example, we have one such Shapefile: Now let's look at a code sample to bring this concept to fruition. We'll look at Shapefiles relating to the entire world. In our example, we have one such Shapefile:
Line 176: Line 196:
 (NOTE: The data used here can be found in the attached sample above in the "​\AppData"​ folder. The data files' build action should be “Content”.) (NOTE: The data used here can be found in the attached sample above in the "​\AppData"​ folder. The data files' build action should be “Content”.)
  
-Our next step is to define and add our Layers. Here is the code to use for our example. All of the following code can be placed in the <​code>​ViewDidLoad ​</​code> ​override method.+Our next step is to define and add our Layers. Here is the code to use for our example. All of the following code can be placed in the ''​ViewDidLoad ​'' ​override method.
  
-<source lang="csharp">+<code csharp>
 public override void ViewDidLoad() public override void ViewDidLoad()
 { {
Line 186: Line 206:
     View.Add(mapView);​     View.Add(mapView);​
  
-    ​<​nowiki>​//</​nowiki> ​Set the Map Unit to DecimalDegrees,​ the Shapefile’s unit of measure.+    // Set the Map Unit to DecimalDegrees,​ the Shapefile’s unit of measure.
     mapView.MapUnit = GeographyUnit.DecimalDegree;​     mapView.MapUnit = GeographyUnit.DecimalDegree;​
  
Line 192: Line 212:
     mapView.Overlays.Add("​WorldMapKit",​ worldMapKitOverlay);​     mapView.Overlays.Add("​WorldMapKit",​ worldMapKitOverlay);​
  
-    ​<​nowiki>​//</​nowiki> ​Create a new Layer and pass the path to a Shapefile into its constructor. ​+    // Create a new Layer and pass the path to a Shapefile into its constructor. ​
     ShapeFileFeatureLayer worldLayer = new ShapeFileFeatureLayer(@"​AppData/​Countries02.shp"​);​     ShapeFileFeatureLayer worldLayer = new ShapeFileFeatureLayer(@"​AppData/​Countries02.shp"​);​
  
-    ​<​nowiki>​//</​nowiki> ​Set the worldLayer with a preset Style, as AreaStyles.Country1 has YellowGreen background and black border, our worldLayer will have the same render style.  ​+    // Set the worldLayer with a preset Style, as AreaStyles.Country1 has YellowGreen background and black border, our worldLayer will have the same render style.  ​
     worldLayer.ZoomLevelSet.ZoomLevel01.DefaultAreaStyle = AreaStyles.Country1;​     worldLayer.ZoomLevelSet.ZoomLevel01.DefaultAreaStyle = AreaStyles.Country1;​
  
-    ​<​nowiki>​//</​nowiki> ​This setting will apply from ZoomLevel01 to ZoomLevel20,​ which means the map will be rendered in the same style, no matter how far we zoom in or out. +    // This setting will apply from ZoomLevel01 to ZoomLevel20,​ which means the map will be rendered in the same style, no matter how far we zoom in or out. 
     worldLayer.ZoomLevelSet.ZoomLevel01.ApplyUntilZoomLevel = ApplyUntilZoomLevel.Level20;​     worldLayer.ZoomLevelSet.ZoomLevel01.ApplyUntilZoomLevel = ApplyUntilZoomLevel.Level20;​
  
-    ​<​nowiki>​//</​nowiki> ​Create a new Layer Overlay to hold the layer we just created+    // Create a new Layer Overlay to hold the layer we just created
     LayerOverlay layerOverlay = new LayerOverlay();​     LayerOverlay layerOverlay = new LayerOverlay();​
  
-    ​<​nowiki>​//</​nowiki> ​Add the shapefile layer to the layer overlay+    // Add the shapefile layer to the layer overlay
     layerOverlay.Layers.Add(worldLayer);​     layerOverlay.Layers.Add(worldLayer);​
  
-    ​<​nowiki>​//</​nowiki> ​Add the layerOverlay to map.+    // Add the layerOverlay to map.
     mapView.Overlays.Add(layerOverlay);​     mapView.Overlays.Add(layerOverlay);​
  
-    ​<​nowiki>​//</​nowiki> ​Set a proper extent for the map. The extent is the geographical area you want it to display.+    // Set a proper extent for the map. The extent is the geographical area you want it to display.
     mapView.CurrentExtent = new RectangleShape(5,​ 78, 30, 26);     mapView.CurrentExtent = new RectangleShape(5,​ 78, 30, 26);
  
-    ​<​nowiki>​//</​nowiki> ​We now need to call the Refresh() method of the Map view so that the Map can redraw based on the data that has been provided.+    // We now need to call the Refresh() method of the Map view so that the Map can redraw based on the data that has been provided.
     mapView.Refresh();​     mapView.Refresh();​
  
-</source>+</code>
  
 If you compile and run what you have now, your map should look like the one below. (see Figure 4). If you compile and run what you have now, your map should look like the one below. (see Figure 4).
  
-{{Figure|QSG_iOS_Img08.png|Figure 4. A Simple map of Europe.}}+{{iosedition:QSG_iOS_Img08.png}} 
 +\\ 
 +//Figure 4. A Simple map of Europe.//
  
 So what has occurred here? We've created a layer and added it to the Map, and the Map has rendered it according to its default style parameters. We've also used ZoomLevel to display the map the way we want. So what has occurred here? We've created a layer and added it to the Map, and the Map has rendered it according to its default style parameters. We've also used ZoomLevel to display the map the way we want.
  
-**NOTE:** It is important that the MapUnit property of a Map object be set using the <​code>​GeographyUnit</​code> ​Enumeration. This is because the coordinates stored in a Shapefile can be in decimal degrees (a format of latitude and longitude), feet, meters, or another unit system, and our map has no way to know what the Shapefile'​s unit of measurement is until we tell it. This information is normally found somewhere in the Shapefile'​s documentation (also referred to as its metadata), or within its supplemental data file, as discussed in the section on Shapefiles. It may also come as a separate .txt, .xml, or .html file that begins with the same file name as the main Shapefile.+**NOTE:** It is important that the MapUnit property of a Map object be set using the ''​GeographyUnit'' ​Enumeration. This is because the coordinates stored in a Shapefile can be in decimal degrees (a format of latitude and longitude), feet, meters, or another unit system, and our map has no way to know what the Shapefile'​s unit of measurement is until we tell it. This information is normally found somewhere in the Shapefile'​s documentation (also referred to as its metadata), or within its supplemental data file, as discussed in the section on Shapefiles. It may also come as a separate .txt, .xml, or .html file that begins with the same file name as the main Shapefile.
  
 ==== Navigate the Map ==== ==== Navigate the Map ====
Line 231: Line 253:
 That was an easy start! Now let's add a second Shapefile to the sample, so we'll have a total of two layers: That was an easy start! Now let's add a second Shapefile to the sample, so we'll have a total of two layers:
  
-#World country borders ("​Countries02.shp"​) +  - World country borders ("​Countries02.shp"​) 
-#World capitals ("​WorldCapitals.shp"​)+  ​- ​World capitals ("​WorldCapitals.shp"​)
  
-<source lang="csharp">+<code csharp>
 public override void ViewDidLoad() public override void ViewDidLoad()
 { {
Line 252: Line 274:
  
     ShapeFileFeatureLayer capitalLayer = new ShapeFileFeatureLayer(@"​AppData/​WorldCapitals.shp"​);​     ShapeFileFeatureLayer capitalLayer = new ShapeFileFeatureLayer(@"​AppData/​WorldCapitals.shp"​);​
-    ​<​nowiki>​//</​nowiki> ​Similarly, we use the presetPointStyle for cities. ​    +    // Similarly, we use the presetPointStyle for cities. ​    
     capitalLayer.ZoomLevelSet.ZoomLevel01.DefaultPointStyle = PointStyles.Capital3;​     capitalLayer.ZoomLevelSet.ZoomLevel01.DefaultPointStyle = PointStyles.Capital3;​
-    ​<​nowiki>​//</​nowiki> ​This setting also applies from ZoomLevel01 to ZoomLevel20,​ so city symbols will be rendered in the same style, no matter how far we zoom in or out. +    // This setting also applies from ZoomLevel01 to ZoomLevel20,​ so city symbols will be rendered in the same style, no matter how far we zoom in or out. 
     capitalLayer.ZoomLevelSet.ZoomLevel01.ApplyUntilZoomLevel = ApplyUntilZoomLevel.Level20;​     capitalLayer.ZoomLevelSet.ZoomLevel01.ApplyUntilZoomLevel = ApplyUntilZoomLevel.Level20;​
  
     LayerOverlay layerOverlay = new LayerOverlay();​     LayerOverlay layerOverlay = new LayerOverlay();​
     layerOverlay.Layers.Add(worldLayer);​     layerOverlay.Layers.Add(worldLayer);​
-    ​<​nowiki>​//</​nowiki> ​We need to add both of the new layers to the Layer OverLay. ​+    // We need to add both of the new layers to the Layer OverLay. ​
     layerOverlay.Layers.Add(capitalLayer);​     layerOverlay.Layers.Add(capitalLayer);​
  
Line 266: Line 288:
     mapView.Refresh();​     mapView.Refresh();​
 } }
-</source>+</code>
  
 And the result is as following (Figure 5): And the result is as following (Figure 5):
  
-{{Figure|QSG_iOS_Img09.png|Figure 5. A map of Europe with the additional borders and capitals layers displayed.}}+{{iosedition:QSG_iOS_Img09.png}} 
 +\\ 
 +//Figure 5. A map of Europe with the additional borders and capitals layers displayed.//
  
 ===== How to Use TextStyle ===== ===== How to Use TextStyle =====
 TextStyle is used to label items on map. While the features themselves are drawn from information in the Shapefile, they'​re labeled with feature names or other attributes contained in the .dbf file. For example, the Shapefile containing capitals of the world has a corresponding .dbf file with the field "​CITY_NAME"​. We can use this field to label the cities on our map. TextStyle is used to label items on map. While the features themselves are drawn from information in the Shapefile, they'​re labeled with feature names or other attributes contained in the .dbf file. For example, the Shapefile containing capitals of the world has a corresponding .dbf file with the field "​CITY_NAME"​. We can use this field to label the cities on our map.
  
-{{Figure|QSG_WPFDesktop_Img10.png}}+{{iosedition:QSG_WPFDesktop_Img10.png}}
  
 Map Suite includes several built-in TextStyles to help us quickly apply attractive city labels. We can simply pick the TextStyle we like and use it. Map Suite includes several built-in TextStyles to help us quickly apply attractive city labels. We can simply pick the TextStyle we like and use it.
  
  
-<source lang="csharp">+<code csharp>
 public override void ViewDidLoad() public override void ViewDidLoad()
 { {
Line 298: Line 322:
  
     ShapeFileFeatureLayer capitalLayer = new ShapeFileFeatureLayer(@"​AppData/​WorldCapitals.shp"​);​     ShapeFileFeatureLayer capitalLayer = new ShapeFileFeatureLayer(@"​AppData/​WorldCapitals.shp"​);​
-    ​<​nowiki>​//</​nowiki> ​Similarly, we use the presetPointStyle for cities. ​+    // Similarly, we use the presetPointStyle for cities. ​
     capitalLayer.ZoomLevelSet.ZoomLevel01.DefaultPointStyle = PointStyles.Capital3;​     capitalLayer.ZoomLevelSet.ZoomLevel01.DefaultPointStyle = PointStyles.Capital3;​
-    ​<​nowiki>​//</​nowiki> ​This setting also applies from ZoomLevel01 to ZoomLevel20,​ which means city symbols will be rendered in the same style no matter how far we     +    // This setting also applies from ZoomLevel01 to ZoomLevel20,​ which means city symbols will be rendered in the same style no matter how far we     
-    ​<​nowiki>/​/</nowiki>zoom in or out.+    //zoom in or out.
     capitalLayer.ZoomLevelSet.ZoomLevel01.ApplyUntilZoomLevel = ApplyUntilZoomLevel.Level20;​     capitalLayer.ZoomLevelSet.ZoomLevel01.ApplyUntilZoomLevel = ApplyUntilZoomLevel.Level20;​
  
-    ​<​nowiki>​//</​nowiki> ​We create a new Layer for labeling the capitals.+    // We create a new Layer for labeling the capitals.
     ShapeFileFeatureLayer capitalLabelLayer = new ShapeFileFeatureLayer(@"​AppData/​WorldCapitals.shp"​);​     ShapeFileFeatureLayer capitalLabelLayer = new ShapeFileFeatureLayer(@"​AppData/​WorldCapitals.shp"​);​
-    ​<​nowiki>​//</​nowiki> ​We use the preset TextStyle. Here we pass in "​CITY_NAME",​ the name of the field containing the values we want to label the map with.+    // We use the preset TextStyle. Here we pass in "​CITY_NAME",​ the name of the field containing the values we want to label the map with.
     capitalLabelLayer.ZoomLevelSet.ZoomLevel01.DefaultTextStyle = TextStyles.Capital3("​CITY_NAME"​);​     capitalLabelLayer.ZoomLevelSet.ZoomLevel01.DefaultTextStyle = TextStyles.Capital3("​CITY_NAME"​);​
     capitalLabelLayer.ZoomLevelSet.ZoomLevel01.ApplyUntilZoomLevel = ApplyUntilZoomLevel.Level20;​     capitalLabelLayer.ZoomLevelSet.ZoomLevel01.ApplyUntilZoomLevel = ApplyUntilZoomLevel.Level20;​
-    ​<​nowiki>​//</​nowiki> ​Since the map is drawn with tiles, the label needs to draw on the margin to make sure the text is complete after joining the tiles together. +    // Since the map is drawn with tiles, the label needs to draw on the margin to make sure the text is complete after joining the tiles together. 
-    ​<​nowiki>/​/</nowiki> ​Change the number below (to 0, for example) to better understand how this works.+    // Change the number below (to 0, for example) to better understand how this works.
     capitalLabelLayer.DrawingMarginPercentage = 50;     capitalLabelLayer.DrawingMarginPercentage = 50;
  
Line 322: Line 346:
     mapView.Refresh();​     mapView.Refresh();​
 } }
-</source>+</code>
  
 The result should look like this (Figure 6): The result should look like this (Figure 6):
  
-{{Figure|QSG_iOS_Img11.png|Figure 6. Europe map with TextStyle applied.}}+{{iosedition:QSG_iOS_Img11.png}} 
 +\\ 
 +//Figure 6. Europe map with TextStyle applied.//
  
 Now that we know how to render text and symbols, let's create custom Styles and TextStyles. We'll also specify different ranges of ZoomLevels, and apply varying custom Styles and TextStyles to the same layer at different ZoomLevel ranges. Now that we know how to render text and symbols, let's create custom Styles and TextStyles. We'll also specify different ranges of ZoomLevels, and apply varying custom Styles and TextStyles to the same layer at different ZoomLevel ranges.
  
-<source lang="csharp">+<code csharp>
 public override void ViewDidLoad() public override void ViewDidLoad()
 { {
Line 348: Line 374:
  
     ShapeFileFeatureLayer capitalLayer = new ShapeFileFeatureLayer(@"​AppData/​WorldCapitals.shp"​);​     ShapeFileFeatureLayer capitalLayer = new ShapeFileFeatureLayer(@"​AppData/​WorldCapitals.shp"​);​
-    ​<​nowiki>​//</​nowiki> ​We can customize our own Style. Here we pass in a color and a size.+    // We can customize our own Style. Here we pass in a color and a size.
     capitalLayer.ZoomLevelSet.ZoomLevel01.DefaultPointStyle = PointStyles.CreateSimpleCircleStyle(GeoColor.StandardColors.White,​ 7, GeoColor.StandardColors.Brown);​     capitalLayer.ZoomLevelSet.ZoomLevel01.DefaultPointStyle = PointStyles.CreateSimpleCircleStyle(GeoColor.StandardColors.White,​ 7, GeoColor.StandardColors.Brown);​
-    ​<​nowiki>​//</​nowiki> ​The Style we set here is available from ZoomLevel01 to ZoomLevel05. That means if we zoom in a bit more, it will no longer be visible.+    // The Style we set here is available from ZoomLevel01 to ZoomLevel05. That means if we zoom in a bit more, it will no longer be visible.
     capitalLayer.ZoomLevelSet.ZoomLevel01.ApplyUntilZoomLevel = ApplyUntilZoomLevel.Level05;​     capitalLayer.ZoomLevelSet.ZoomLevel01.ApplyUntilZoomLevel = ApplyUntilZoomLevel.Level05;​
  
     capitalLayer.ZoomLevelSet.ZoomLevel06.DefaultPointStyle = PointStyles.Capital3;​     capitalLayer.ZoomLevelSet.ZoomLevel06.DefaultPointStyle = PointStyles.Capital3;​
-    ​<​nowiki>​//</​nowiki> ​The Style we set here is available from ZoomLevel06 to ZoomLevel20. That means if we zoom out a bit more, it will no longer be visible.+    // The Style we set here is available from ZoomLevel06 to ZoomLevel20. That means if we zoom out a bit more, it will no longer be visible.
     capitalLayer.ZoomLevelSet.ZoomLevel06.ApplyUntilZoomLevel = ApplyUntilZoomLevel.Level20;​     capitalLayer.ZoomLevelSet.ZoomLevel06.ApplyUntilZoomLevel = ApplyUntilZoomLevel.Level20;​
  
     ShapeFileFeatureLayer capitalLabelLayer = new ShapeFileFeatureLayer(@"​AppData/​WorldCapitals.shp"​);​     ShapeFileFeatureLayer capitalLabelLayer = new ShapeFileFeatureLayer(@"​AppData/​WorldCapitals.shp"​);​
-    ​<​nowiki>​//</​nowiki> ​We can customize our own TextStyle. Here we pass in the font, size, style and color.+    // We can customize our own TextStyle. Here we pass in the font, size, style and color.
     capitalLabelLayer.ZoomLevelSet.ZoomLevel01.DefaultTextStyle = TextStyles.CreateSimpleTextStyle("​CITY_NAME",​ "​Arial",​ 8, DrawingFontStyles.Italic,​ GeoColor.StandardColors.Black,​ 3, 3);     capitalLabelLayer.ZoomLevelSet.ZoomLevel01.DefaultTextStyle = TextStyles.CreateSimpleTextStyle("​CITY_NAME",​ "​Arial",​ 8, DrawingFontStyles.Italic,​ GeoColor.StandardColors.Black,​ 3, 3);
-    ​<​nowiki>​//</​nowiki> ​The TextStyle we set here is available from ZoomLevel01 to ZoomLevel05. ​+    // The TextStyle we set here is available from ZoomLevel01 to ZoomLevel05. ​
     capitalLabelLayer.ZoomLevelSet.ZoomLevel01.ApplyUntilZoomLevel = ApplyUntilZoomLevel.Level05;​     capitalLabelLayer.ZoomLevelSet.ZoomLevel01.ApplyUntilZoomLevel = ApplyUntilZoomLevel.Level05;​
  
     capitalLabelLayer.ZoomLevelSet.ZoomLevel06.DefaultTextStyle = TextStyles.Capital3("​CITY_NAME"​);​     capitalLabelLayer.ZoomLevelSet.ZoomLevel06.DefaultTextStyle = TextStyles.Capital3("​CITY_NAME"​);​
-    ​<​nowiki>​//</​nowiki> ​The TextStyle we set here is available from ZoomLevel06 to ZoomLevel20. ​+    // The TextStyle we set here is available from ZoomLevel06 to ZoomLevel20. ​
     capitalLabelLayer.ZoomLevelSet.ZoomLevel06.ApplyUntilZoomLevel = ApplyUntilZoomLevel.Level20;​     capitalLabelLayer.ZoomLevelSet.ZoomLevel06.ApplyUntilZoomLevel = ApplyUntilZoomLevel.Level20;​
     capitalLabelLayer.DrawingMarginPercentage = 50;     capitalLabelLayer.DrawingMarginPercentage = 50;
Line 377: Line 403:
     mapView.Refresh();​     mapView.Refresh();​
 } }
-</source>+</code>
  
 Can you imagine what the map will look like now? Below is the result. At first it looks like Figure 7, then like Figure 8 as you zoom in further. Can you imagine what the map will look like now? Below is the result. At first it looks like Figure 7, then like Figure 8 as you zoom in further.
  
-{{Figure|QSG_iOS_Img12.png|Figure 7. Map of Europe before zooming in.}}+{{iosedition:QSG_iOS_Img12.png}} 
 +\\ 
 +//Figure 7. Map of Europe before zooming in.//
  
-{{Figure|QSG_iOS_Img13.png|Figure 8. Map of Europe after zooming in.}}+{{iosedition:QSG_iOS_Img13.png}} 
 +\\ 
 +//Figure 8. Map of Europe after zooming in.//
  
 ===== Summary ===== ===== Summary =====
 You now know the basics of using the Map Suite Map control and can start adding this functionality to your own applications. Let's recap what we've learned about the object relationships and how the pieces of Map Suite work together: You now know the basics of using the Map Suite Map control and can start adding this functionality to your own applications. Let's recap what we've learned about the object relationships and how the pieces of Map Suite 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 requirements of your data. +  - It is of the utmost importance that the units (feet, meters, decimal degrees, etc.) be set properly for the Map control, based on the requirements of your data. 
-#Shapefiles provide the data used by a Map control to render a map. +  ​- ​Shapefiles provide the data used by a Map control to render a map. 
-#A Map is the basic control that contains all the other objects used to indicate how the map should be rendered. +  ​- ​A Map is the basic control that contains all the other objects used to indicate how the map should be rendered. 
-#A Map has one-to-many Layers. A Layer correlates one-to-one with a Shapefile (.shp). +  ​- ​A Map has one-to-many Layers. A Layer correlates one-to-one with a Shapefile (.shp). 
-#A Layer can have one-to-many ZoomLevels. ZoomLevels help to define ranges (upper and lower scales) of when a Layer should be shown or hidden. +  ​- ​A Layer can have one-to-many ZoomLevels. ZoomLevels help to define ranges (upper and lower scales) of when a Layer should be shown or hidden.
- +
-<br>+
  
-{{Filelink}}[[:​File:​HelloWorld iOS.zip|Download Sample Code From This Exercise]] //(1.5 MB)// 
  
-[[Category:Map Suite iOS Edition]] [[Category:​iOS]] [[Category:​GIS]] [[Category:.NET]]+<faicon fa fa-download ​ fa-lg> ​ {{filehistory:HelloWorld ​iOS.zip|Download Sample Code From This Exercise}} //(1.5 MB)//
  
map_suite_ios_edition_quick_start_guide.1441788341.txt.gz · Last modified: 2015/09/09 08:45 by admin