Click here to Skip to main content
15,867,895 members
Articles / Web Development / HTML

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

Rate me:
Please Sign up or sign in to vote.
4.85/5 (76 votes)
10 Aug 2016CPOL6 min read 130.4K   9.4K   125   58
Don't care about Google Maps/Routing/StreetView programming. This Control gives your WinForms applications the power of Google Maps API v3

Image 1

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

Image 2

1) Google Maps view

Image 3

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:

Image 4

Image 5

To quickly Adjust "Place2":

Image 6

Image 7

When done, to quickly rebound the map:

Image 8

2) Route views

Image 9

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:

Image 10

Image 11

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

Image 12

View "Place2" location at ground level

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

Image 13

Image 14

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.

Image 15

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, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


Written By
Retired
Portugal Portugal
Working on computers since Mar,6 1969
Languages: RPN, Fortran, COBOL, Univac 1100 Meta-assembler, Basic, Z80 Assembly, 8086 Assembly, IBM Assembler (360/370, 38xx, 43xx), Clipper, ANSI C, SQL, Visual Basic, VBA, VB.NET
Lately, some HTML, JavaScript, C#
Actually retired, but still developing (for pleasure).

Comments and Discussions

 
Questionupdate map to new Pin
Member 1161173926-Jan-17 23:05
Member 1161173926-Jan-17 23:05 
AnswerRe: update map to new Pin
OriginalGriff26-Jan-17 23:29
mveOriginalGriff26-Jan-17 23:29 
AnswerRe: update map to new Pin
Avelino Ferreira2-Feb-17 1:47
professionalAvelino Ferreira2-Feb-17 1:47 
QuestionVS2015Express Pin
dherrmann12-Aug-16 12:22
dherrmann12-Aug-16 12:22 
AnswerRe: VS2015Express Pin
Avelino Ferreira13-Aug-16 10:36
professionalAvelino Ferreira13-Aug-16 10:36 
Hi, Dietrich,

See my answer to your comment in the new article:
WebBrowser IE Emulation for Google Maps JavaScript API Key Requirement[^]

Greetings,
Avelino
QuestionUsage Pin
Member 897579011-Aug-16 10:19
Member 897579011-Aug-16 10:19 
AnswerRe: Usage Pin
Avelino Ferreira11-Aug-16 12:29
professionalAvelino Ferreira11-Aug-16 12:29 
QuestionMuito bom Pin
Member 301431211-Aug-16 9:40
Member 301431211-Aug-16 9:40 
AnswerRe: Muito bom Pin
Avelino Ferreira11-Aug-16 12:18
professionalAvelino Ferreira11-Aug-16 12:18 
QuestionWindow Mobile Pin
Darren Dickerson11-Aug-16 7:32
Darren Dickerson11-Aug-16 7:32 
AnswerRe: Window Mobile Pin
Avelino Ferreira11-Aug-16 11:44
professionalAvelino Ferreira11-Aug-16 11:44 
QuestionQuestion Pin
Philippe9130-Jun-16 22:26
Philippe9130-Jun-16 22:26 
AnswerRe: Question Pin
Avelino Ferreira30-Jun-16 23:58
professionalAvelino Ferreira30-Jun-16 23:58 
GeneralRe: Question Pin
Philippe911-Jul-16 5:31
Philippe911-Jul-16 5:31 
Question"Route" panels stopped working properly Pin
L.Botello24-Jun-16 1:11
L.Botello24-Jun-16 1:11 
AnswerRe: "Route" panels stopped working properly Pin
Avelino Ferreira24-Jun-16 10:28
professionalAvelino Ferreira24-Jun-16 10:28 
QuestionTHICK BLUE ROUTE LINE not SHOWING Pin
Member 125713589-Jun-16 2:32
Member 125713589-Jun-16 2:32 
AnswerRe: THICK BLUE ROUTE LINE not SHOWING Pin
Avelino Ferreira10-Jun-16 14:08
professionalAvelino Ferreira10-Jun-16 14:08 
QuestionDear Uncle help plz... Pin
asif rehman baber20-Apr-16 5:27
asif rehman baber20-Apr-16 5:27 
AnswerRe: Dear Uncle help plz... Pin
Avelino Ferreira20-Apr-16 10:15
professionalAvelino Ferreira20-Apr-16 10:15 
GeneralRe: Dear Uncle help plz... Pin
asif rehman baber26-Apr-16 5:17
asif rehman baber26-Apr-16 5:17 
GeneralRe: Dear Uncle help plz... Pin
Avelino Ferreira28-Apr-16 5:22
professionalAvelino Ferreira28-Apr-16 5:22 
QuestionDistancia Pin
jfaria.blosis@sapo.pt31-Oct-15 0:03
jfaria.blosis@sapo.pt31-Oct-15 0:03 
AnswerRe: Distancia Pin
Avelino Ferreira1-Nov-15 4:03
professionalAvelino Ferreira1-Nov-15 4:03 
QuestionRoute View Pin
Member 1194370530-Aug-15 8:38
Member 1194370530-Aug-15 8:38 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.