GRAFFITIMAPVIEWER - GRAFFITISUITE DOCS

# GraffitiMapViewer Class Inherits GraffitiWebUIControl ## About GraffitiMapViewer provides Google Maps in a easy to use and manage class with support for markers, popups, symbols, heatmaps, and more. ## Compatibility ### Framework API Version | 1.0 | 2.0 | | :---: | :---: | | True | True | ### Web | 32-Bit | 64-Bit | | :---: | :---: | | True | True | ## Enumerations | Name | Value | Description | | --- | :---: | --- | | GestureHandlingTypes | Auto None Cooperative Greedy | Supported gesture recognition models. | | MapStyles | Standard Silver Retro Dark Night Aubergine Custom | Supported map appearance types. | | MapTypes | Roadmap Hybrid Satellite Terrain | Supported map types. | | ZoomLevels | World = 1 Continent = 5 City = 10 Streets = 15 Buildings = 20 | Supported world zoom levels. | ## Event Definitions | Name | Parameters | Return Type | Description | | --- | :---: | :---: | --- | | DoublePressed | x as Integer y as Integer position as GraffitiMap.Point | (None) | Raised when the user has double-pressed or -clicked the map. | | Hidden | (None) | (None) | | | ImageOverlayDoublePressed | overlay as GraffitiMap.Overlays.Image point as GraffitiMap.Point | (None) | Raised when the user double presses an image overlay. | | ImageOverlayPressed | overlay as GraffitiMap.Overlays.Image point as GraffitiMap.Point | (None) | Raised when the user presses an image overlay. | | MapTypeChanged | (None) | (None) | Raised when the user has changed the map type. | | MarkerContextPressed | marker as GraffitiMap.Marker pageX as Integer pageY as Integer | (None) | Raised when the user had right-clicked the specified marker. | | MarkerMouseEnter | marker as GraffitiMap.Marker | (None) | Raised when the user's mouse has entered the specified marker's display area. | | MarkerMouseExit | marker as GraffitiMap.Marker | (None) | Raised when the user's mouse has exited the specified marker's display area. | | MarkerPositionChanged | marker as GraffitiMap.Marker | (None) | Raised when the user has dragged the specified marker to a new position. | | MarkerPressed | marker as GraffitiMap.Marker screenPosition as Point | (None) | Raise the user has double-pressed or -clicked the specified marker. | | MouseEnter | (None) | (None) | Raised when user's mouse has entered the map's display area. | | MouseExit | (None) | (None) | Raised when user's mouse has exited the map's display area. | | Open | (None) | (None) | | | PopupHidden | popup as GraffitiMap.Popup | (None) | Raised when user has closed the specified popup by clicking its close button. | | PositionChanged | (None) | (None) | Raised when the user has changed the map's position by dragging or zooming. | | Pressed | x as Integer y as Integer position as GraffitiMap.Point | (None) | Raised when the user has pressed or clicked on the map's display. | | RouteChanged | route as GraffitiMap.Directions.Route | (None) | Raised when the Route has been edited by the user. | | RouteError | route as GraffitiMap.Directions.Route message as String | (None) | Raised when an error was encountered while the Directions API attempting to create the specified Route. | | ShapeChanged | shape as GraffitiMap.Shapes.Shape | (None) | Raised when a shape has been altered or repositioned the user. | | ShapeContextPressed | shape as GraffitiMap.Shapes.Shape pageX as Integer pageY as Integer | (None) | Raised when the user has right-clicked or long-pressed on a shape. | | ShapeDoublePressed | shape as GraffitiMap.Shapes.Shape | (None) | Raised when the user has double-pressed or -clicked on the specified shape. | | ShapeMouseEnter | shape as GraffitiMap.Shapes.Shape | (None) | Raised when the user's mouse has entered the shape's display area. | | ShapeMouseExit | shape as GraffitiMap.Shapes.Shape | (None) | Raised when the user's mouse has exited the shape's display area. | | ShapePressed | shape as GraffitiMap.Shapes.Shape | (None) | Raised when the user presses or clicks the specified shape. | | Shown | (None) | (None) | | | ZoomChanged | (None) | (None) | Raised when the user has changed the ZoomLevel. | ## Methods | Name | Parameters | Return Type | Description | | --- | :---: | :---: | --- | | AddHeatmap | heatmap as GraffitiMap.Overlays.Heatmap | (None) | Adds a new heatmap. | | AddImageOverlay | imageOverlay as GraffitiMap.Overlays.Image | (None) | Add the specified image overlay to the current map. | | AddMapStyle | name as String style as JSONItem | (None) | Adds a new MapStyle (set MapStyle to Custom). | | AddMarker | marker as GraffitiMap.Marker | (None) | Adds the specified marker to the map. | | AddPopup | popup as GraffitiMap.Popup | (None) | Adds the specified popup instance to the map (hidden until explicitly shown). | | AddRoute | route as GraffitiMap.Directions.Route | (None) | Adds the specified route to the map. | | AddShape | shape as GraffitiMap.Shapes.Shape | (None) | Adds the specified shape to the map. | | FitBounds | bounds as GraffitiMap.Bounds padding as Integer = 0 | (None) | Pans and Zooms the map to display the specified area. | | HeatmapAt | index as Integer | GraffitiMap.Overlays.Heatmap | Returns the heatmap at the specified index within the internal array. | | ImageOverlayAt | index as Integer | GraffitiMap.Overlays.Image | Image overlay at the specified index. | | LastImageOverlayIndex | (None) | Integer | Index of the final image overlay present in the internal array. | | LastMarkerIndex | (None) | Integer | Index of the final marker present in the internal array. | | LastPopupIndex | (None) | Integer | Index of the final popup present in the internal array. | | LastRouteIndex | (None) | Integer | Index of the final route present in the internal array. | | LastShapeIndex | (None) | Integer | Index of the final shape present in the internal array. | | MarkerAt | index as Integer | GraffitiMap.Marker | Marker object at the specified index. | | PanBy | offset as Xojo.Point | (None) | Pans the map's display by X/Y in pixels. | | PanTo | position as GraffitiMap.Point | (None) | Scrolls the map to show the specified position. Alternatively, set the Position property. | | PopupAt | index as Integer | GraffitiMap.Popup | Returns the popup as the specified index. | | RemoveAllHeatmaps | (None) | (None) | Removes all heatmaps from the component. | | RemoveAllImageOverlays | (None) | (None) | Removes all image overlays from the component. | | RemoveAllMarkers | (None) | (None) | Removes all markers from the component. | | RemoveAllPopups | (None) | (None) | Removes all popups from the component. | | RemoveAllRoutes | (None) | (None) | Removes all routes from the component. | | RemoveAllShapes | (None) | (None) | Removes all shapes from the component. | | RemoveHeatmap | heatmap As GraffitiMap.Overlays.Heatmap | (None) | Removes the specified heatmap from the component. | | RemoveImageOverlay | overlay As GraffitiMap.Overlays.Image | (None) | Removes the specified image overlay. | | RemoveMarker | marker as GraffitiMap.Marker | (None) | Removes the specified marker. Use MarkerAt in conjunction with RemoveMarker to remove by index. | | RemovePopup | popup as GraffitiMap.Popup | (None) | Removes the specified popup. Use PopupAt in conjunction with RemovePopup to remove by index. | | RemoveRoute | route as GraffitiMap.Directions.Route | (None) | Removes the specified route. Use RouteAt in conjunction with RemoveRoute to remove by index. | | RemoveShape | shape as GraffitiMap.Shapes.Shape | (None) | Removes the specified shape. Use ShapeAt in conjunction with RemoveShape to remove by index. | | RouteAt | index as Integer | GraffitiMap.Directions.Route | Returns the route at the specified index. | | ShapeAt | index as Integer | GraffitiMap.Shapes.Shape | Returns the shape at the specified index. | ## Properties | Name | Type | Default Value | Description | | --- | :---: | :---: | --- | | APIKey | String | Nil | Google Maps API Key. To use Directions, your key must have the directions API enabled. | | BackgroundColor | Color | Nil | Color to apply to the map's backdrop. | | CanDoubleClickToZoom | Boolean | Nil | When True, double-clicking the map will cause ZoomLevel to increase. | | CanMouseWheelToZoom | Boolean | Nil | When True, the mousewheel will alter the ZoomLevel. | | CanUseKeyboard | Boolean | Nil | When True, keyboard shortcuts are enabled. | | DirectionsSidebarWidth | Integer | Nil | Size in rem (based on font-size) for directions sidebar. | | GestureHandlingType | GestureHandlingTypes | Nil | When a user scrolls a page that contains a map, the scrolling action can unintentionally cause the map to zoom. This behavior can be controlled using the gestureHandling map option. ( https://developers.google.com/maps/documentation/javascript/interaction#controlling_gesture_handling ) | | HasBicyclingLayer | Boolean | Nil | When True, the map will display known bicycle paths. | | HasDirectionsSidebar | Boolean | Nil | When True, setting a Directions.Route will cause the directions sidebar to display with a list of route steps. | | HasFullScreenControl | Boolean | Nil | When True, a button will be displayed that, when clicked, expands the map to fill the screen. | | HasPanControl | Boolean | Nil | When True, a pan control will be visible in applicable views. | | HasRotateControl | Boolean | Nil | When True, a rotate control will be visible in applicable views. | | HasScaleControl | Boolean | Nil | When True, a scale control will be visible in applicable views. | | HasStreetViewControl | Boolean | Nil | When True, the street view control will be visible in applicable views. | | HasThreeWordsLayer | Boolean | Nil | Controls the display of a What3Words grid overlay. | | HasTrafficLayer | Boolean | Nil | When True, the map will display current traffic conditions. | | HasTransitLayer | Boolean | Nil | When True, the map will display known public transit paths. | | HasZoomControl | Boolean | Nil | Controls visibility of zoom functionality. | | Heading | Integer | Nil | Value, in degrees, of the map's display direction. | | IsTilted | Boolean | Nil | When True, the map will tilt by 45 degrees for applicable views. | | MapStyle | MapStyles | Nil | The display style to apply to the map and its element. | | MapStyleName | String | Nil | Map style to apply when MapStyle is set to Custom. | | MapType | MapTypes | Nil | Type of map to display. | | PerformThreeWordsLookups | Boolean | Nil | When true and an API key has been supplied to GraffitiW3W, the class will attempt to resolve map points to their W3W values. | | Position | GraffitiMap.Point | Nil | Center point of the map's display. | | PositionW3W | GraffitiW3W.MapPoint | Nil | The current W3W MapPoint position of the center of the map display. Setting this property will have no effect if an API key is not supplied to the GraffitiW3W module. | | ZoomLevel | Integer | Nil | While the value is an integer, there is a corresponding enumeration to assist with value selection. | | ZoomLevelMaximum | Integer | Nil | Limits the maximum zoom level that the user can achieve. | | ZoomLevelMinimum | Integer | Nil | Limits the minimum zoom level that the user can achieve. | ## Examples ### API Key The APIKey property should be set in the IDE's Inspector to ensure that it is available before it is needed due to the unreliability of event order. ### Disposable Objects The following object instances should be considered disposable, and may be discarded at will by the component. It's best not to keep references to these objects or assume that they will be reused when the user has made relevant changes in the browser: * GraffitiMap.Bounds * GraffitiMap.Point * GraffitiMap.Directions.Waypoint