Draw polyline on p:gmap without reloading the map

379 views Asked by At

I am trying to draw a polyline when user clicks on PrimeFaces GMap.

The polyline already draws in GMap, but the map always reloads when a user clicks.

I can prevent GMap from reloading if I use JavaScript to draw a polyline.

Is there a way to accomplish this without using JavaScript?

<p:remoteCommand name="rcSendPoint" actionListener="#{indexBacking.onPointSelect()}" update="gmap"/>
        <p:gmap id="gmap"
                widgetVar="gmap"
            center="-6.9243586, 107.6202013" 
            zoom="20" type="HYBRID" 
            model="#{indexBacking.model}" 
            style="width:100%;height:400px"
            onPointClick="drawPolyline(event);"/>                          
    </h:form>
    <script type ="text/javascript">
        var point = null;            
        function drawPolyline(event) {
            if (point === null) {                       
                rcSendPoint([{name: 'latitude', value: event.latLng.lat()}, {name: 'longitude', value: event.latLng.lng()}]);
            }
        }
    </script>

public void onPointSelect() {          
    Map<String, String> params = FacesContext.getCurrentInstance().getExternalContext().getRequestParameterMap();
    lat = Double.valueOf(params.get("latitude"));
    lng = Double.valueOf(params.get("longitude"));  
    polyline.getPaths().add(new LatLng(lat, lng));
    model.addOverlay(polyline);
}
0

There are 0 answers