如何创建可拖动标记

Question

下面的代码可以创建一个标记。

但我想创建一个可拖动的标记，问题是在创建标记后不会将点击事件发送到服务器。

创建标记时，可拖动标志设置为true。

有什么想法吗？

<p:gmap id="gmap" center="36.890257,30.707417" zoom="13" type="HYBRID"
style="width:600px;height:400px"
model="#{mapBean.emptyModel}"
onPointClick="handlePointClick(event);"
widgetVar="map">
<p:ajax event="markerDrag" listener="#{mapBean.onMarkerDrag}" update="messages" />
</p:gmap>
<p:dialog widgetVar="dlg" effect="FADE" effectDuration="0.5" close="false" fixedCenter="true">
<h:form prependId="false">
<h:panelGrid columns="1">
<h:outputLabel value="Are you sure?"/>

<f:facet name="footer">
<p:commandButton value="Yes"
actionListener="#{mapBean.addMarker}"
update=":messages"
oncomplete="markerAddComplete()"/>
<p:commandButton value="Cancel" onclick="return cancel()"/>
</f:facet>
</h:panelGrid>
<h:inputHidden id="lat" value="#{mapBean.lat}"/>
<h:inputHidden id="lng" value="#{mapBean.lng}"/>
</h:form>
</p:dialog>
<script type="text/javascript">
var currentMarker = null;
function handlePointClick(event) {
console.log("click event");
console.log(event.marker);
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())
});
map.addOverlay(currentMarker);
dlg.show();
}
}
function markerAddComplete() {
//currentMarker = null; Only one can be added.
dlg.hide();
}
function cancel() {
dlg.hide();
currentMarker.setMap(null);
currentMarker = null;
return false;
}
</script>

Answer 1

问题是由p:gmap的属性onPointClick引起的。在这种情况下，这是对函数handlePointClickEvent（）的Javascript回调。

所以我用一个EL表达式设置了这个属性，所以在创建标记后，这个表达式的值将为null:gmap