PrimeFaces Extensions Showcase

OpenStreetMap

OpenStreetMap is straight forward. All you have to know is the GPS coordinate of the center of the map.

Source

XHTML page
Managed bean


<p:growl id="growl" showDetail="true" showSummary="true" globalOnly="false">
        <p:autoUpdate />
    </p:growl>

    <pe:osmap style="width:100%; height:500px;"
              center="36.890257,30.707417"
              zoom="13" model="#{markersView.simpleModel}">
    </pe:osmap>


                @Named
@RequestScoped
public class MarkersView implements Serializable {

    private static final long serialVersionUID = 1L;

    private MapModel<Long> simpleModel;

    @PostConstruct
    public void init() {
        simpleModel = new DefaultMapModel<>();

        simpleModel.addOverlay(new Marker<>(new LatLng(36.879466, 30.667648), "Konyaalti", 1L));
        simpleModel.addOverlay(new Marker<>(new LatLng(36.883707, 30.689216), "Ataturk Parki", 2L));

        Marker marker3 = new Marker<>(new LatLng(36.879703, 30.706707), "Karaalioglu Parki", 3L,
                    "https://developers.google.com/maps/documentation/javascript/examples/full/images/beachflag.png");
        simpleModel.addOverlay(marker3);

        Marker marker4 = new Marker<>(new LatLng(36.885233, 30.702323), "Kaleici", 4L);
        simpleModel.addOverlay(marker4);
    }

    public MapModel<Long> getSimpleModel() {
        return simpleModel;
    }
}

Use Cases

Documentation pe:osmap

Attributes (move mouse over the names to see data types)

Name	Description
widgetVar	Name of the client side widget.
model	An org.primefaces.model.MapModel instance.
style	Inline style of the map container.
styleClass	Style class of the map container.
center	Center point of the map. Required.
zoom	Defines the initial zoom level. Default is 8.
zoomControl	Display zoom control on a map. Default is true.
attribution	When using OpenStreetMap data, you are required to provide credit and display copyright notice.
tileUrl	Url of a custom tile provider.
draggable	Defines draggability of map. Default is true.
onPointClick	Javascript callback to execute when a point on map is clicked.
scrollWheel	Controls scrollwheel zooming on the map. Default is true.