2.3 Add GDS Google Map to Visual Studio Toolbox and create a simple map project

Transcription

1 1. Introduction GDS Google Map is a Desktop.Net User Control, which can be embedded in Windows Forms Applications or hosted in WPF Applications. It integrates an interactive Google Map into your desktop application thus providing a fast and convenient way for software developers to display customized geographic data on top of the Google Map. The GDS Google Map combines the power of.net Desktop Control and Google Map API to provide an enhanced mapping experience. There are two editions of GDS Google Map: Professional and Ultimate. This document describes how to work with GDS Google Map Ultimate. We use C# with Visual Studio 2010 throughout this document. 2. Getting started with GDS Google Map 2.1 System Requirements GDS Google Map requires a minimal of.net 4.0 Framework on 64-bit Windows 7 with Visual Studio It has been tested on.net 4.0, 4.5, 4.5.1, 4.5.2, 4.6, and on Windows 7, 8.1 and 10 with Visual Studio 2010, 2012, 2013 and How to install Download Gds.GoogleMap.Ultimate.Setup.msi from Run the installer and follow the screen instructions to complete the installation. Gds.GoogleMap.Ultimate.dll will be installed in the folder of C:\Program Files (x86)\gds Design & Development Ltd\GDS Google Map Ultimate V by default unless you choose other path. 2.3 Add GDS Google Map to Visual Studio Toolbox and create a simple map project Launch Visual Studio, create a new Windows Forms project and name it as SimpleMap ; All Rights Reserved 1/123

2 2.3.2 Bring up Toolbox window, then move mouse on the toolbox, then right click, then choose Add Tab as shown in Figure 2.3.1; Figure Add Tab in Visual Studio 2010 Toolbox Name the newly created Tab as GDS Google Map Ultimate, then right click on it, and then click Choose Items menu item as Figure 2.3.2; All Rights Reserved 2/123

3 Figure Choose Item on GDS Google Map Ultimate Tab Click on Browse on Choose Toolbox Items window as Figure 2.3.3; All Rights Reserved 3/123

4 Figure Choose Toolbox Item Window As shown on Figure 2.3.4, navigate to the folder where GDS Google Map Ultimate was installed, then select Gds.GoogleMap.Ultimate.dll, then click Open button, then click Ok on the Choose Toolbox Items window; All Rights Reserved 4/123

5 Figure Open File Window to locate executables You will see GDS Google Map Ultimate together with other GDS customized controls show up under GDS Google Map Ultimate tab as Figure 2.3.5; All Rights Reserved 5/123

6 Figure GDS Google Map Ultimate added on Toolbox Click on Tools -> Options to bring up the Options Window; Navigate to Windows Forms Designer -> General ; Make sure that Toolbox -> AutoToolboxPopulate is set to True as Figure 2.3.6; You might need to choose False then True ; Then click OK button; All Rights Reserved 6/123

7 Figure Options Window Windows Forms Designer - General Click Files -> Save All, or the Save All shortcut on the toolbar. It is very important to do this. Otherwise, next time you start Visual Studio 2010, you will have to redo all the steps again; Drag Map to Form1; resize it properly; Name it to _map; set its Dock property to Fill, then click on Save All shortcut; then compile and run, you will have your first un-licensed Google Map integrated into a Windows Form Application as Figure All Rights Reserved 7/123

8 Figure Screen-cut of SimpleMap program 2.4 How to register Run the SimpleMap program mentioned in 2.3.9, then click on the Register button to bring up the Register window as Figure 2.4.1: All Rights Reserved 8/123

9 Figure Register Window If you have made a purchase, please provide the registration code. Otherwise, please choose 30-Day Trial License Please also provide your valid address to which the license key will be sent Click on the Register button to register the product. After successful registration, the license key will be ed to you immediately. Please check your spam box if you don t see it in your inbox Please see for how to use your license key. All Rights Reserved 9/123

10 3. Working with GDS Google Map 3.1 Markers Map Create a new Windows Forms Application project named MarkersMap ; Rename Form1 to MarkersForm; drag Map to it, build the UI as Figure 3.1.1; Figure Markers Map UI All Rights Reserved 10/123

11 3.1.3 Set Map.GdsGoogleMapLicenseKey property. You can set it from the Properites Panel inside Visual Studio in Design time, then save your project. Then close the MarkersForm.cs [Design], and then re-open it. You will see a Google Map on the Form. Or you can set it programmably. If you choose to programmably set it, please set it where the instance of Gds.GoogleMap.Ultimate.Map is created as the following: _map = new Gds.GoogleMap.Ultimate.Map GdsGoogleMapLicenseKey = "Your license key" ; Please note that the license key is one line string, no space before, after or in the middle. Otherwise, you will see invalid license error. The best way is to do copy and paste from the you receive Put the following codes in MarkersForm.cs: using System; using System.Drawing; using System.Windows.Forms; using Gds.GoogleMap.Ultimate.DisplaySettings.Markers; using Gds.GoogleMap.Ultimate.FeatureLayers.MarkerLayers; using Gds.GoogleMap.Ultimate.Features.Markers; using Gds.GoogleMap.Ultimate.DisplaySettings; using Gds.GoogleMap.Ultimate.GeoData; using Gds.GoogleMap.Ultimate.MapEvents; namespace GdsGoogleMapUltimateSamples public partial class MarkersForm : Form private CharPinLayer _charpinlayer; private DotPinLayer _dotpinlayer; private IconPinLayer _iconpinlayer; private TextPinLayer _textpinlayer; private IconPinLayer _taxilayer; private IconPin _taxi; public MarkersForm() InitializeComponent(); _map.mapinitialized += OnMapInitialized; All Rights Reserved 11/123

12 _map.mapcharpinmousemove += OnMapCharPinMouseMove; _map.mapcharpinmouseleave += OnMapCharPinMouseLeave; _map.mapdotpinmousemove += OnMapDotPinMouseMove; _map.mapdotpinmouseleave += OnMapDotPinMouseLeave; _map.mapiconpinmousemove += OnMapIconPinMouseMove; _map.mapiconpinmouseleave += OnMapIconPinMouseLeave; _map.maptextpinmousemove += OnMapTextPinMouseMove; _map.maptextpinmouseleave += OnMapTextPinMouseLeave; _visiblecheckbox.click += OnVisibleCheckBoxClick; _inspectablecheckbox.click += OnInspectableCheckBoxClick; _showdescriptioncheckbox.click += OnShowDescriptionCheckBoxClick; _movebutton.click += OnMoveButtonClick; _changedisplaysettingsbutton.click += OnChangeDisplaySettingsButtonClick; _changedescriptionbutton.click += OnChangeDescriptionButtonClick; _addmarkerbutton.click += OnAddMarkerButtonClick; private void PopulateUi() _visiblecheckbox.checked = _charpinlayer.visible; _inspectablecheckbox.checked = _charpinlayer.inspectable; _showdescriptioncheckbox.checked = _charpinlayer.showdescription; private void OnMapInitialized( object sender, MapInitializedEventArgs e ) _map.mapcenter = new LatLng( , ); _map.mapzoom = 12; _map.autocompleteservice.findaddressenable = false; _map.autocompleteservice.drawfoundaddressenable = false; _map.maptypecontrolenable = false; _charpinlayer = _map.featurelayercollection.addcharpinlayer( "CharPinLayer" ); _dotpinlayer = _map.featurelayercollection.adddotpinlayer( "DotPinLayer" ); _iconpinlayer = _map.featurelayercollection.addiconpinlayer( "IconPinLayer" ); _textpinlayer = _map.featurelayercollection.addtextpinlayer( "TextPinLayer" ); _taxilayer = _map.featurelayercollection.addiconpinlayer( "TaxiLayer" ); All Rights Reserved 12/123

13 PopulateUi(); _charpinlayer.collection.add( new CharPin( , , "RBC Bank\r\nBridlewood Shopping Centre\r\n th St SW, Calgary, AB\r\nPhone: (403) \r\nTransit #180", "R" ) ); _dotpinlayer.collection.add( new DotPin( , , "RBC Bank\r\nBonavista\r\n755 Lake Bonavista Dr SE, Calgary, AB\r\nPhone: (403) \r\nTransit #9099" ), DisplayModeOption.Normal, new DotPinDisplaySettings PinStyle = PinStyleOption.Star, new DotPinDisplaySettings PinStyle = PinStyleOption.Star, FillColor = Color.Green, ); _iconpinlayer.collection.add( new IconPin( , , "RBC Bank\r\nGates Of Walden\r\n151 Walden Gate SE, Calgary, AB\r\nPhone: (403) \r\nTransit #1436", IconPinOption.BankDollar ) ); _textpinlayer.collection.add( new TextPin( , , "RBC Bank\r\nDeer Valley Market Place\r\n1221 Canyon Meadows Dr SE, Calgary, AB\r\nPhone: (403) \r\nTransit #629", "RBC" ), DisplayModeOption.Normal, new TextPinDisplaySettings FontSize = 9, ScaleFactor = 0.8, FillColor = Color.Green, All Rights Reserved 13/123

14 );, new TextPinDisplaySettings FontSize = 9, ScaleFactor = 0.8, FillColor = Color.Yellow, catch _taxi = new IconPin( , , "Moving Taxi", IconPinOption.Taxi ); _taxilayer.collection.add( _taxi ); private void OnMapCharPinMouseMove( object sender, MapMarkerMouseMoveEventArgs e ) _charpinlayer.collection.setdisplaymode( e.markerindex, DisplayModeOption.Highlight ); catch private void OnMapCharPinMouseLeave( object sender, MapMarkerMouseLeaveEventArgs e ) _charpinlayer.collection.setdisplaymode( e.markerindex, DisplayModeOption.Normal ); catch private void OnMapDotPinMouseMove( object sender, MapMarkerMouseMoveEventArgs e ) _dotpinlayer.collection.setdisplaymode( e.markerindex, DisplayModeOption.Highlight ); catch All Rights Reserved 14/123

15 private void OnMapDotPinMouseLeave( object sender, MapMarkerMouseLeaveEventArgs e ) _dotpinlayer.collection.setdisplaymode( e.markerindex, DisplayModeOption.Normal ); catch private void OnMapIconPinMouseMove( object sender, MapMarkerMouseMoveEventArgs e ) _map.featurelayercollection.geticonpinlayer( e.layerid ).Collection. SetDisplayMode( e.markerindex, DisplayModeOption.Highlight ); catch private void OnMapIconPinMouseLeave( object sender, MapMarkerMouseLeaveEventArgs e ) _map.featurelayercollection.geticonpinlayer( e.layerid ).Collection.SetDisplayMode( e.markerindex, DisplayModeOption.Normal ); catch private void OnMapTextPinMouseMove( object sender, MapMarkerMouseMoveEventArgs e ) _textpinlayer.collection.setdisplaymode( e.markerindex, DisplayModeOption.Highlight ); catch All Rights Reserved 15/123

