Official Content

1. Draw Point

&Radisson = new GxMap.Point()
&Radisson.PointLat         = "-34.9056247303566"
&Radisson.pointLong        = "-56.198415756225586"
&Radisson.PointInfowinTit  ='XIX International GeneXus Meeting'
&Radisson.PointInfowinDesc = "Radisson Montevideo Victoria Plaza Hotel - September 14-16"
&Radisson.PointInfowinLink = "http://genexus.com/event/"

&Radisson.PointInfowinLinkDsc = "Genexus Site" 

&Radisson.PointIcon       = "Red" // or &Radisson.PointIcon = "http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=|FE6256|000000"
&Radisson.PointInfowinImg = "http://wiki.gxtechnical.com/commwiki/servlet/apgetwikiimage?6327,1" // Some image
&GxMapdata.Points.Add(&Radisson)
Note: Google has a dynamic icon generator.

The sample is consolidated in the object's start event when dragging and dropping the control.

2. Draw Line

&MapLine = new()
&MapLinePoint = new()
&MapLinePoint.PointLat  = '31.223182'
&MapLinePoint.PointLong = '121.44654'
&MapLine.Points.Add(&MapLinePoint)

&MapLinePoint = new()
&MapLinePoint.PointLat  = '31.228209'
&MapLinePoint.PointLong = '121.474006'
&MapLine.Points.Add(&MapLinePoint) 

&GxMapData.Lines.Add(&MapLine)

3. Draw Polygon

&GxMapPolygon = new GxMap.Polygon(

&GxMapPolygon.PolygonFill = "#00AAFF"
&GxMapPolygon.PolygonFillOpacity = 0.80
&GxMapPolygon.PolygonStroke ="#FFAA00"
&GxMapPolygon.PolygonStrokeOpacity = 0.50
&GxMapPolygon.PolygonStrokeWeight = 2
&GxMapPolygon.PolygonInfowinHtml = "Plaza Independencia"

&GxMapPolyPath = new GxMap.Polygon.Path()

&GxMapPolyPath.PathLat = '-34.90691372574081'
&GxMapPolyPath.PathLong = '-56.198716163635254'
&GxMapPolygon.Paths.Add(&GxMapPolyPath )

&GxMapPolyPath = new GxMap.Polygon.Path()

&GxMapPolyPath.PathLat = "-34.906077860733134"
&GxMapPolyPath.PathLong = "-56.19883418083191"
&GxMapPolygon.Paths.Add(&GxMapPolyPath )

&GxMapPolyPath = new GxMap.Polygon.Path()

&GxMapPolyPath.PathLat = "-34.90617464553802"
&GxMapPolyPath.PathLong = "-56.20078682899475"
&GxMapPolygon.Paths.Add(&GxMapPolyPath )

&GxMapPolyPath = new GxMap.Polygon.Path()

&GxMapPolyPath.PathLat = "-34.90718647984938"
&GxMapPolyPath.PathLong = "-56.200679540634155"
&GxMapPolygon.Paths.Add(&GxMapPolyPath )

&GxMapPolyPath = new GxMap.Polygon.Path()

&GxMapPolyPath.PathLat = "-34.90691372574081"
&GxMapPolyPath.PathLong = "-56.198716163635254"
&GxMapPolygon.Paths.Add(&GxMapPolyPath )

&GxMapData.Polygons.Add(&GxMapPolygon ) 

4. Get coordinate from address (Geocoding - Google)

 &CollectionGeopoints = Maps.GeocodeAddress(&address)
 for &geopoint in &CollectionGeopoints
      GoogleMapControl1.Latitude = &geopoint.latitude.Tostring() //center the map in the coordinates
      GoogleMapControl1.Longitude = &geopoint.longitude.Tostring()
      GoogleMapControl1.Precision = &precision
      exit
  endfor
Or another way to do the same
&httpclient.Host = 'maps.google.com'                       //load the associated host
&httpclient.Secure = 1
&httpclient.BaseUrl     = '/maps/api/geocode/'
&postvar = 'xml?address=' + &address + '&sensor=false&key=' + &apikey
&httpclient.Execute('GET',&postvar)                       //execute a GET operation
&var = &httpclient.ToString()

&xmlreader.OpenFromString(&var) //parse the coordinates
&xmlreader.Read()
&xmlreader.ReadType(1,'lat')
&lat = &xmlreader.Value
&xmlreader.ReadType(1,'lng')
&long = &xmlreader.Value

GoogleMapControl1.Latitude =&lat //center the map in the coordinates
GoogleMapControl1.Longitude = &long
GoogleMapControl1.Precision = &precision

According to the new google security policies, it is necessary to acquire an API key and send it in each request, more details here.
Other service offer the same geocoding service, such us Here, OpenStreetMap, ArcGis

See this video for more info.

Other design (or runtime) properties of the control are as follows:

  • Precision (zoom scale is 1 to 16)
  • Type of map (map, satellite photo, or hybrid)
  • Controls can be included within the map such as zoom, overview, etc.

5. Get route between two points

  •  Set the Travel_Mode control property -> Driving or Walking
  •  Populate the SDT Routing points, programming something like the following:
&routingpoint = new()
&routingpoint.Latitude = 'xxxxxxx'
&routingpoint.Longitude = 'yyyyyy'
&routingpoint.Description = 'Work'
&routingpoint.Pin = "blank.png"
&GxMapData.Routing.add(&routingpoint)

&routingpoint = new()
&routingpoint.Latitude = 'xxxxxxx2'
&routingpoint.Longitude = 'yyyyyyy2'
&routingpoint.Description = 'House'
&routingpoint.Pin = "blank.png"
&GxMapData.Routing.Add(&routingpoint) 

MapcontrolRouting

6. Get coordinates just by clicking on the map

  • Set the On Click control property = Get Value
  • In an event, program something like this:
    for &point in &GxMapData.Points
        msg(&point.PointLat)
        msg(&point.PointLong)
    endfor 

Where &point is based on GxMap.Point Data type and GX Map Control property = &GxMapData (based on GXMap Type).

Important: getLongitude and getLatitude properties were used in previous versions (deprecated).

7. Get coordinates and open a popup just by clicking on the map

Set Click_Lat and Click_Long variables into ClickLatitude/ClickLongitude design properties.

Event GoogleMapControl1.Click
        &Window.Object = WPAsPopup.Create(&ClickLatitude , &ClickLonigtude)
        &Window.Open()
EndEvent

8. How to Import KML file on the map

In order to show the United State Map provided by a Kml File located under http://developers.google.com/kml/documentation/us_states.kml , programming something like the following:

Event Start
    GoogleMapControl1.KML = true
    GoogleMapControl1.KMLURL = "developers.google.com/kml/documentation/us_states.kml"
Endevent

MapcontrolKMl

Last update: April 2024 | © GeneXus. All rights reserved. GeneXus Powered by Globant