Click here to Skip to main content
65,938 articles
CodeProject is changing. Read more.
Articles
(untagged)

GMaps v1.1.12 - Google Maps/Routing/StreetView All-in-1

0.00/5 (No votes)
10 Aug 2016 3  
Don't care about Google Maps/Routing/StreetView programming. This Control gives your WinForms applications the power of Google Maps API v3

<img height="704" src="849894/GMaps1.png" width="600" />

Introduction

All our management applications have tables and management forms, for companies, clients, customers, suppliers, employees, etc. For each one of these entities, we usually keep record of a large amount of information, including its location (address, city, etc). And with current resources in terms of geolocation, it's generally useful to record the geographic coordinates of that location (latitude and longitude), sometimes a great accuracy is needed. Thus we can see the locations on the map, note the details at ground level, and calculate routes, particularly between our location and the location of these entities, and vice versa. This Control helps us to implement a global solution for all these tasks.

The Control consists of a pair of files, both making use of the Google Maps API v3:

  • GMaps.dll - Written in VB.NET, it can be incorporated in any WinForms application.
  • GMaps.html – HTML with JavaScript code, is required for Maps display tasks, and should be placed in the Application Startup Folder.

Requirements: The minimum screen resolution is 1360x768

Notice

Problem: This Control stopped working properly.

Since Dec.2015, Google Maps JavaScript API applications require authentication, and this program stopped working properly (in "Route" Views, Directions blue line and Text Directions Panel are not shown), because the HTML/JavaScript file runs under the control of the Visual Studio's WebBrowser, which is, by default, Internet Explorer version 7, and that's not enough for the requirements.

See Article WebBrowser IE Emulation for Google Maps JavaScript API Key Requirement, which automates a solution, in two ways:

  • For VB Project (adding a Class) - without a DLL.
  • For other languages (VB included) - with a DLL.

Using the Code

Download the .ZIP file.

The .ZIP file includes GMaps_Documentation.PDF, which fully describes the Control.

Control's Source and Test projects are provided in Visual Studio 2008 version, however upgradable by later versions.

The Control's DLL is located at ...\GMaps_All-in-1\GMaps\bin\Release\GMaps.dll

  • Add it to your Toolbox, right-clicking the Toolbox area -> Choose Items… -> Browse -> select the DLL
  • In the Solution Explorer, select your Project, open My Project -> References -> Add… -> Browse -> select GMaps
  • Drag the Control (GMaps) from the Toolbox to your Form. Give it a small size, it can be 0;0

The HTML file is located at ...\GMaps_All-in-1\GMaps\GMaps.html

  • Copy it to the Application Startup Folder (either IDE project, either Real application).

When starting the provided solution, if you receive the message 'A project with an Output Type of Class Library cannot be started directly', then:
Go to the Solution Explorer, select GMaps_Test Project, right-click mouse button and click Set as StartUp

Control's usage

Basics

1) The Control works with 3 Types of Entities/Points/Markers:

  • Type 1 ("MyPlace") - The owner’s location, company, office, etc. Can be the start or the end of a Route.
  • Type 2 ("Place2") - The kind of Entity being managed (company/client/customer/supplier/employee). Can be the start or the end of a Route.
  • Type 0 (WayPoint) - Up to 8 locations where to pass by, from start to end of a Route operation.

2) Basically, the Control is used to convert the Address element(s) of the Entity being treated into Coordinates. This can be achieved without loading the Control, simply by calling a Method.

3) But by loading the Control, feeding it previously (or not) with location elements, allows you to perform the following operations (keeping track of all Location's Definition and Adjustment results):

  • View location(s) on a map (Map or Satellite views)
  • Visually adjust any location(s)
  • Calculate a Route between two locations, optionally with waypoints
  • View the Entity’s location at ground level (StreetView)
  • Enter Address element(s) and define location(s) outside your Application Forms

Views

<img height="32" src="849894/GMaps2.png" width="600" />

1) Google Maps view

<img height="319" src="849894/GMaps3.png" width="600" />

View, Edit and Adjust locations: "MyPlace", "Place2", WayPoint(s)

Dragging Markers will update the Internal Location Table

To Add, Edit or Remove locations, use the Details panel:

<img height="21" src="849894/GMaps4.png" width="94" />

<img height="40" src="849894/GMaps11.png" width="600" />

To quickly Adjust "Place2":