16 private void OnMapTextPinMouseLeave( object sender, MapMarkerMouseLeaveEventArgs e ) _textpinlayer.collection.setdisplaymode( e.markerindex, DisplayModeOption.Normal ); catch private void OnVisibleCheckBoxClick( object sender, EventArgs e ) _charpinlayer.visible = _visiblecheckbox.checked; _dotpinlayer.visible = _visiblecheckbox.checked; _iconpinlayer.visible = _visiblecheckbox.checked; _textpinlayer.visible = _visiblecheckbox.checked; _taxilayer.visible = _visiblecheckbox.checked; catch private void OnInspectableCheckBoxClick( object sender, EventArgs e ) _charpinlayer.inspectable = _inspectablecheckbox.checked; _dotpinlayer.inspectable = _inspectablecheckbox.checked; _iconpinlayer.inspectable = _inspectablecheckbox.checked; _textpinlayer.inspectable = _inspectablecheckbox.checked; _taxilayer.inspectable = _inspectablecheckbox.checked; catch private void OnShowDescriptionCheckBoxClick( object sender, EventArgs e ) _charpinlayer.showdescription = _showdescriptioncheckbox.checked; All Rights Reserved 16/123

17 catch _dotpinlayer.showdescription = _showdescriptioncheckbox.checked; _iconpinlayer.showdescription = _showdescriptioncheckbox.checked; _textpinlayer.showdescription = _showdescriptioncheckbox.checked; _taxilayer.showdescription = _showdescriptioncheckbox.checked; private void OnMoveButtonClick( object sender, EventArgs e ) _taxilayer.collection.setlocation( 0, _taxi.lat , _taxi.lng ); catch private void OnChangeDisplaySettingsButtonClick( object sender, EventArgs e ) _changedisplaysettingsbutton.enabled = false; var dpds = new DotPinDisplaySettings DotColor = Color.Blue, FillColor = Color.Purple, PinStyle = PinStyleOption.Star, StarFillColor = Color.Yellow, ; _dotpinlayer.displaysettings = dpds; var cpds = new CharPinDisplaySettings CharColor = Color.Blue, FillColor = Color.Purple, PinStyle = PinStyleOption.Star, StarFillColor = Color.Yellow ; _charpinlayer.displaysettings = cpds; var ipds = new IconPinDisplaySettings FillColor = Color.Purple, PinStyle = PinStyleOption.Star, All Rights Reserved 17/123

18 StarFillColor = Color.Yellow ; _iconpinlayer.displaysettings = ipds; var tpds = new TextPinDisplaySettings FillColor = Color.Purple, FontBold = true, FontSize = 9, RotationDegree = 90, ScaleFactor = 0.9 ; _textpinlayer.displaysettings = tpds; dpds = new DotPinDisplaySettings DotColor = Color.Blue, FillColor = Color.Pink, PinStyle = PinStyleOption.Star, StarFillColor = Color.Yellow ; _dotpinlayer.highlightdisplaysettings = dpds; cpds = new CharPinDisplaySettings CharColor = Color.Blue, FillColor = Color.Pink, PinStyle = PinStyleOption.Star, StarFillColor = Color.Yellow ; _charpinlayer.highlightdisplaysettings = cpds; ipds = new IconPinDisplaySettings FillColor = Color.Pink, PinStyle = PinStyleOption.Star, StarFillColor = Color.Yellow ; _iconpinlayer.highlightdisplaysettings = ipds; tpds = new TextPinDisplaySettings FillColor = Color.Pink, FontBold = true, FontSize = 9, All Rights Reserved 18/123

19 ; RotationDegree = 90, ScaleFactor = 0.9 catch _textpinlayer.highlightdisplaysettings = tpds; private void OnChangeDescriptionButtonClick( object sender, EventArgs e ) for( var i = 0; i < _charpinlayer.collection.count; i++) var des = _charpinlayer.collection[ i ].Description; catch _charpinlayer.collection.setdescription( i, des + Environment.NewLine + "New Description"); private void OnAddMarkerButtonClick( object sender, EventArgs e ) _addmarkerbutton.enabled = false; _textpinlayer.collection.add( new TextPin( , , "RBC Bank\r\nShawnessy Centre\r\n250 Shawville Blvd SE, Calgary, AB\r\nPhone: (403) \r\nTransit #2299", "RBC" ) ); Compile and run, you will see five markers showing on the map as Figure 3.1.2; All Rights Reserved 19/123

20 Figure Screen-cut of Markers Map Move the mouse over the red Char Pin marker, you will see its color change to light blue and a description tooltip show up as Figure 3.1.3; All Rights Reserved 20/123

21 Figure Highlighted Char Pin Marker with description tooltip Un-check Inspectable Checkbox and click Change Description Button; then move the mouse over the same Char Pin marker to see that the Char Pin marker stays with the same color with the New Description added to the end of the original description tooltip shown as Figure 3.1.4; All Rights Reserved 21/123

22 Figure Un-highlighted Char Pin Marker with new description Click Move button couple times and you will see the marker with taxi icon move to new location as Figure All Rights Reserved 22/123

23 Figure New Location of Taxi Icon Marker Click Change Display Settings button and see that all markers change to color purple; move the mouse over RBC Marker and see that its color changes to pink and description tooltip shows up as Figure 3.1.6; All Rights Reserved 23/123

24 Figure Markers with new normal display settings and new highlight display settings Please note that you have to call Collection.SetLocation method if you want to change the latitude and longitude of the marker. The same for Icon Layer where you call Collection.SetLocation, Polyline Layer call Collection.SetPath, Polygon Layer call Collection.SetPath and Heatmap Layer call Collection.SetData. All Rights Reserved 24/123

25 3.2 Icons Map Create a new Windows Forms Application project and named it IconsMap ; Find two 32 x 32 png icons, add them into Resources and name them as TD32 and TDHighlight32; Rename Form1.cs to IconsForm.cs and create the GUI as Figure 3.2.1; Fig Icons Map GUI Design All Rights Reserved 25/123

26 3.2.4 Code as the following source code: using System; using System.Drawing.Imaging; using System.IO; using System.Windows.Forms; using Gds.GoogleMap.Ultimate.DisplaySettings; using Gds.GoogleMap.Ultimate.FeatureLayers; using Gds.GoogleMap.Ultimate.GeoData; using Gds.GoogleMap.Ultimate.MapEvents; using GdsGoogleMapUltimateSamples.Properties; using Icon = Gds.GoogleMap.Ultimate.Features.Icon; namespace GdsGoogleMapUltimateSamples public partial class IconsForm : Form private const string TdLayer = "TD"; private const string TruckLayer = "Truck"; private readonly string _tdiconpath; private readonly string _tdhighlighticonpath; private readonly string _truckiconpath; private IconLayer _tdlayer; private IconLayer _trucklayer; private Icon _movingicon; public IconsForm() InitializeComponent(); _tdiconpath = Path.GetTempPath() + "\\TdIcon32.png"; _tdhighlighticonpath = Path.GetTempPath() + "\\TdHighlightIcon32.png"; _truckiconpath = Path.GetTempPath() Resources.TD32.Save( _tdiconpath, ImageFormat.Png ); Resources.TDHighlight32.Save( _tdhighlighticonpath, ImageFormat.Png ); Resources.Truck32.Save( _truckiconpath, ImageFormat.Png ); _map.mapinitialized += OnMapInitialized; _map.mapiconmousemove += OnMapIconMouseMove; _map.mapiconmouseleave += OnMapIconMouseLeave; All Rights Reserved 26/123

27 _visiblecheckbox.click += OnVisibleCheckBoxClick; _inspectablecheckbox.click += OnInspectableCheckBoxClick; _showdescriptioncheckbox.click += OnShowDescriptionCheckBoxClick; _movebutton.click += OnMoveButtonClick; _changedisplaysettingsbutton.click += OnChangeDisplaySettingsButtonClick; _changedescriptionbutton.click += OnChangeDescriptionButtonClick; _addiconbutton.click += OnAddIconButtonClick; private void PopulateUi() _visiblecheckbox.checked = _tdlayer.visible; _inspectablecheckbox.checked = _tdlayer.inspectable; _showdescriptioncheckbox.checked = _tdlayer.showdescription; private void SetIconDispalyMode( string layerid, int iconindex, DisplayModeOption displaymode ) var layer = ( IconLayer ) _map.featurelayercollection [ layerid ]; layer.collection.setdisplaymode( iconindex, displaymode ); private void OnMapInitialized( object sender, MapInitializedEventArgs e ) _map.mapcenter = new LatLng( , ); _map.mapzoom = 13; _tdlayer = _map.featurelayercollection.addiconlayer( TdLayer ); PopulateUi(); _tdlayer.displaysettings = new IconDisplaySettings IconImagePath = _tdiconpath, ; _tdlayer.highlightdisplaysettings = new IconDisplaySettings IconImagePath = _tdhighlighticonpath, ; _tdlayer.collection.add( new Icon( , , All Rights Reserved 27/123 "TD

28 ) ); Bank\r\nSuite 100, 803 Chaparral Dr SE, Calgary, AB\r\nPhone: (403) \r\nBranch # 8023" catch _trucklayer = _map.featurelayercollection.addiconlayer( TruckLayer ); _trucklayer.displaysettings = new IconDisplaySettings IconImagePath = _truckiconpath, ; _trucklayer.highlightdisplaysettings = new IconDisplaySettings IconImagePath = _truckiconpath, ; _movingicon = new Icon( , , "Moving Truck" ); _trucklayer.collection.add( _movingicon ); private void OnMapIconMouseMove( object sender, MapIconMouseMoveEventArgs e ) SetIconDispalyMode( e.layerid, e.iconindex, DisplayModeOption.Highlight ); catch private void OnMapIconMouseLeave( object sender, MapIconMouseLeaveEventArgs e ) SetIconDispalyMode( e.layerid, e.iconindex, DisplayModeOption.Normal ); catch All Rights Reserved 28/123

