Question

我们有一个JSF项目，该项目使用Primefaces 6.2在xhtml文件中使用“ p：gmap”来显示Google Map。但是，现在我们需要一种加载KML文件的方法，该文件是一个包含数以百计的多边形和其他信息的图层，这些信息应在地图中显示。但是我们还没有找到一种方法。有可能做到吗？

我们使用Java 8在Wildfly 10.1中运行我们的应用。

地图仅显示ok，但未显示KML文件。

xhtml文件如下：

<?xml version='1.0' encoding='UTF-8' ?>
<!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://xmlns.jcp.org/jsf/facelets"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:p="http://primefaces.org/ui">
    <h:head>
        <title><ui:insert name="title">Google Maps</ui:insert></title>
        <script type='text/javascript' src="http://maps.google.com/maps/api/js?key=<THE_KEY>"></script>
        <script src="http://www.google.com/jsapi" type="text/javascript" ></script>
        <style type="text/css">
            html, body {
                height: 100%;
                min-width: 480px;
                min-height: 320px;
                margin: 0;
            }
            .gmap {
                min-height: 600px;
                height: 100% !important;
                min-width: 400px;
                width: 100% !important;
            }
        </style>
    </h:head>
    <h:body>
        <h:form id="form" style="height: 100%">
            <p:growl id="growl" life="3000" />            
            <p:gmap id="gmap" widgetVar="map" center="-34.895984, -56.192544" zoom="13" type="HYBRID" styleClass="gmap"/>
            <h:outputScript>
		        $("[id='page:gmap']").ready(function(){                     
		            var gmap = PF('map').getMap();
		            /* do your stuff here */
		            console.log("Antes de empezar...");
		            if ( gmap == null ){
  						// gmap is either null or undefined
  						console.log("gmap is either null or undefined");
					} else {
						console.log("gmap NO ES either null or undefined");
						var src = 'https://www.dropbox.com/s/abo5mnfe0x3l347/<KML_FILE>';
						var kmlLayer = new google.maps.KmlLayer(src, {
						  suppressInfoWindows: true,
						  preserveViewport: false,
						  map: gmap
						});
						console.log("Despues del kmlLayer: " + kmlLayer);
		            }
		        });
    		</h:outputScript>
        </h:form>   
    </h:body>
</html>

在p：gmap上加载KML图层文件（Google地图）

0 个答案: