Google Maps

Description

The Google Maps control lets you embed Google Maps in your app. All the settings needed to display a map can be set at design time in AppStudio: no additional code needs to be written.

If you do want to change any settings at runtime, you can do so. Use the .refresh() method to redisplay the video with your new settings.

The refresh method returns a reference to the map, which can then be used for other Google Maps functions.

If you are displaying a map on any form other than the first one, or you have multiple maps, put a refresh() call into the form's onshow function:

Function Form2_onshow()
  GoogleMap1.refresh()
End Function

Properties

apiKey	API Key issued by Google. More information here: https://developers.google.com/maps/documentation/javascript/get-api-key
background	Background color, before map is drawn.
disableDefaultUI	Enables/disables all default UI. May be overridden individually.
disableDoubleClickZoom	Enables/disables zoom and center on double click. Enabled by default.
draggable	If false, prevents the map from being dragged. Dragging is enabled by default.
draggableCursor	The name or url of the cursor to display when mousing over a draggable map. This property uses the css cursor attribute to change the icon. As with the css property, you must specify at least one fallback cursor that is not a URL. For example: draggableCursor: 'url(http://www.example.com/icon.png), auto;'.
draggingCursor	The name or url of the cursor to display when the map is being dragged. This property uses the css cursor attribute to change the icon. As with the css property, you must specify at least one fallback cursor that is not a URL. For example: draggingCursor: 'url(http://www.example.com/icon.png), auto;'.
heading	The heading for aerial imagery in degrees measured clockwise from cardinal direction North. Headings are snapped to the nearest available angle for which imagery is available.
keyboardShortcuts	If false, prevents the map from being controlled by the keyboard. Keyboard shortcuts are enabled by default.
latitude	Location latitude: -90 to 90
longitude	Location longitude: 0 to 180
mapMaker	True if Map Maker tiles should be used instead of regular tiles.
maxZoom	The maximum zoom level which will be displayed on the map. If omitted, or set to null, the maximum zoom from the current map type is used instead.
minZoom	The minimum zoom level which will be displayed on the map. If omitted, or set to null, the minimum zoom from the current map type is used instead.
mapOptions	The current options for the map, in an object. Runtime only.
mapTypeId	Type of map
noClear	If true, do not clear the contents of the Map div.
refresh()	Redraw the map using the latest values of mapOptions. Needs to be done for each map (happens automatically to the first map). Runtime.
scrollwheel	If false, disables scrollwheel zooming on the map. The scrollwheel is enabled by default.
setMarker(options)	Sets a marker at a position. Returns a reference to the marker. If no options are supplied, the marker is drawn at the center of the map. options is an object containing the position and other information. Runtime only. See Google's docs for all the options.
streetViewControl	The initial enabled/disabled state of the Street View Pegman control. This control is part of the default UI, and should be set to false when displaying a map type on which the Street View road overlay should not appear (e.g. a non-Earth map type).
tilt	Controls the automatic switching behavior for the angle of incidence of the map. The only allowed values are 0 and 45. The value 0 causes the map to always use a 0° overhead view regardless of the zoom level and viewport. The value 45 causes the tilt angle to automatically switch to 45 whenever 45° imagery is available for the current zoom level and viewport, and switch back to 0 whenever 45° imagery is not available (this is the default behavior). 45° imagery is only available for SATELLITE and HYBRID map types, within some locations, and at some zoom levels. Note: getTilt returns the current tilt angle, not the value specified by this option. Because getTilt and this option refer to different things, do not bind() the tilt property; doing so may yield unpredictable effects.
zoom	The initial Map zoom level. Required.
zoomControl	The enabled/disabled state of the Zoom control.

Events

Events are handled by the control itself.

Example

This code changes the map to show the current location. It will only work on devices which get the current location.

Sub Main() 'Set a marker at the center of the map when drawn
  GoogleMap1.setMarker()
End Sub 

Function Button1_onclick()
  navigator.geolocation.getCurrentPosition(gotLocation)
End Function

Function gotLocation(location)
  GoogleMap1.mapOptions.latitude = location.coords.latitude
  GoogleMap1.mapOptions.longitude = location.coords.longitude
  GoogleMap1.refresh()

  'Put a marker on our location
  point = new google.maps.LatLng(location.coords.latitude, location.coords.longitude)
  marker = GoogleMap1.setMarker({position: point})
End Function

Function btnHideMarker_onclick() 'hide the marker
  marker.setMap(null)
End Function