<img height="21" src="849894/GMaps5.png" width="143" />

<img height="319" src="849894/GMaps12.png" width="600" />

When done, to quickly rebound the map:

<img height="21" src="849894/GMaps6.png" width="90" />

2) Route views

<img height="319" src="849894/GMaps7.png" width="600" />

Draws a route between two points, including eventual waypoint(s), and displays textual instructions

Dragging start point, end point or waypoints will not update the Internal Locations Table

To change Route options, use the Route options panel:

<img height="21" src="849894/GMaps4.png" width="94" />

<img height="39" src="849894/GMaps9.png" width="600" />

In all cases, when you Check/Uncheck a button/box, the Directions Service is called and the the Map and Directions display are redrawn

3) StreetView view

<img height="325" src="849894/Sv6.png" width="600" />

View "Place2" location at ground level

To change StreetView options, use the Point of view options panel:

<img height="21" src="849894/GMaps8.png" width="94" />

<img height="36" src="849894/GMaps10.png" width="600" />

In both cases, after sliding the cursor, when you release the mouse, the view is redrawn

Brief description of the Control's own Properties, Methods and Event

For full description, syntax, examples, results and tips, see GMaps_Documentation.PDF and the Demo source code

Properties

  • MyPlace - Redefines the Tag which shortly describes the owner’s Location/Company/Office, etc
  • Place2 - Redefines the Tag which shortly describes the kind of Entity being managed (company/ client/ customer/ supplier/ employee)

Methods

  • Clear - Clears all Location information stored in the Control
  • Coord2DMS - Converts a Coordinate from Decimal Degrees format to Degreeso Minutes’ Seconds’’ format
  • GeoCoding - Given one or more text Address element(s), returns a String Array containing the Geocoding Results
  • GeoReverse - Given a Latitude and a Longitude, returns a String Array containing the Geocoding Results
  • LoadGMaps - The control is passed to a specific instance of GMaps
  • LoadPlace - Loads a Location (MyPlace, Place2 or a WayPoint) into the Control
  • PrepFullAddr - Prepares a String for GeoCoding purpose
  • SetCenter - Overrides the predefined Initial Map Center
  • Str2DSCulture - Given a Coordinate, replaces it Decimal Separator (Dot or Comma) with the Current Culture Decimal Separator
  • Str2DSDot - Given a Coordinate, replaces it Decimal Separator (Dot or Comma) with Dot

Event

  • GeoResults - Occurs whenever a Location is Defined or Adjusted (in Google Maps view), and the Geocoding result Status is “OK”

The HTML/Javascript file

Is required for Maps display tasks, and should be placed in the Application Startup Folder (either IDE project, either Real application)

4 google.maps classes are used:

  • Geocoder – In Google Maps view. Function AddMarker receives data from the Control’s internal Locations table and creates Markers, which, when Adjusted/dragged, will send feedback to the Control. Related resources: var Map1, div mapPanel – 100%
  • DirectionsService / DirectionsRenderer – In Route views. Function calcRoute picks the Marker’s positions, sets the start and end of the route and eventual waypoints, draws the appropriate Route (var Map2, div routePanel – 69.7%) and writes textual instructions (div dirPanel – 30%), according to the parameters received from the Control
  • StreetViewPanorama – In StreetView view. Function initStView picks the Marker’s position of "Place2" and draws the Map (var Map3, div sviewPanel – 49.8%) and Panorama (div panorPanel – 50%), according to the parameters received from the Control

The demo Form

Provided in GMaps_Test Project, to test the Control's features.

<img height="500" src="849894/GMaps13.png" width="600" />

History

04.Dec.2014 - First posted

29.Jun.2016 - Notice: Placing the Component on the Toolbox

If (within a new Project) you right-click the Toolbox -> Choose Items... -> Browse (...\...\GMaps.dll) -> Open , and you receive a message [There are no components in '...\...\Gmaps.dll' that can be placed on the toolbox. ], then,

  • With File Explorer, Open the Folder where GMaps.dll resides.
  • Drag GMaps.dll and Drop it into the tab (in Toolbox) you want to place it.

10.Aug.2016 - Problem: This Control stopped working properly.

See Notice in Introduction

License

This article has no explicit license attached to it but may contain usage terms in the article text or the download files themselves. If in doubt please contact the author via the discussion board below.

A list of licenses authors might use can be found here