29 private void OnVisibleCheckBoxClick( object sender, EventArgs e ) _tdlayer.visible = _visiblecheckbox.checked; _trucklayer.visible = _visiblecheckbox.checked; catch private void OnInspectableCheckBoxClick( object sender, EventArgs e ) _tdlayer.inspectable = _inspectablecheckbox.checked; _trucklayer.inspectable = _inspectablecheckbox.checked; catch private void OnShowDescriptionCheckBoxClick( object sender, EventArgs e ) _tdlayer.showdescription = _showdescriptioncheckbox.checked; _trucklayer.showdescription = _showdescriptioncheckbox.checked; catch private void OnMoveButtonClick( object sender, EventArgs e ) if ( _trucklayer == null _movingicon == null ) return; _trucklayer.collection.setlocation( 0, _movingicon.lat , _movingicon.lng ); private void OnChangeDisplaySettingsButtonClick( object sender, EventArgs e ) All Rights Reserved 29/123

30 _changedisplaysettingsbutton.enabled = false; catch var ds = new IconDisplaySettings IconImagePath = _tdhighlighticonpath ; _tdlayer.displaysettings = ds; var hds = new IconDisplaySettings IconImagePath = _tdiconpath ; _tdlayer.highlightdisplaysettings = hds; private void OnChangeDescriptionButtonClick( object sender, EventArgs e ) _tdlayer.collection.setoptions( 0, "New Hello" ); catch private void OnAddIconButtonClick( object sender, EventArgs e ) _addiconbutton.enabled = false; catch _tdlayer.collection.add( new Icon( , , "TD Bank\r\nUnit 620, Sheriff King St SW, Calgary, AB\r\nPhone: (403) \r\nBranch # 8019" ) ); All Rights Reserved 30/123

31 3.2.5 Run the program and you will see as Figure 3.2.2; Figure Screen-cut of Icons Map program Move mouse over a TD icon, you will see a highlighted TD icon and a description label show up as Figure 3.2.3; All Rights Reserved 31/123

32 Figure Inspect an Icon Play with program and see more results similar to the Markers Map program. 3.3 Polylines Map Create a new Windows Forms Application project and name it PolylinesMap ; Rename the Form1.cs to PolylinesForm.cs and build the UI as Figure 3.3.1; All Rights Reserved 32/123

33 Figure Polylines Map GUI Design Code as the following source code: using System; using System.Collections.Generic; using System.Drawing; using System.Windows.Forms; using Gds.GoogleMap.Ultimate.DisplaySettings; using Gds.GoogleMap.Ultimate.FeatureLayers; using Gds.GoogleMap.Ultimate.Features; using Gds.GoogleMap.Ultimate.GeoData; All Rights Reserved 33/123

34 using Gds.GoogleMap.Ultimate.MapEvents; using Gds.GoogleMap.Ultimate.Styles; namespace GdsGoogleMapUltimateSamples public partial class PolylinesForm : Form private PolylineLayer _roadlayer; public PolylinesForm() InitializeComponent(); _map.mapinitialized += OnMapInitialized; _map.mappolylinemousemove += OnMapPolylineMouseMove; _map.mappolylinemouseleave += OnMapPolylineMouseLeave; _visiblecheckbox.click += OnVisibleCheckBoxClick; _inspectablecheckbox.click += OnInspectableCheckBoxClick; _changedisplaysettingsbutton.click += OnChangeDisplaySettingsButtonClick; _addpolylinebutton.click += OnAddPolylineButtonClick; private void PopulateUi() _visiblecheckbox.checked = _roadlayer.visible; _inspectablecheckbox.checked = _roadlayer.inspectable; private void SetPolylineDispalyMode( string layerid, int index, DisplayModeOption displaymode ) var layer = ( PolylineLayer ) _map.featurelayercollection[ layerid ]; layer.collection.setdisplaymode( index, displaymode ); private void OnMapInitialized( object sender, MapInitializedEventArgs e ) _map.mapcenter = new LatLng( , ); _map.mapzoom = 12; _roadlayer = _map.featurelayercollection.addpolylinelayer( "RoadLayer" ); PopulateUi(); All Rights Reserved 34/123

35 var latlnglst = new List<LatLng> new LatLng( , ), new LatLng( , ), new LatLng( , ), new LatLng( , ), new LatLng( , ), new LatLng( , ), ; _roadlayer.collection.add( new Polyline( latlnglst ) ); var latlnglst = new List<LatLng> new LatLng( , ), new LatLng( , ), new LatLng( , ), new LatLng( , ), new LatLng( , ), new LatLng( , ), new LatLng( , ), ; _roadlayer.collection.add( new Polyline( latlnglst ), DisplayModeOption.Normal, new PolylineDisplaySettings StrokeColor = Color.Green, StrokeOpacity = 0.8, StrokeWeight = 6, Style = new LineArrowStyle( ArrowStyleOption.ForwardOpenArr ow ), new PolylineDisplaySettings StrokeColor = Color.LightBlue, StrokeOpacity = 0.8, StrokeWeight = 6, Style = new LineArrowStyle( ArrowStyleOption.ForwardOpenArr ow ) ); var latlnglst = new List<LatLng> All Rights Reserved 35/123

36 ; new LatLng( , ), new LatLng( , ), new LatLng( , ), new LatLng( , ), new LatLng( , ), new LatLng( , ), _roadlayer.collection.add( new Polyline( latlnglst ), DisplayModeOption.Normal, new PolylineDisplaySettings StrokeColor = Color.Purple, StrokeOpacity = 0.8, StrokeWeight = 4, Style = new LineArrowStyle( ArrowStyleOption.Circle ), new PolylineDisplaySettings StrokeColor = Color.LightBlue, StrokeOpacity = 0.8, StrokeWeight = 4, Style = new LineArrowStyle( ArrowStyleOption.Circle ) ); catch ( Exception ex ) Text = ex.message; private void OnVisibleCheckBoxClick( object sender, EventArgs e ) _roadlayer.visible = _visiblecheckbox.checked; catch ( Exception ex ) Text = ex.message; private void OnInspectableCheckBoxClick( object sender, EventArgs e ) All Rights Reserved 36/123

37 _roadlayer.inspectable = _inspectablecheckbox.checked; catch ( Exception ex ) Text = ex.message; private void OnChangeDisplaySettingsButtonClick( object sender, EventArgs e ) _roadlayer.displaysettings = new PolylineDisplaySettings StrokeColor = Color.Red, StrokeOpacity = 0.8, StrokeWeight = 10, Style = new LineDashStyle( DashStyleOption.Solid ), ; _roadlayer.highlightdisplaysettings = new PolylineDisplaySettings StrokeColor = Color.Blue, StrokeOpacity = 0.8, StrokeWeight = 10, Style = new LineDashStyle( DashStyleOption.Solid ), ; catch ( Exception ex ) Text = ex.message; private void OnMapPolylineMouseMove( object sender, MapPolylineMouseMoveEventArgs e ) SetPolylineDispalyMode( e.layerid, e.polylineindex, DisplayModeOption.Highlight ); catch ( Exception ex ) Text = ex.message; All Rights Reserved 37/123

38 private void OnMapPolylineMouseLeave( object sender, MapPolylineMouseLeaveEventArgs e ) SetPolylineDispalyMode( e.layerid, e.polylineindex, DisplayModeOption.Normal ); catch ( Exception ex ) Text = ex.message; private void OnAddPolylineButtonClick( object sender, EventArgs e ) var latlnglst = new List<LatLng> new LatLng( , ), new LatLng( , ), new LatLng( , ), new LatLng( , ), new LatLng( , ), ; _roadlayer.collection.add( new Polyline( latlnglst ), DisplayModeOption.Normal, new PolylineDisplaySettings StrokeColor = Color.Gray, StrokeOpacity = 1.0, StrokeWeight = 4, Style = new LineDashStyle( DashStyleOption.Dash ), new PolylineDisplaySettings StrokeColor = Color.LightBlue, StrokeOpacity = 1.0, StrokeWeight = 4, Style = new LineDashStyle( DashStyleOption.Dash ) ); catch ( Exception ex ) Text = ex.message; All Rights Reserved 38/123

39 3.3.4 Run and play the program and you will see as follow screen cuts: Figure Polylines Map All Rights Reserved 39/123

40 Figure Added Polyline and highlighted Polyline 3.4 Polygons Map Create a Windows Forms Application project and name it PolygonsMap ; Rename Form1.cs to PolygonsForm.cs and create the following UI as Figure 3.4.1; All Rights Reserved 40/123

41 Figure Polygons Map GUI Design Code the following source code: using System; using System.Collections.Generic; using System.Drawing; using System.Windows.Forms; using Gds.GoogleMap.Ultimate.DisplaySettings; using Gds.GoogleMap.Ultimate.FeatureLayers; using Gds.GoogleMap.Ultimate.Features; All Rights Reserved 41/123

42 using Gds.GoogleMap.Ultimate.GeoData; using Gds.GoogleMap.Ultimate.MapEvents; namespace GdsGoogleMapUltimateSamples public partial class PolygonsForm : Form private class CommunityFeature : Polygon public string Description get; private set; public CommunityFeature( List<LatLng> latlngs, string description ) : base( latlngs ) Description = description; private PolygonLayer _communitylayer; public PolygonsForm() InitializeComponent(); _map.mapinitialized += OnMapInitialized; _map.mappolygonmousemove += OnMapPolygonMouseMove; _map.mappolygonmouseleave += OnMapPolygonMouseLeave; _map.mappolygonmouseclick += OnMapPolygonMouseClick; _visiblecheckbox.click += OnVisibleCheckBoxClick; _inspectablecheckbox.click += OnInspectableCheckBoxClick; _changedisplaysettingsbutton.click += OnChangeDisplaySettingsButtonClick; _addpolygonbutton.click += OnAddPolygonButtonClick; private void PopulateUi() _visiblecheckbox.checked = _communitylayer.visible; _inspectablecheckbox.checked = _communitylayer.inspectable; private void SetPolygonDisplayMode( string layerid, int index, DisplayModeOption displaymode ) var layer = ( PolygonLayer ) _map.featurelayercollection [ layerid ]; layer.collection.setdisplaymode( index, displaymode ); private void OnMapInitialized( object sender, MapInitializedEventArgs e ) All Rights Reserved 42/123

43 _map.mapcenter = new LatLng( , ); _map.mapzoom = 12; _map.autocompleteservice.findaddressenable = false; _map.autocompleteservice.drawfoundaddressenable = false; _communitylayer = _map.featurelayercollection.addpolygonlayer( "CommunityLayer" ); PopulateUi(); var latlngs = new List<LatLng> new LatLng( , ), new LatLng( , ), new LatLng( , ), new LatLng( , ), new LatLng( , ), new LatLng( , ), new LatLng( , ), new LatLng( , ), new LatLng( , ), ; var cf = new CommunityFeature( latlngs, "Sundance Community" ); _communitylayer.collection.add( cf, DisplayModeOption.Normal, new PolygonDisplaySettings FillColor = Color.Purple, FillOpacity = 0.6, StrokeColor = Color.Purple, StrokeOpacity = 1.0, StrokeWeight = 4, new PolygonDisplaySettings FillColor = Color.LightBlue, FillOpacity = 0.6, StrokeColor = Color.LightBlue, StrokeOpacity = 1.0, StrokeWeight = 4 ); All Rights Reserved 43/123

