是否可以使用 Primefaces 的 gmap 将谷歌地图集中在客户当前位置?
我使用 JSF、JPA 和 primefaces 开发公共卫生信息系统。具有 GPS 功能的移动设备的现场人员需要记录位置,以便将数据记录到数据库中进行分析。
我们可以用 Primefaces gmap 来做吗?
如果不可能,我可以使用哪些其他工具和技术来实现此功能?
是否可以使用 Primefaces 的 gmap 将谷歌地图集中在客户当前位置?
我使用 JSF、JPA 和 primefaces 开发公共卫生信息系统。具有 GPS 功能的移动设备的现场人员需要记录位置,以便将数据记录到数据库中进行分析。
我们可以用 Primefaces gmap 来做吗?
如果不可能,我可以使用哪些其他工具和技术来实现此功能?
是的,这很有可能,但这又取决于客户端的网络浏览器是否支持HTML5navigator.geolocation
和/或您是否使用Google Loader API作为后备。
widgetVarName.getMap()
您可以通过where widgetVarName
is获取对具体 GMap JavaScript 对象的引用<p:gmap widgetVar>
。然后,您可以在其上使用GMap JavaScript API方法,如setCenter()
.
这是一个启动示例,前提是您要通过 HTML5 检查地理位置navigator.geolocation
并使用 Google Loader API 作为后备。
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"></script>
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<p:gmap widgetVar="w_gmap" type="HYBRID" center="41.381542, 2.122893" zoom="15" style="width:600px;height:400px" />
<script type="text/javascript">
if (navigator.geolocation) {
checkGeolocationByHTML5();
} else {
checkGeolocationByLoaderAPI(); // HTML5 not supported! Fall back to Loader API.
}
function checkGeolocationByHTML5() {
navigator.geolocation.getCurrentPosition(function(position) {
setMapCenter(position.coords.latitude, position.coords.longitude);
}, function() {
checkGeolocationByLoaderAPI(); // Error! Fall back to Loader API.
});
}
function checkGeolocationByLoaderAPI() {
if (google.loader.ClientLocation) {
setMapCenter(google.loader.ClientLocation.latitude, google.loader.ClientLocation.longitude);
} else {
// Unsupported! Show error/warning?
}
}
function setMapCenter(latitude, longitude) {
w_gmap.getMap().setCenter(new google.maps.LatLng(latitude, longitude));
}
</script>
注意:最初的中心位置41.381542, 2.122893
是从PrimeFaces 展示中复制粘贴的,我认为它代表了他们最喜欢的俱乐部的足球场 :) 您可以随意将其更改为其他任何内容,例如您自己公司的位置。
另请注意,出于安全原因,一般网络浏览器会要求最终用户确认共享位置。另请参阅有关该主题的Google Chrome 文档和Mozilla Firefox 文档。您无法关闭此部分。最终用户必须明确地接受请求。如果最终用户不允许,它将停留在初始中心位置。