Directory

← Back

Google Maps Addon

Vaadin Flow add-on for Google Maps Web Component

Author

Rating

Popularity

1000+

This add-on provides a simple wrapper around Google Maps web component.

Currently supported features:

  • Programmatic server-side panning and zooming
  • Adding/removing markers
  • Adding/removing polygons
  • Adding click listener to polygons
  • Show info window on markers
  • Geolocation
  • Add draggable markers
  • Define clustering for markers
  • Enable/disable UI controls
  • Define size of UI controls
  • Kml support
  • Tilt & rotation support
  • MapId support
  • Obtain map bounds & more

Sample code

            GoogleMap gmaps = new GoogleMap(apiKey,null,null);
            gmaps.setMapType(MapType.SATELLITE);
            gmaps.setSizeFull();
            gmaps.setCenter(new LatLon(0,0));
            gmaps.addMarker("Center", new LatLon(0,0), true, "");
            GoogleMapPolygon gmp = gmaps.addPolygon(Arrays.asList(new GoogleMapPoint(gmaps.getCenter()),
    		new GoogleMapPoint(gmaps.getCenter().getLat(),gmaps.getCenter().getLon()+1),
    		new GoogleMapPoint(gmaps.getCenter().getLat()+1,gmaps.getCenter().getLon())));
GoogleMapPolygon gmp = gmaps.addPolygon(Arrays.asList(
	    		new GoogleMapPoint(gmaps.getCenter().getLat(),gmaps.getCenter().getLon()+1),
	    		new GoogleMapPoint(gmaps.getCenter().getLat()+1,gmaps.getCenter().getLon()),
	    		new GoogleMapPoint(gmaps.getCenter().getLat(),gmaps.getCenter().getLon()-1),
					new GoogleMapPoint(gmaps.getCenter().getLat() - 1, gmaps.getCenter().getLon()),
					new GoogleMapPoint(gmaps.getCenter().getLat(), gmaps.getCenter().getLon() + 1)));
			gmp.setClosed(false);
			gmp.setIcons(new Icon("M -2,0 0,-2 2,0 0,2 z", "#F00", "#FF0", 1, 25));
			GoogleMapMarker flowingmarker = gmaps.addMarker("Center", new LatLon(-31.636036, -60.7055271), true,
					"https://www.flowingcode.com/wp-content/uploads/2020/06/FCMarker.png");
			flowingmarker.addInfoWindow("<h1>Flowing Code</h1>");

Compatibility

(Loading compatibility data...)

Was this helpful? Need more help?
Leave a comment or a question below. You can also join the chat on Discord or ask questions on StackOverflow.

Version

New features:

  • Add possibility to style map features and elements (#123)
Released
2024-08-26
Maturity
TESTED
License
Apache License 2.0

Compatibility

Framework
Vaadin 14+
Browser
N/A

Google Maps Addon - Vaadin Add-on Directory

Vaadin Flow add-on for Google Maps Web Component Google Maps Addon - Vaadin Add-on Directory
This add-on provides a simple wrapper around Google Maps web component. Currently supported features: * Programmatic server-side panning and zooming * Adding/removing markers * Adding/removing polygons * Adding click listener to polygons * Show info window on markers * Geolocation * Add draggable markers * Define clustering for markers * Enable/disable UI controls * Define size of UI controls * Kml support * Tilt & rotation support * MapId support * Obtain map bounds & more
Online Demo
Author Homepage
View on GitHub
Issue tracker

Google Maps Addon version 1.0.0
Initial release

Google Maps Addon version 1.0.1
- Support for drawing icons along a polyline - The iconUrl was not being sent to the web component (fixes [#2](https://github.com/FlowingCode/GoogleMapsAddon/issues/2)) - Fix for [issue when adding markers](https://github.com/FlowingCode/GoogleMapsAddon/issues/3) - Support for showing infoWindow with html content (partially solves [#4](https://github.com/FlowingCode/GoogleMapsAddon/issues/4))

Google Maps Addon version 1.1.0
Add support for marker colors ([#6](https://github.com/FlowingCode/GoogleMapsAddon/issues/6))

Google Maps Addon version 1.2.0
### New features * Add mouse click event with map coordinates ([#18](https://github.com/FlowingCode/GoogleMapsAddon/issues/18))

Google Maps Addon version 1.2.1
### Bugfixes * [Fix #2](https://github.com/FlowingCode/google-map/issues/2) undefined component error (cannot read property 'click' of undefined when Map inside Dialog). * [Fix #4](https://github.com/FlowingCode/google-map/issues/4) undefined component error when adding polygons.

Google Maps Addon version 1.3.0
### New features * Add latitude and longitude data to GoogleMapPolygonClickEvent ([#26](https://github.com/FlowingCode/GoogleMapsAddon/issues/26)) * Add geolocation to center map on user's location ([#36](https://github.com/FlowingCode/GoogleMapsAddon/issues/36)) ### Bugfixes * Fix setting draggable flag on element ([#33](https://github.com/FlowingCode/GoogleMapsAddon/issues/33))

Google Maps Addon version 1.4.0
### New features: * Add drag end event to marker ([#40](https://github.com/FlowingCode/GoogleMapsAddon/issues/40)) ### Bugfixes: * Add null check to caption setter * Fix marker's setters and getters to use element properties ([#41](https://github.com/FlowingCode/GoogleMapsAddon/issues/41)) Based on [@flowingcode/google-map 3.0.3](https://github.com/FlowingCode/google-map/releases/tag/v3.0.3)

Google Maps Addon version 1.5.0
### New features * Add method to disable UI controls ([#56](https://github.com/FlowingCode/GoogleMapsAddon/issues/56)) * Update client side component to [3.5.0](https://github.com/FlowingCode/google-map/releases/tag/v3.0.5) ### Bugfixes * Fix polygon icons to not disappear after navigation ([#45](https://github.com/FlowingCode/GoogleMapsAddon/issues/45)) * Fix info window not showing after reattach ([#51](https://github.com/FlowingCode/GoogleMapsAddon/issues/51))

Google Maps Addon version 1.6.0
### New features * Add click event listener to markers * Add mapId & controlSize properties

Google Maps Addon version 1.7.0
#### New features: * Add kml support ([#23](https://github.com/FlowingCode/GoogleMapsAddon/issues/23))

Google Maps Addon version 1.8.0
#### New features: * Add support for Marker Cluster ([#73](https://github.com/FlowingCode/GoogleMapsAddon/issues/73))

Google Maps Addon version 1.8.1
Update web component version to 3.2.1 ([#75](https://github.com/FlowingCode/GoogleMapsAddon/issues/75)).

Google Maps Addon version 1.8.2
Update web component version to 3.2.3 ([#77](https://github.com/FlowingCode/GoogleMapsAddon/issues/77)).

Google Maps Addon version 1.8.3
#### Bug fixes: * Prevent Roboto font from loading ([#91](https://github.com/FlowingCode/GoogleMapsAddon/issues/91))

Google Maps Addon version 1.9.0
#### New features: * Add support for tilt and heading properties ([#90](https://github.com/FlowingCode/GoogleMapsAddon/issues/90)) * Add right click event on markers ([#67](https://github.com/FlowingCode/GoogleMapsAddon/issues/67)) * Add method to obtain the map bounds ([#93](https://github.com/FlowingCode/GoogleMapsAddon/issues/93)) * Add custom renderer to marker clustering ([#103](https://github.com/FlowingCode/GoogleMapsAddon/issues/103)) #### Bug fixes: * Use optimized property from the web-component ([#81](https://github.com/FlowingCode/GoogleMapsAddon/issues/81))

Google Maps Addon version 1.10.0
#### New features: * Update web component dependency to add bounds change event * Added MapIdle and BoundChanged Listeners

Google Maps Addon version 1.10.1
#### Bug fixes: * Update markers on removal ([#109](https://github.com/FlowingCode/GoogleMapsAddon/issues/109))

Google Maps Addon version 1.11.0
#### New features: * Support to add polylines ([#102](https://github.com/FlowingCode/GoogleMapsAddon/issues/102))

Google Maps Addon version 1.12.0
#### New features: * Add support for adding custom control buttons ([#115](https://github.com/FlowingCode/GoogleMapsAddon/issues/115)) * Update API to allow setting properties to icons ([#113](https://github.com/FlowingCode/GoogleMapsAddon/issues/113)) * Add possibility to track location ([#117](https://github.com/FlowingCode/GoogleMapsAddon/issues/117)) #### Bug fixes: * Update map after adding/removing polygons and polylines ([#118](https://github.com/FlowingCode/GoogleMapsAddon/issues/118))

Google Maps Addon version 1.13.0
#### New features: * Deprecate addCustomControls method and replace with setCustomControls ([#127](https://github.com/FlowingCode/GoogleMapsAddon/issues/127))

Google Maps Addon version 2.0.0
#### New features: * Internally manage trackLocationId ([#133](https://github.com/FlowingCode/GoogleMapsAddon/issues/133)) * Allow to close full screen mode ([#130](https://github.com/FlowingCode/GoogleMapsAddon/issues/130)) * Add listener to know if map is in full screen mode ([#130](https://github.com/FlowingCode/GoogleMapsAddon/issues/130)) #### Bug fixes: * Use setProperty instead of setAttribute for zoom property ([#132](https://github.com/FlowingCode/GoogleMapsAddon/issues/132))

Google Maps Addon version 2.1.0
#### New features: * Add possibility to style map features and elements ([#123](https://github.com/FlowingCode/GoogleMapsAddon/issues/123))

Online