44 catch ( Exception ex ) Text = ex.message; private void OnMapPolygonMouseClick( object sender, MapPolygonMouseClickEventArgs e ) var layer = ( PolygonLayer ) _map.featurelayercollection [ e.layerid ]; var cf = ( CommunityFeature ) layer.collection [ e.polygonindex ]; if ( e.button == MapMouseButtonOption.Left ) MessageBox.Show( "Left Click on " + cf.description ); else if ( e.button == MapMouseButtonOption.Right ) MessageBox.Show( "Right Click on " + cf.description ); catch ( Exception ex ) Text = ex.message; private void OnMapPolygonMouseLeave( object sender, MapPolygonMouseLeaveEventArgs e ) SetPolygonDisplayMode( e.layerid, e.polygonindex, DisplayModeOption.Normal ); catch (Exception ex ) Text = ex.message; private void OnMapPolygonMouseMove( object sender, MapPolygonMouseMoveEventArgs e ) All Rights Reserved 44/123

45 SetPolygonDisplayMode( e.layerid, e.polygonindex, DisplayModeOption.Highlight ); catch ( Exception ex ) Text = ex.message; private void OnVisibleCheckBoxClick( object sender, EventArgs e ) _communitylayer.visible = _visiblecheckbox.checked; catch ( Exception ex ) Text = ex.message; private void OnInspectableCheckBoxClick( object sender, EventArgs e ) _communitylayer.inspectable = _inspectablecheckbox.checked; catch ( Exception ex ) Text = ex.message; private void OnChangeDisplaySettingsButtonClick( object sender, EventArgs e ) _communitylayer.displaysettings = new PolygonDisplaySettings FillColor = Color.Green, FillOpacity = 0.8, StrokeColor = Color.Green, StrokeOpacity = 1.0, StrokeWeight = 4 ; _communitylayer.highlightdisplaysettings = new PolygonDisplaySettings All Rights Reserved 45/123

46 FillColor = Color.LightBlue, FillOpacity = 0.8, StrokeColor = Color.LightBlue, StrokeOpacity = 1.0, StrokeWeight = 4 ; catch ( Exception ex ) Text = ex.message; private void OnAddPolygonButtonClick( object sender, EventArgs e ) _addpolygonbutton.enabled = false; var latlngs = new List<LatLng> new LatLng( , ), new LatLng( , ), new LatLng( , ), new LatLng( , ), new LatLng( , ), new LatLng( , ), new LatLng( , ), new LatLng( , ), new LatLng( , ), ; var cf = new CommunityFeature( latlngs, "Chaparell Community" ); _communitylayer.collection.add( cf ); catch ( Exception ex ) Text = ex.message; Run and play. You will see the following screen-cuts: All Rights Reserved 46/123

47 Figure Polygons Map Program first run All Rights Reserved 47/123

48 Figure Added Polygon All Rights Reserved 48/123

49 Figure Inspect Red Polygon Mouse Over All Rights Reserved 49/123

50 Figure Mouse Left Click on Purple Polygon All Rights Reserved 50/123

51 Figure Mouse Right Click on Red Polygon 3.5 Geocoding, Map Types and Copy Map Create a Windows Forms Application project and name it GeocodingMap ; Rename Form1 to GeocodingForm and create the GUI as Figure 3.5.1; All Rights Reserved 51/123

52 Figure Geocoding Map GUI Design Code the following source code: using System; using System.Drawing; using System.Windows.Forms; using Gds.GoogleMap.Ultimate; using Gds.GoogleMap.Ultimate.FeatureLayers.MarkerLayers; using Gds.GoogleMap.Ultimate.Features.Markers; using Gds.GoogleMap.Ultimate.Geocoding; using Gds.GoogleMap.Ultimate.Geocoding.Requests; All Rights Reserved 52/123

53 using Gds.GoogleMap.Ultimate.GeoData; using Gds.GoogleMap.Ultimate.MapEvents; namespace GdsGoogleMapUltimateSamples public partial class GeocodingForm : Form private static readonly string [] AddressArray = new [] " Coun Hills Blvd NW, Calgary, AB", "87 Crowfoot Way NW B7, Calgary", ; private IconPinLayer _geocodinglayer; private Bitmap _image; private readonly Timer _timer; private int _addressindex; public GeocodingForm() InitializeComponent(); _timer = new Timer Interval = 500 ; _timer.tick += OnTimerTick; _addressindex = 0; _map.mapinitialized += OnMapInitialized; _map.geocodingservice.geocodingcompleted += OnGeocodingCompleted; _copymapimagetoolstripbutton.click += OnCopyMapImageToolStripButtonClick; _imagelabel.paint += OnImageLabelPaint; private void OnTimerTick( object sender, EventArgs e ) _timer.enabled = false; _map.geocodingservice.begingeocoding( new GeocoderAddressRequest Address = AddressArray [ _addressindex ] ); catch (Exception ex ) Text = ex.message; All Rights Reserved 53/123

54 _addressindex++; if ( _addressindex >= 0 && _addressindex < AddressArray.Length ) _timer.enabled = true; private void OnMapInitialized( object sender, MapInitializedEventArgs e ) _map.mapcenter = new LatLng( , ); _map.mapzoom = 13; _map.maptypeid = MapTypeIdOption.Hybrid; _map.autocompleteservice.findaddressenable = false; _map.autocompleteservice.drawfoundaddressenable = false; _geocodinglayer = _map.featurelayercollection.addiconpinlayer( "GeocodingLayer" ); _timer.enabled = true; catch ( Exception ex ) Text = ex.message; private void OnGeocodingCompleted( object sender, GeocodingCompletedEventArgs e ) if ( e.status!= GeocoderStatusOption.Ok ) return; foreach ( var result in e.resultcollection ) _geocodinglayer.collection.add( new IconPin( result.geome.location.lat, result.geome.location.lng, result.formattedaddress, IconPinOption.Restaurant ) ); catch ( Exception ex ) Text = ex.message; All Rights Reserved 54/123

55 private void OnCopyMapImageToolStripButtonClick( object sender, EventArgs e ) _image = _map.mapimage; _imagelabel.invalidate(); catch ( Exception ex ) Text = ex.message; private void OnImageLabelPaint( object sender, PaintEventArgs e ) if ( _image == null ) return; e.graphics.drawimage( _image, 0, 0 ); Run and play. You will see the following screen-cuts: All Rights Reserved 55/123

56 Figure Program first run All Rights Reserved 56/123

57 Figure Map Image Copied to the Right All Rights Reserved 57/123

58 Figure Click on Open Street Map and Mouse Over One Marker 3.6 Directions Service Create a Windows Forms Application project and name it DirectionsMap ; Rename Form1 to DirectionsForm; add a Tool Strip and four Tool Strip Buttons; name them as _toolstrip, _startovertoolstripbutton, _removeautoroutetoolstripbutton, _removecustomizedroutetoolstripbutton and _autodisplaytoolstripbutton; Add Map and name it as _map; set Dock to Fill; GUI looks as Figure 3.6.1; All Rights Reserved 58/123

59 Figure Directions Map GUI Design Code the following source code: using System; using System.Drawing; using System.Linq; using System.Windows.Forms; using Gds.GoogleMap.Ultimate.Directions; using Gds.GoogleMap.Ultimate.Directions.Request; using Gds.GoogleMap.Ultimate.Directions.Results; All Rights Reserved 59/123

60 using Gds.GoogleMap.Ultimate.DisplaySettings; using Gds.GoogleMap.Ultimate.DisplaySettings.Markers; using Gds.GoogleMap.Ultimate.FeatureLayers; using Gds.GoogleMap.Ultimate.FeatureLayers.MarkerLayers; using Gds.GoogleMap.Ultimate.Features; using Gds.GoogleMap.Ultimate.Features.Markers; using Gds.GoogleMap.Ultimate.GeoData; using Gds.GoogleMap.Ultimate.MapEvents; using Gds.GoogleMap.Ultimate.Styles; namespace GdsGoogleMapUltimateSamples public partial class DirectionsForm : Form private TextPinLayer _dirmarkerlayer; private PolylineLayer _dirpolylinelayer; private readonly Timer _timer; public DirectionsForm() InitializeComponent(); _timer = new Timer Enabled = false, Interval = 500, ; _timer.tick += OnTimerTick; _map.mapinitialized += OnMapInitialized; _map.directionsservice.directionsservicecompleted += OnDirectionsServiceCompleted; _startovertoolstripbutton.click += OnStartOverToolStripButtonClick; _removeautoroutetoolstripbutton.click += OnRemoveAutoRouteToolStripButtonClick; _removecustomizedroutetoolstripbutton.click += OnRemoveCustomizedRouteToolStripButtonClick; _autodisplaytoolstripbutton.click += OnAutoDisplayToolStripButtonClick; private void OnTimerTick( object sender, EventArgs e ) _timer.enabled = false; var dirreq2 = new DirectionsRequest Origin = new LatLngLocation( , ), All Rights Reserved 60/123

61 ; Destination = new LatLngLocation( , ), TravelMode = TravelModeOption.Driving, _map.directionsservice.begindirectionsservice( dirreq2 ); private void OnMapInitialized( object sender, MapInitializedEventArgs e ) _dirmarkerlayer = _map.featurelayercollection.addtextpinlayer( "RouteMarkerLayer" ); _dirpolylinelayer = _map.featurelayercollection.addpolylinelayer( "RoutePolylineLayer" ); var displaysettings = _dirpolylinelayer.displaysettings; displaysettings.style = new LineDashStyle( DashStyleOption.Solid ); displaysettings.strokeweight = 12; displaysettings.strokeopacity = 0.6; _map.mapcenter = new LatLng( , ); _map.mapzoom = 12; _map.directionsservice.autodisplayrouteenable = _autodisplaytoolstripbutton.text.equals( "Auto Display" ); var dirreq1 = new DirectionsRequest Origin = new AddressLocation( "963 Queensland Drive SE, Calgary, AB Canada" ), Destination = new AddressLocation( "55 Midpark Rise SE, Calgary, AB, Canada" ), TravelMode = TravelModeOption.Driving, ; _map.directionsservice.begindirectionsservice( dirreq1 ); _timer.enabled = true; catch ( Exception ex ) Text = ex.message; private void OnDirectionsServiceCompleted( object sender, DirectionsServiceCompletedEventArgs e ) if ( e.status!= DirectionsStatusOption.Ok ) All Rights Reserved 61/123

