Question

我使用来自primefaces的谷歌地图工具。我希望我的用户能够在地图上放置标记。变量应该存储在托管bean变量中。我创建了地图和bean，但我只有地图，我不能放置标记！看看我到目前为止做了什么：这是xhtml页面：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:p="http://primefaces.org/ui">

<script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript"></script>

<h:body>
    <ui:composition template="../template/template_.xhtml">
    <p:growl id="messages" showDetail="true" />

<p:gmap id="gmap" center="36.8469897, 10.1980649" zoom="13" type="HYBRID" style="width:600px;height:400px"
    model="#{addMarkersView.emptyModel}" onPointClick="handlePointClick(event);" widgetVar="map" />

<p:dialog widgetVar="dlg" showEffect="fade">
    <h:form prependId="false">
        <h:panelGrid columns="2">
            <h:outputLabel for="title" value="Title:" />
            <p:inputText id="title" value="#{addMarkersView.title}" />

            <f:facet name="footer">
                <p:commandButton value="Add" actionListener="#{addMarkersView.addMarker}" update=":messages" oncomplete="markerAddComplete()" />
                <p:commandButton value="Cancel" onclick="return cancel()" />
            </f:facet>
        </h:panelGrid>

        <h:inputHidden id="lat" value="#{addMarkersView.lat}" />
        <h:inputHidden id="lng" value="#{addMarkersView.lng}" />
    </h:form>
</p:dialog>

<script type="text/javascript">
    var currentMarker = null;

    function handlePointClick(event) {
        if(currentMarker === null) {
            document.getElementById('lat').value = event.latLng.lat();
            document.getElementById('lng').value = event.latLng.lng();

            currentMarker = new google.maps.Marker({
                position:new google.maps.LatLng(event.latLng.lat(), event.latLng.lng())
            });

            PF('map').addOverlay(currentMarker);

            PF('dlg').show();
        }   
    }

    function markerAddComplete() {
        var title = document.getElementById('title');
        currentMarker.setTitle(title.value);
        title.value = "";

        currentMarker = null;
        PF('dlg').hide();
    }

    function cancel() {
        PF('dlg').hide();
        currentMarker.setMap(null);
        currentMarker = null;

        return false;
    }
</script>


        <ui:define name="content">
            <h:form id="form">
                <p:outputPanel id="stocks">
                    <p:dataTable id="ProductTable" value="#{produitBean.allProduct}" paginator="true" rows="5"  var="produit">
                        <p:column>
                            <f:facet name="header">
                                <h:outputText value="PRODUCT ID" />
                            </f:facet>
                                <h:outputText value="#{produit.produitId}" />
                                <!-- <f:setPropertyActionListener target="#{produitBean.produit}"
                                    value="#{produit}" />  -->
                        </p:column>
                        <p:column>
                            <f:facet name="header">
                                <h:outputText value="PRODUCT NAME" />
                            </f:facet>

                                <h:outputText value="#{produit.name}" />
                                <!-- <f:setPropertyActionListener target="#{produitBean.produit}"
                                    value="#{produit}" /> -->
                        </p:column>
                        <p:column>
                            <f:facet name="header">
                                <h:outputText value="PRODUCT Price" />
                            </f:facet>
                            <h:outputText value="#{produit.prix}" />
                                <!-- <f:setPropertyActionListener target="#{produitBean.produit}"
                                    value="#{produit}" /> -->                   
                    </p:column>
                        <p:column>
                            <f:facet name="header">
                                <h:outputText value="Modify" />
                                </f:facet>
                            <p:commandLink   action="#{produitBean.editProduct}">
                            <h:outputText value="modifier" />
                            <f:setPropertyActionListener target="#{produitBean.produit}" value="#{produit}" /> 
                            </p:commandLink>

                        </p:column>
                        <p:column>
                         <f:facet name="header">
                                <h:outputText value="Delete" />
                            </f:facet> 
                            <p:commandLink action="#{produitBean.deleteProduct}">
                                <h:outputText value="delete" />
                                <f:setPropertyActionListener target="#{produitBean.produit}"
                                    value="#{produit}" /> 

                            </p:commandLink>
                        </p:column>
                    </p:dataTable>
                </p:outputPanel>
                <p:commandButton value="Create New Product" action="#{produitBean.newProduct}" />                   
</h:form>
</ui:define>
<!-- <ui:define name="map">
 <p:gmap center="36.8469897, 10.1980649" zoom="17" type="HYBRID" style="width:1000px;height:1000px"/>
</ui:define> -->
</ui:composition>
    </h:body>


</html>

这是我的豆子：

 @Component
 @Scope
@ManagedBean
public class AddMarkersView  {

    private MapModel emptyModel;

    private String title;

    private double lat;

    private double lng;

    @PostConstruct
    public void init() {
        emptyModel = new DefaultMapModel();
    }

    public MapModel getEmptyModel() {
        return emptyModel;
    }

    public String getTitle() {
        return title;
    }

    public void setTitle(String title) {
        this.title = title;
    }

    public double getLat() {
        return lat;
    }

    public void setLat(double lat) {
        this.lat = lat;
    }

    public double getLng() {
        return lng;
    }

    public void setLng(double lng) {
        this.lng = lng;
    }

    public void addMarker() {
        Marker marker = new Marker(new LatLng(lat, lng), title);
        emptyModel.addOverlay(marker);

        FacesContext.getCurrentInstance().addMessage(null, new FacesMessage(FacesMessage.SEVERITY_INFO, "Marker Added", "Lat:" + lat + ", Lng:" + lng));
    }
}

我加载了地图的问题但是当我点击地图时我无法放置标记，我只是在主要页面http://www.primefaces.org/showcase/ui/data/gmap/addMarkers.xhtm中编写了相同的代码。

请帮助我，我是初学者！

在谷歌地图上放置标记与primefaces

0 个答案: