Leaflet4Vaadin

Vaadin 14 LTS and Leaflet 1.6.0 integration with PolymerTemplate

View larger

Close

View larger

Close

View larger

Close

View larger

Close

View larger

Close

View larger

Close

View larger

Close

Leaflet4Vaadin provides a Java API for Leaflet, which is a popular map implementation.

With this Vaadin add-on you can use LeafletJS with java on server side.

If you want to contribute this add-on on github no hesitate just contact me.

Core Features:

• map configuration
• interactive layers
• map and layer events
• markers
• tooltip and popup binding
• layer groups
• vector layers
• dark theme
• map controls (zoom, layers, scale)
• map state functions
• tile layers
• GeoJSON supports
• supports Leaflet plugins (eg.: fullscreen, heatmap, markercluster)

Future improvements

• i18n supports
• leaflet editable plugin integration
• design and performance improvements
• use Typescript on client-side instead of JS
• supports parameters in custom events
• bugfixes

Example usage

MapOptions options = new DefaultMapOptions();
options.setCenter(new LatLng(47.070121823, 19.204101562500004));
options.setZoom(7);
LeafletMap leafletMap = new LeafletMap(options );
leafletMap.setBaseUrl("https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png");
add(leafletMap);

Please report the issues here: https://github.com/Gubancs/leaflet4vaadin/issues

Feel free to donate: https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=8M9BEK428U6AW&source=url

Sample code

MapOptions options = new DefaultMapOptions();
options.setCenter(new LatLng(47.070121823, 19.204101562500004));
options.setZoom(7);
LeafletMap leafletMap = new LeafletMap(options );
leafletMap.setBaseUrl("https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png");
add(leafletMap);

	MapOptions options = new DefaultMapOptions();
		options.setCenter(new LatLng(47.070121823, 19.2041015625));
		options.setZoom(7);
		LeafletMap leafletMap = new LeafletMap(options);
		leafletMap.setBaseUrl("https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png");

		leafletMap.onClick((e) -> {
			Notification.show("New marker added to map.", 3000, Position.TOP_CENTER);
			Marker marker = new Marker(e.getLatLng());
			marker.bindPopup("My added marker!");
			marker.addTo(leafletMap);
		});

Links

• View on GitHub
• Example Source Code with Vaadin Flow V15
• Online Demo
• Issue tracker
• Source Code

Compatibility