62 return; foreach ( var route in e.result.routecollection ) foreach ( var leg in route.legcollection ) var stmk = new TextPin( leg.startlocation.lat, leg.startlocation.lng, leg.startaddress, "Start" ); _dirmarkerlayer.collection.add( stmk, DisplayModeOption.Normal, new TextPinDisplaySettings ScaleFactor = 1.0, new TextPinDisplaySettings ScaleFactor = 1.0 ); foreach ( var step in leg.stepcollection ) var pl = new Polyline( step.path.tolist() ); _dirpolylinelayer.collection.add( pl ); var edmk = new TextPin( leg.endlocation.lat, leg.endlocation.lng, leg.endaddress, "End" ); _dirmarkerlayer.collection.add( edmk, DisplayModeOption.Normal, new TextPinDisplaySettings FillColor = Color.Green, ScaleFactor = 1.0, new TextPinDisplaySettings ScaleFactor = 1.0 ); All Rights Reserved 62/123

63 catch ( Exception ex ) Text = ex.message; private void OnStartOverToolStripButtonClick( object sender, EventArgs e ) _dirmarkerlayer.collection.removeall(); _dirpolylinelayer.collection.removeall(); _dirmarkerlayer = null; _dirpolylinelayer = null; _map.startover(); catch ( Exception ex ) Text = ex.message; private void OnRemoveAutoRouteToolStripButtonClick( object sender, EventArgs e ) _map.directionsservice.removeallautodisplayedroutes(); catch ( Exception ex ) Text = ex.message; private void OnRemoveCustomizedRouteToolStripButtonClick( object sender, EventArgs e ) _dirmarkerlayer.collection.removeall(); _dirpolylinelayer.collection.removeall(); catch ( Exception ex ) Text = ex.message; All Rights Reserved 63/123

64 private void OnAutoDisplayToolStripButtonClick( object sender, EventArgs e ) if ( _autodisplaytoolstripbutton.text.equals( "Auto Display" ) ) _autodisplaytoolstripbutton.text = "Not Auto Display"; _map.directionsservice.autodisplayrouteenable = false; else _autodisplaytoolstripbutton.text = "Auto Display"; _map.directionsservice.autodisplayrouteenable = true; catch ( Exception ex ) Text = ex.message; Run and play; you will see the following screen-cuts: All Rights Reserved 64/123

65 Figure Directions Map All Rights Reserved 65/123

66 Figure Mouse over end marker of a customized route after removing auto routes All Rights Reserved 66/123

67 Figure Mouse click on A marker of an auto route after removing customized routes 3.7 Autocomplete Find Address Map Create a Windows Forms Application project and name it FindAddressMap ; Drag Map onto the Form, name it as _map and set Dock to Fill; All Rights Reserved 67/123

68 3.7.3 Run the program; then enter University of Calgary in the text box, then use auto-complete to select the full address, then you will see the address is found and displayed as the Figure 3.7.1; Figure Autocomplete find address 3.8 Autocomplete Find Route Map and Driving Instructions Create a Windows Forms Application project and name it RouteInstructionsMap ; Rename Form1 to RouteInstructionsForm and then create the GUI as Figure 3.81.; All Rights Reserved 68/123

69 Figure Route Instructions Map GUI Design Code as followings: using System; using System.Drawing; using System.Linq; using System.Windows.Forms; using Gds.GoogleMap.Ultimate.Directions; using Gds.GoogleMap.Ultimate.Directions.Request; using Gds.GoogleMap.Ultimate.Directions.Results; All Rights Reserved 69/123

70 using Gds.GoogleMap.Ultimate.DisplaySettings; using Gds.GoogleMap.Ultimate.DisplaySettings.Markers; using Gds.GoogleMap.Ultimate.FeatureLayers; using Gds.GoogleMap.Ultimate.FeatureLayers.MarkerLayers; using Gds.GoogleMap.Ultimate.Features; using Gds.GoogleMap.Ultimate.Features.Markers; using Gds.GoogleMap.Ultimate.GeoData; using Gds.GoogleMap.Ultimate.MapEvents; using Gds.GoogleMap.Ultimate.Styles; namespace GdsGoogleMapUltimateSamples public partial class DirectionsForm : Form private TextPinLayer _dirmarkerlayer; private PolylineLayer _dirpolylinelayer; private readonly Timer _timer; public DirectionsForm() InitializeComponent(); _timer = new Timer Enabled = false, Interval = 500, ; _timer.tick += OnTimerTick; _map.mapinitialized += OnMapInitialized; _map.directionsservice.directionsservicecompleted += OnDirectionsServiceCompleted; _startovertoolstripbutton.click += OnStartOverToolStripButtonClick; _removeautoroutetoolstripbutton.click += OnRemoveAutoRouteToolStripButtonClick; _removecustomizedroutetoolstripbutton.click += OnRemoveCustomizedRouteToolStripButtonClick; _autodisplaytoolstripbutton.click += OnAutoDisplayToolStripButtonClick; private void OnTimerTick( object sender, EventArgs e ) _timer.enabled = false; var dirreq2 = new DirectionsRequest Origin = new LatLngLocation( , ), All Rights Reserved 70/123

71 ; Destination = new LatLngLocation( , ), TravelMode = TravelModeOption.Driving, _map.directionsservice.begindirectionsservice( dirreq2 ); private void OnMapInitialized( object sender, MapInitializedEventArgs e ) _dirmarkerlayer = _map.featurelayercollection.addtextpinlayer( "RouteMarkerLayer" ); _dirpolylinelayer = _map.featurelayercollection.addpolylinelayer( "RoutePolylineLayer" ); var displaysettings = _dirpolylinelayer.displaysettings; displaysettings.style = new LineDashStyle( DashStyleOption.Solid ); displaysettings.strokeweight = 12; displaysettings.strokeopacity = 0.6; _map.mapcenter = new LatLng( , ); _map.mapzoom = 12; _map.directionsservice.autodisplayrouteenable = _autodisplaytoolstripbutton.text.equals( "Auto Display" ); var dirreq1 = new DirectionsRequest Origin = new AddressLocation( "963 Queensland Drive SE, Calgary, AB Canada" ), Destination = new AddressLocation( "55 Midpark Rise SE, Calgary, AB, Canada" ), TravelMode = TravelModeOption.Driving, ; _map.directionsservice.begindirectionsservice( dirreq1 ); _timer.enabled = true; catch ( Exception ex ) Text = ex.message; private void OnDirectionsServiceCompleted( object sender, DirectionsServiceCompletedEventArgs e ) if ( e.status!= DirectionsStatusOption.Ok ) All Rights Reserved 71/123

72 return; foreach ( var route in e.result.routecollection ) foreach ( var leg in route.legcollection ) var stmk = new TextPin( leg.startlocation.lat, leg.startlocation.lng, leg.startaddress, "Start" ); _dirmarkerlayer.collection.add( stmk, DisplayModeOption.Normal, new TextPinDisplaySettings ScaleFactor = 1.0, new TextPinDisplaySettings ScaleFactor = 1.0 ); foreach ( var step in leg.stepcollection ) var pl = new Polyline( step.path.tolist() ); _dirpolylinelayer.collection.add( pl ); var edmk = new TextPin( leg.endlocation.lat, leg.endlocation.lng, leg.endaddress, "End" ); _dirmarkerlayer.collection.add( edmk, DisplayModeOption.Normal, new TextPinDisplaySettings FillColor = Color.Green, ScaleFactor = 1.0, new TextPinDisplaySettings ScaleFactor = 1.0 ); All Rights Reserved 72/123

73 catch ( Exception ex ) Text = ex.message; private void OnStartOverToolStripButtonClick( object sender, EventArgs e ) _dirmarkerlayer.collection.removeall(); _dirpolylinelayer.collection.removeall(); _dirmarkerlayer = null; _dirpolylinelayer = null; _map.startover(); catch ( Exception ex ) Text = ex.message; private void OnRemoveAutoRouteToolStripButtonClick( object sender, EventArgs e ) _map.directionsservice.removeallautodisplayedroutes(); catch ( Exception ex ) Text = ex.message; private void OnRemoveCustomizedRouteToolStripButtonClick( object sender, EventArgs e ) _dirmarkerlayer.collection.removeall(); _dirpolylinelayer.collection.removeall(); catch ( Exception ex ) Text = ex.message; All Rights Reserved 73/123

74 private void OnAutoDisplayToolStripButtonClick( object sender, EventArgs e ) if ( _autodisplaytoolstripbutton.text.equals( "Auto Display" ) ) _autodisplaytoolstripbutton.text = "Not Auto Display"; _map.directionsservice.autodisplayrouteenable = false; else _autodisplaytoolstripbutton.text = "Auto Display"; _map.directionsservice.autodisplayrouteenable = true; catch ( Exception ex ) Text = ex.message; Run the program and then input the start and end addresses, then click Find ; you will see the route is found and displayed on the map as well as the driving instructions in Figure 3.8.2; All Rights Reserved 74/123

75 Figure Autocomplete Found Route and Driving Instructions Please note that the driving instruction in the result of directions service from Google is HTML format. You will have to remove those tags if you don t want that format. All Rights Reserved 75/123

76 3.9 Heatmaps Map Create a Windows Forms Application project and name it HeatmapsMap ; Rename the Form1 to HeatmapsForm and create the GUI as Figure 3.9.1; Figure Heatmaps Map GUI Design Code as followings: using System; using System.Collections.Generic; All Rights Reserved 76/123

77 using System.Windows.Forms; using Gds.GoogleMap.Ultimate.DisplaySettings; using Gds.GoogleMap.Ultimate.FeatureLayers; using Gds.GoogleMap.Ultimate.Features; using Gds.GoogleMap.Ultimate.GeoData; using Gds.GoogleMap.Ultimate.GoogleData; using Gds.GoogleMap.Ultimate.MapEvents; namespace GdsGoogleMapUltimateSamples public partial class HeatmapsForm : Form private HeatmapLayer _heatmaplayer; private bool _toggle; public HeatmapsForm() InitializeComponent(); _toggle = false; _map.mapinitialized += OnMapInitialized; _visiblecheckbox.click += OnVisibleCheckBoxClick; _togglebutton.click += OnToggleButtonClick; _addheatmapbutton.click += OnAddHeatmapButtonClick; private void OnMapInitialized( object sender, MapInitializedEventArgs e ) _map.mapcenter = new LatLng( , ); _map.mapzoom = 12; _heatmaplayer = _map.featurelayercollection.addheatmaplayer( "HeatmapLayer" ); var wlatlngs = new List<WeightedLatLng> new WeightedLatLng( , , 1 ), new WeightedLatLng( , , 1 ), new WeightedLatLng( , , 1 ), new WeightedLatLng( , , 1 ), new WeightedLatLng( , , 1 ) ; _heatmaplayer.collection.add( new Heatmap( wlatlngs ) ); All Rights Reserved 77/123

78 _visiblecheckbox.checked = _heatmaplayer.visible; catch ( Exception ex ) Text = ex.message; private void OnVisibleCheckBoxClick( object sender, EventArgs e ) _heatmaplayer.visible = _visiblecheckbox.checked; catch ( Exception ex ) Text = ex.message; private void OnToggleButtonClick( object sender, EventArgs e ) if ( _toggle ) _toggle = false; _heatmaplayer.displaysettings = new HeatmapDisplaySettings(); else _toggle = true; var displaysettings = new HeatmapDisplaySettings Opacity = 0.8, Radius = 40, ; displaysettings.gradient.add( new Rgba( 0, 255, 255, 0.0 ) ); displaysettings.gradient.add( new Rgba( 0, 255, 255, 1.0 ) ); displaysettings.gradient.add( new Rgba( 0, 191, 255, 1.0 ) ); displaysettings.gradient.add( new Rgba( 0, 127, 255, 1.0 ) ); displaysettings.gradient.add( new Rgba( 0, 63, 255, 1.0 ) ); displaysettings.gradient.add( new Rgba( 0, 0, 255, 1.0 ) ); displaysettings.gradient.add( new Rgba( 0, 0, 223, 1.0 ) ); displaysettings.gradient.add( new Rgba( 0, 0, 191, 1.0 ) ); displaysettings.gradient.add( new Rgba( 0, 0, 159, 1.0 ) ); displaysettings.gradient.add( new Rgba( 0, 0, 127, 1.0 ) ); displaysettings.gradient.add( new Rgba( 63, 0, 91, 1.0 ) ); All Rights Reserved 78/123

79 displaysettings.gradient.add( new Rgba( 127, 0, 63, 1.0 ) ); displaysettings.gradient.add( new Rgba( 191, 0, 31, 1.0 ) ); displaysettings.gradient.add( new Rgba( 255, 0, 0, 1.0 ) ); _heatmaplayer.displaysettings = displaysettings; catch ( Exception ex ) Text = ex.message; private void OnAddHeatmapButtonClick( object sender, EventArgs e ) _addheatmapbutton.enabled = false; var wlatlngs = new List<WeightedLatLng> new WeightedLatLng( , , 2 ), new WeightedLatLng( , , 1 ), new WeightedLatLng( , , 1 ), new WeightedLatLng( , , 1 ), new WeightedLatLng( , , 1 ), new WeightedLatLng( , , 1 ), ; _heatmaplayer.collection.add( new Heatmap( wlatlngs ) ); catch ( Exception ex ) Text = ex.message; Run the program and you will see: All Rights Reserved 79/123

80 Figure Heatmaps Map Program First Run All Rights Reserved 80/123

81 Figure Heatmaps Map after clicking Toggle Display Settings and then Add Heatmap buttons 3.10 Mouse Events Map Create a Windows Forms Application project and name it MouseEventsMap ; Rename the Form1 to MouseEventsForm; drag and drop Map to the form, name it as _map and set its Dock property to Fill ; All Rights Reserved 81/123

82 Code as followings: using System; using System.Collections.Generic; using System.Windows.Forms; using Gds.GoogleMap.Ultimate.FeatureLayers; using Gds.GoogleMap.Ultimate.FeatureLayers.MarkerLayers; using Gds.GoogleMap.Ultimate.Features; using Gds.GoogleMap.Ultimate.Features.Markers; using Gds.GoogleMap.Ultimate.GeoData; using Gds.GoogleMap.Ultimate.MapEvents; namespace GdsGoogleMapUltimateSamples public partial class MouseEventsForm : Form private PolygonLayer _polygonlayer; private PolylineLayer _tmppolylinelayer; private DotPinLayer _tmpmarkerlayer; private List<LatLng> _latlngs; public MouseEventsForm() InitializeComponent(); _latlngs = new List<LatLng>(); _map.mapinitialized += OnMapInitialized; _map.mapmouseclick += OnMapMouseClick; private void OnMapInitialized( object sender, MapInitializedEventArgs e ) _map.autocompleteservice.findaddressenable = false; _map.autocompleteservice.drawfoundaddressenable = false; _polygonlayer = _map.featurelayercollection.addpolygonlayer( "Polygon Layer" ); _tmppolylinelayer = _map.featurelayercollection.addpolylinelayer( "Polyline Layer" ); _tmpmarkerlayer = _map.featurelayercollection.adddotpinlayer( "Maker Layer" ); catch ( Exception ex ) All Rights Reserved 82/123

83 Text = ex.message; private void OnMapMouseClick( object sender, MapMouseClickEventArgs e ) switch ( e.button ) case MapMouseButtonOption.Left: if ( _latlngs.count <= 0 ) _latlngs.add( e.location ); _tmpmarkerlayer.collection.add( new DotPin( e.location.lat, e.location.lng, " " ) ); else _latlngs.add( e.location ); _tmpmarkerlayer.collection.add( new DotPin( e.location.lat, e.location.lng, " " ) ); break; var latlnglst = new List<LatLng> new LatLng( _latlngs[ _latlngs.count -2 ] ), new LatLng( _latlngs[ _latlngs.count -1 ] ), ; _tmppolylinelayer.collection.add( new Polyline( latlnglst ) ); case MapMouseButtonOption.Right: _polygonlayer.collection.add( new Polygon( _latlngs ) ); _latlngs = new List<LatLng>(); _tmpmarkerlayer.collection.removeall(); _tmppolylinelayer.collection.removeall(); break; All Rights Reserved 83/123

84 catch ( Exception ex ) Text = ex.message; Run the program and do couple mouse left clicks to create vertices of a polygon as Figure ; Figure Add Vertices to Polygon All Rights Reserved 84/123

85 Do a mouse right click to end the edition so a polygon will be drawn as Figure Figure New Polygon is added on the map 3.11 Elevations Map Create a Windows Forms Application project and name it ElevationsMap ; Rename Form1 to ElevationsForm; create the GUI as Figure ; All Rights Reserved 85/123

86 Figure Elevations Map GUI Design Code as followings: using System; using System.Windows.Forms; using Gds.GoogleMap.Ultimate; using Gds.GoogleMap.Ultimate.Elevation; using Gds.GoogleMap.Ultimate.GeoData; using Gds.GoogleMap.Ultimate.MapEvents; All Rights Reserved 86/123

87 namespace GdsGoogleMapUltimateSamples public partial class ElevationsForm : Form private readonly Timer _timer; public ElevationsForm() InitializeComponent(); _timer = new Timer Interval = 3000, Enabled = false ; _timer.tick += OnTimerTick; _map.mapinitialized += OnMapInitialized; _map.elevationservice.elevationservicecompleted += OnElevationServiceCompleted; private void UpdateMessage( string message ) _listbox.items.add( message ); private void OnTimerTick( object sender, EventArgs e ) _timer.enabled = false; UpdateMessage( "Path Elevation" ); var pathrequest = new PathElevationRequest(); pathrequest.pathcollection.add( new LatLng( , ) ); pathrequest.pathcollection.add( new LatLng( , ) ); pathrequest.pathcollection.add( new LatLng( , ) ); pathrequest.pathcollection.add( new LatLng( , ) ); pathrequest.pathcollection.add( new LatLng( 36.34, ) ); pathrequest.pathcollection.add( new LatLng( 36.24, ) ); pathrequest.samplecount = 256; _map.elevationservice.beginelevationservice( pathrequest ); catch ( Exception ex ) Text = ex.message; All Rights Reserved 87/123

88 private void OnMapInitialized( object sender, MapInitializedEventArgs e ) UpdateMessage( "Location Elevation" ); _map.autocompleteservice.findaddressenable = false; _map.autocompleteservice.drawfoundaddressenable = false; _map.mapcenter = new LatLng( , ); _map.maptypeid = MapTypeIdOption.Terrain; var locationrequest = new LocationElevationRequest(); locationrequest.locationcollection.add( new LatLng( , ) ); locationrequest.locationcollection.add( new LatLng( , ) ); _map.elevationservice.beginelevationservice( locationrequest ); _timer.enabled = true; catch ( Exception ex ) Text = ex.message; private void OnElevationServiceCompleted( object sender, ElevationServiceCompletedEventArgs e ) if ( e.status!= ElevationStatusOption.Ok ) UpdateMessage( "Failed to get elevation" ); foreach ( var result in e.results ) var elevationstr = ( result.elevation == null? "N/A" : ( ( double ) result.elevation ).ToString( "0.00" ) ); var resolutionstr = ( result.resolution == null? "N/A" : ( ( double ) result.resolution ).ToString( "0.00" ) ); UpdateMessage( "(" + result.location.lat.tostring( " " ) + ", " + result.location.lng.tostring( " " ) + ") Elevation: " + elevationstr + " Resolution: " + resolutionstr ); All Rights Reserved 88/123

89 Compile, run and play to see the following screen cut: Figure Elevations Map Program first run 3.12 Geome Map Create a Windows Forms Application project and name it GeomeMap ; All Rights Reserved 89/123

90 Rename Form1 to GeomeForm; add one Table Layout Panel (_tablelayoutpanel) and one List Box (_listbox); Add Map and name it as _map; Code as followings: using System; using System.Collections.Generic; using System.Drawing; using System.Windows.Forms; using Gds.GoogleMap.Ultimate.DisplaySettings; using Gds.GoogleMap.Ultimate.DisplaySettings.Markers; using Gds.GoogleMap.Ultimate.Features; using Gds.GoogleMap.Ultimate.Features.Markers; using Gds.GoogleMap.Ultimate.GeoData; using Gds.GoogleMap.Ultimate.MapEvents; namespace GdsGoogleMapUltimateSamples public partial class GeomeForm : Form private Polygon _polygon; public GeomeForm() InitializeComponent(); _map.mapinitialized += OnMapInitialized; _map.mapmouseclick += OnMapMouseClick; _map.mappolygonmouseclick += OnMapPolygonMouseClick; private void CheckLocation( LatLng latlng ) var str = _map.geomeservice.containslocation( latlng, _polygon )? "You click inside the Polygon!" : "You click outside the Polygon!"; MessageBox.Show( str ); catch ( Exception ex ) Text = ex.message; private void OnMapInitialized( object sender, MapInitializedEventArgs e ) All Rights Reserved 90/123

91 _map.mapzoom = 3; _map.mapcenter = new LatLng( 34, ); var markerlayer = _map.featurelayercollection.addcharpinlayer( "Marker Layer" ); markerlayer.collection.add( new CharPin( , , "", "A" ), DisplayModeOption.Normal, new CharPinDisplaySettings FillColor = Color.Orange,, new CharPinDisplaySettings() ); markerlayer.collection.add( new CharPin( , 2.352, "", "B" ), DisplayModeOption.Normal, new CharPinDisplaySettings FillColor = Color.LightGreen,, new CharPinDisplaySettings() ); var polylinelayer = _map.featurelayercollection.addpolylinelayer( "Polyline Layer" ); var lst = new List<LatLng> new LatLng( , ), new LatLng( , ) ; polylinelayer.collection.add( new Polyline( lst ), DisplayModeOption.Normal, new PolylineDisplaySettings StrokeColor = Color.Blue, StrokeWeight = 4,, new PolylineDisplaySettings() ); _listbox.items.add( "Origin: (" + lst [ 0 ].Lat + ", " + lst [ 0 ].Lng + ")" ); All Rights Reserved 91/123

92 _listbox.items.add( "Destination: (" + lst [ 1 ].Lat + ", " + lst [ 1 ].Lng + ")" ); _listbox.items.add( "Heading: " + _map.geomeservice.computeheading( lst [ 0 ], lst [ 1 ] ).ToString( "0.00" ) + " (deg)" ); _listbox.items.add( "Distance: " + _map.geomeservice.computedistancebetween( lst [ 0 ], lst [ 1 ] ).ToString( "0.00" ) + " (m)" ); var polygonlayer = _map.featurelayercollection.addpolygonlayer( "Polygon Layer" ); var latlngs = new List<LatLng> new LatLng( , ), new LatLng( , ), new LatLng( , ), new LatLng( , ), ; _polygon = new Polygon( latlngs ); polygonlayer.collection.add( _polygon ); catch ( Exception ex ) Text = ex.message; private void OnMapMouseClick( object sender, MapMouseClickEventArgs e ) CheckLocation( e.location ); private void OnMapPolygonMouseClick( object sender, MapPolygonMouseClickEventArgs e ) CheckLocation( e.location ); Compile and run to see the following screen cut: All Rights Reserved 92/123

93 Figure Compute heading and distance between two locations Mouse click inside and outside the polygon, you will see message boxes popup as Figure and Figure All Rights Reserved 93/123

94 Figure Mouse click inside the Polygon All Rights Reserved 94/123

95 Figure Mouse click outside the Polygon 3.13 Places Map Create a Windows Forms Application project and name it PlacesMap ; Rename Form1 to PlacesForm, add Map, name it as _map and set Dock to Fill ; Code as followings: using System; using System.Collections.Generic; All Rights Reserved 95/123

96 using System.Drawing; using System.Windows.Forms; using Gds.GoogleMap.Ultimate.DisplaySettings; using Gds.GoogleMap.Ultimate.DisplaySettings.Markers; using Gds.GoogleMap.Ultimate.FeatureLayers.MarkerLayers; using Gds.GoogleMap.Ultimate.Features.Markers; using Gds.GoogleMap.Ultimate.GeoData; using Gds.GoogleMap.Ultimate.MapEvents; using Gds.GoogleMap.Ultimate.Places; using Gds.GoogleMap.Ultimate.Places.Result; using Gds.GoogleMap.Ultimate.Places.Search; using Gds.GoogleMap.Ultimate.Places.Search.NearbySearch; using Gds.GoogleMap.Ultimate.Places.Search.RadarSearch; using Gds.GoogleMap.Ultimate.Places.Search.TextSearch; namespace GdsGoogleMapUltimateSamples public partial class PlacesForm : Form private enum SearchTypeOption Idle, Nearby, Radar, Text, private SearchTypeOption _searchtype; private readonly NearbySearchLocationRadiusRequest _nearbyrequest; private readonly RadarSearchLocationRadiusRequest _radarrequest; private readonly TextSearchLocationRadiusRequest _textrequest; private readonly Timer _timer; private CharPinLayer _markerlayer; public PlacesForm() InitializeComponent(); _nearbyrequest = new NearbySearchLocationRadiusRequest Location = new LatLng( , ), Keyword = "park", Radius = 500, ; All Rights Reserved 96/123

97 _radarrequest = new RadarSearchLocationRadiusRequest Location = new LatLng( , ), Radius = 500, Types = new List<PlaceTypeOption> PlaceTypeOption.CarRental ; _textrequest = new TextSearchLocationRadiusRequest Location = new LatLng( , ), Query = "Travel", Radius = 500, ; _timer = new Timer Interval = 2500, Enabled = false, ; _timer.tick += OnTimerTick; _map.mapinitialized += OnMapInitialized; _map.mapcharpinmousemove += OnMapCharPinMouseMove; _map.mapcharpinmouseleave += OnMapCharPinMouseLeave; _map.mapcharpinmouseclick += OnMapCharPinMouseClick; _map.placesservice.placesearchservicecompleted += OnPlaceSearchServiceCompleted; _map.placesservice.placedetailsservicecompleted += OnPlaceDetailsServiceCompleted; private void OnTimerTick( object sender, EventArgs e ) switch ( _searchtype ) case SearchTypeOption.Nearby: _searchtype = SearchTypeOption.Radar; _map.placesservice.beginplacessearchservice( _radarrequest ); _timer.enabled = true; break; case SearchTypeOption.Radar: _searchtype = SearchTypeOption.Text; _map.placesservice.beginplacessearchservice( _textrequest ); _timer.enabled = true; break; All Rights Reserved 97/123

98 case SearchTypeOption.Text: _searchtype = SearchTypeOption.Idle; _timer.enabled = false; break; default: _timer.enabled = false; break; private void OnMapInitialized( object sender, MapInitializedEventArgs e ) _map.mapcenter = new LatLng( , ); _map.mapzoom = 16; _markerlayer = _map.featurelayercollection.addcharpinlayer( "Result" ); _searchtype = SearchTypeOption.Nearby; _map.placesservice.beginplacessearchservice( _nearbyrequest ); _timer.enabled = true; private void OnPlaceSearchServiceCompleted( object sender, PlaceSearchServiceCompletedEventArgs e ) if ( e.status!= PlaceServiceStatusOption.Ok ) return; switch ( _searchtype ) case SearchTypeOption.Nearby: var ds = new CharPinDisplaySettings CharColor = Color.DarkBlue, FillColor = Color.Yellow ; var hds = new CharPinDisplaySettings CharColor = Color.DarkBlue, FillColor = Color.LightGreen, ; All Rights Reserved 98/123

99 foreach ( var result in e.results ) _markerlayer.collection.add( new CharPin( result.geome.location.lat, result.geome.location.lng, result.name, "N" ), DisplayModeOption.Normal, ds, hds ); break; case SearchTypeOption.Radar: var ds = new CharPinDisplaySettings CharColor = Color.DarkBlue, FillColor = Color.Orange ; var hds = new CharPinDisplaySettings CharColor = Color.DarkBlue, FillColor = Color.LightGreen, ; foreach ( var result in e.results ) _markerlayer.collection.add( new CharPin( result.geome.location.lat, result.geome.location.lng, result.placeid, "R" ), DisplayModeOption.Normal, ds, hds ); break; case SearchTypeOption.Text: var ds = new CharPinDisplaySettings CharColor = Color.DarkBlue, FillColor = Color.Pink ; var hds = new CharPinDisplaySettings CharColor = Color.DarkBlue, FillColor = Color.LightGreen, ; foreach ( var result in e.results ) _markerlayer.collection.add( new CharPin( result.geome.location.lat, All Rights Reserved 99/123

100 break; result.geome.location.lng, result.name, "T" ), DisplayModeOption.Normal, ds, hds ); private void OnMapCharPinMouseMove( object sender, MapMarkerMouseMoveEventArgs e ) _markerlayer.collection.setdisplaymode( e.markerindex, DisplayModeOption.Highlight ); private void OnMapCharPinMouseLeave( object sender, MapMarkerMouseLeaveEventArgs e ) _markerlayer.collection.setdisplaymode( e.markerindex, DisplayModeOption.Normal ); private void OnPlaceDetailsServiceCompleted( object sender, PlaceDetailsServiceCompletedEventArgs e ) if ( e.status!= PlaceServiceStatusOption.Ok ) return; MessageBox.Show( e.result.formattedaddress ); private void OnMapCharPinMouseClick( object sender, MapMarkerMouseClickEventArgs e ) var charpin = _markerlayer.collection [ e.markerindex ] as CharPin; if ( charpin == null ) return; if ( charpin.char!= "R" ) MessageBox.Show( "Only Radar Search can perform details request!" ); return; var pdrequest = new PlaceDetailsRequest All Rights Reserved 100/123

101 ; PlaceId = charpin.description _map.placesservice.beginplacedetailsservice( pdrequest ); Compile and run to see the following screen cuts: Figure Search results displayed as markers on the map All Rights Reserved 101/123

102 Figure Description shows up when user hovers mouse over a marker All Rights Reserved 102/123

103 Figure Message Box of Place Details when clicking on marker from Radar Search 3.14 Multithread Map Create a Windows Forms Application project and name it MultithreadMap ; Rename Form1 to MultithreadForm, addd Map, name it as _map and set Dock to Fill ; Code as followings: using System; using System.Drawing; All Rights Reserved 103/123

104 using System.Threading; using System.Threading.Tasks; using System.Windows.Forms; using Gds.GoogleMap.Ultimate.DisplaySettings; using Gds.GoogleMap.Ultimate.DisplaySettings.Markers; using Gds.GoogleMap.Ultimate.FeatureLayers.MarkerLayers; using Gds.GoogleMap.Ultimate.Features.Markers; using Gds.GoogleMap.Ultimate.GeoData; using Gds.GoogleMap.Ultimate.MapEvents; namespace GdsGoogleMapUltimateSamples public partial class MultithreadForm : Form private delegate void AddMarkersDelegate(); private readonly AddMarkersDelegate _addmarker; private DotPinLayer _dotpinlayer; private IconPinLayer _iconpinlayer; private TextPinLayer _textpinlayer; private readonly CancellationTokenSource _cancel; private readonly Task _task; public MultithreadForm() InitializeComponent(); _addmarker = AddMarkers; _map.mapinitialized += OnMapInitialized; _map.mapdotpinmousemove += OnMapDotPinMouseMove; _map.mapdotpinmouseleave += OnMapDotPinMouseLeave; _map.mapiconpinmousemove += OnMapIconPinMouseMove; _map.mapiconpinmouseleave += OnMapIconPinMouseLeave; _map.maptextpinmousemove += OnMapTextPinMouseMove; _map.maptextpinmouseleave += OnMapTextPinMouseLeave; FormClosing += MultithreadFormFormClosingEventHandler; _cancel = new CancellationTokenSource(); _task = new Task( Task, _cancel.token ); All Rights Reserved 104/123

105 private void OnMapDotPinMouseMove( object sender, MapMarkerMouseMoveEventArgs e ) _dotpinlayer.collection.setdisplaymode( e.markerindex, DisplayModeOption.Highlight ); private void OnMapDotPinMouseLeave( object sender, MapMarkerMouseLeaveEventArgs e ) _dotpinlayer.collection.setdisplaymode( e.markerindex, DisplayModeOption.Normal ); private void OnMapTextPinMouseMove( object sender, MapMarkerMouseMoveEventArgs e ) _textpinlayer.collection.setdisplaymode( e.markerindex, DisplayModeOption.Highlight ); private void OnMapTextPinMouseLeave( object sender, MapMarkerMouseLeaveEventArgs e ) _textpinlayer.collection.setdisplaymode( e.markerindex, DisplayModeOption.Normal ); private void OnMapIconPinMouseMove( object sender, MapMarkerMouseMoveEventArgs e ) _iconpinlayer.collection.setdisplaymode( e.markerindex, DisplayModeOption.Highlight ); private void OnMapIconPinMouseLeave( object sender, MapMarkerMouseLeaveEventArgs e ) _iconpinlayer.collection.setdisplaymode( e.markerindex, DisplayModeOption.Normal ); private void AddMarkers() _dotpinlayer.collection.add( new DotPin( , , "RBC Bank\r\nBridlewood Shopping Centre\r\n th St SW, Calgary, AB\r\nPhone: (403) \r\nTransit #180" ) ); All Rights Reserved 105/123

106 _iconpinlayer.collection.add( new IconPin( , , "RBC Bank\r\nGates Of Walden\r\n151 Walden Gate SE, Calgary, AB\r\nPhone: (403) \r\nTransit #1436", IconPinOption.BankDollar ) ); _textpinlayer.collection.add( new TextPin( , , "RBC Bank\r\nDeer Valley Market Place\r\n1221 Canyon Meadows Dr SE, Calgary, AB\r\nPhone: (403) \r\nTransit #629", "RBC" ), DisplayModeOption.Normal, new TextPinDisplaySettings FontSize = 9, ScaleFactor = 0.8,, new TextPinDisplaySettings FontSize = 9, ScaleFactor = 0.8, FillColor = Color.Yellow, ); _iconpinlayer.collection.add( new IconPin( , , "RBC Bank\r\nBonavista\r\n755 Lake Bonavista Dr SE, Calgary, AB\r\nPhone: (403) \r\nTransit #9099", IconPinOption.BankIntl ), DisplayModeOption.Normal, new IconPinDisplaySettings PinStyle = PinStyleOption.Star, new IconPinDisplaySettings PinStyle = PinStyleOption.Star, FillColor = Color.Green, ); _iconpinlayer.collection.add( new IconPin( , , "Moving Taxi", IconPinOption.Taxi ) ); private void Task() // simulate long background process All Rights Reserved 106/123

107 var st = DateTime.Now; while(! _cancel.iscancellationrequested ) Thread.Sleep( 20 ); var et = DateTime.Now; if ( ( et - st ).TotalSeconds > 30 ) break; if (! _cancel.iscancellationrequested && IsHandleCreated ) BeginInvoke( _addmarker ); private void OnMapInitialized( object sender, MapInitializedEventArgs e ) _map.mapcenter = new LatLng( , ); _map.mapzoom = 12; _map.autocompleteservice.findaddressenable = false; _map.autocompleteservice.drawfoundaddressenable = false; _map.maptypecontrolenable = false; _dotpinlayer = _map.featurelayercollection.adddotpinlayer( "DotPinLayer" ); _iconpinlayer = _map.featurelayercollection.addiconpinlayer( "IconPinLayer" ); _textpinlayer = _map.featurelayercollection.addtextpinlayer( "TextPinLayer" ); _task.start(); catch ( Exception ex ) Text = ex.message; private void MultithreadFormFormClosingEventHandler( object sender, FormClosingEventArgs e ) _cancel.cancel(); All Rights Reserved 107/123

108 Compile and run the program; Figure Multithread Map First Run Wait 30 seconds and then you will see markers show up on the map; All Rights Reserved 108/123

109 Figure Markers added to the map from non-ui thread Mouse mover over a marker to see it is highlighted and description show up. All Rights Reserved 109/123

110 Figure Marker is highlighted and description is shown 3.15 WPF Map Create a WPF Application project and name it WpfMap ; Modify MainWindow.xaml as following: <Window x:class="wpfmap.mainwindow" xmlns=" xmlns:x=" Title="WPF Map" Height="650" Width="900"> All Rights Reserved 110/123

111 <Grid> <WindowsFormsHost Name="_windowsFormsHost" /> </Grid> </Window> Code as followings: using System; using System.Drawing; using System.Windows; using Gds.GoogleMap.Ultimate; using Gds.GoogleMap.Ultimate.DisplaySettings; using Gds.GoogleMap.Ultimate.DisplaySettings.Markers; using Gds.GoogleMap.Ultimate.FeatureLayers.MarkerLayers; using Gds.GoogleMap.Ultimate.Features.Markers; using Gds.GoogleMap.Ultimate.GeoData; using Gds.GoogleMap.Ultimate.MapEvents; namespace WpfMap /// <summary> /// Interaction logic for MainWindow.xaml /// </summary> public partial class MainWindow : Window private readonly Map _map; private DotPinLayer _dotpinlayer; private IconPinLayer _iconpinlayer; private TextPinLayer _textpinlayer; public MainWindow() InitializeComponent(); _map = new Map GdsGoogleMapLicenseKey = "Your License Key" ; _windowsformshost.child = _map; _map.mapinitialized += OnMapInitialized; _map.mapdotpinmousemove += OnMapDotPinMouseMove; _map.mapdotpinmouseleave += OnMapDotPinMouseLeave; _map.mapiconpinmousemove += OnMapIconPinMouseMove; _map.mapiconpinmouseleave += OnMapIconPinMouseLeave; All Rights Reserved 111/123

112 _map.maptextpinmousemove += OnMapTextPinMouseMove; _map.maptextpinmouseleave += OnMapTextPinMouseLeave; private void OnMapInitialized( object sender, MapInitializedEventArgs e ) _map.mapcenter = new LatLng( , ); _map.mapzoom = 12; _map.autocompleteservice.findaddressenable = false; _map.autocompleteservice.drawfoundaddressenable = false; _map.maptypecontrolenable = false; _dotpinlayer = _map.featurelayercollection.adddotpinlayer( "DotPinLayer" ); _iconpinlayer = _map.featurelayercollection.addiconpinlayer( "IconPinLayer" ); _textpinlayer = _map.featurelayercollection.addtextpinlayer( "TextPinLayer" ); _dotpinlayer.collection.add( new DotPin( , , "RBC Bank\r\nBridlewood Shopping Centre\r\n th St SW, Calgary, AB\r\nPhone: (403) \r\nTransit #180" ) ); _iconpinlayer.collection.add( new IconPin( , , "RBC Bank\r\nGates Of Walden\r\n151 Walden Gate SE, Calgary, AB\r\nPhone: (403) \r\nTransit #1436", IconPinOption.BankDollar ) ); _iconpinlayer.collection.add( new IconPin( , , "RBC Bank\r\nBonavista\r\n755 Lake Bonavista Dr SE, Calgary, AB\r\nPhone: (403) \r\nTransit #9099", IconPinOption.BankIntl ), DisplayModeOption.Normal, new IconPinDisplaySettings PinStyle = PinStyleOption.Star All Rights Reserved 112/123

113 , new IconPinDisplaySettings PinStyle = PinStyleOption.Star, FillColor = Color.LightGreen, ); _iconpinlayer.collection.add( new IconPin( , , "Moving Taxi", IconPinOption.Taxi ) ); _textpinlayer.collection.add( new TextPin( , , "RBC Bank\r\nDeer Valley Market Place\r\n1221 Canyon Meadows Dr SE, Calgary, AB\r\nPhone: (403) \r\nTransit #629", "RBC" ), DisplayModeOption.Normal, new TextPinDisplaySettings FontSize = 9, ScaleFactor = 0.8,, new TextPinDisplaySettings FontSize = 9, ScaleFactor = 0.8, FillColor = Color.Yellow, ); catch ( Exception ex ) Title = ex.message; private void OnMapDotPinMouseMove( object sender, MapMarkerMouseMoveEventArgs e ) _dotpinlayer.collection.setdisplaymode( e.markerindex,displaymodeopt ion.highlight ); catch ( Exception ex ) Title = ex.message; All Rights Reserved 113/123

114 private void OnMapDotPinMouseLeave( object sender, MapMarkerMouseLeaveEventArgs e ) _dotpinlayer.collection.setdisplaymode( e.markerindex, DisplayModeOption.Normal ); catch ( Exception ex ) Title = ex.message; private void OnMapIconPinMouseMove( object sender, MapMarkerMouseMoveEventArgs e ) _iconpinlayer.collection.setdisplaymode( e.markerindex, DisplayModeOption.Highlight ); catch ( Exception ex ) Title = ex.message; private void OnMapIconPinMouseLeave( object sender, MapMarkerMouseLeaveEventArgs e ) _iconpinlayer.collection.setdisplaymode( e.markerindex, DisplayModeOption.Normal ); catch ( Exception ex ) Title = ex.message; private void OnMapTextPinMouseMove( object sender, MapMarkerMouseMoveEventArgs e ) _textpinlayer.collection.setdisplaymode( e.markerindex, DisplayModeOption.Highlight ); catch ( Exception ex ) All Rights Reserved 114/123

115 Title = ex.message; private void OnMapTextPinMouseLeave( object sender, MapMarkerMouseLeaveEventArgs e ) _textpinlayer.collection.setdisplaymode( e.markerindex, DisplayModeOption.Normal ); catch ( Exception ex ) Title = ex.message; Compile and run the program: All Rights Reserved 115/123

116 Figure WPF Map First Run Highlight a maker and show its description: All Rights Reserved 116/123

117 Figure Highlighted marker and its description All Rights Reserved 117/123