PrimeFaces gmap组件中的fitBounds

gaw*_*awi 2 javascript google-maps-api-3 primefaces

有没有办法在PrimeFaces gmap组件创建的谷歌地图对象中调用fitBounds方法?我尝试了下面的代码,但得到javascript错误:.它看起来被PrimeFaces框架的布尔属性覆盖.TypeError: primefacesMap.fitBounds is not a functionfitBounds

<h:head>
  <script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript"/>
  <script type="text/javascript">
//<![CDATA[
  function initPrimefacesComponent(){
    var primefacesMap = gmtls.getMap();
    var bounds = new google.maps.LatLngBounds();
    var points = [
      new google.maps.LatLng(41.3, 2),
      new google.maps.LatLng(41.309, 2)
      ];
    // Extend bounds with each point
    for (var i = 0; i < points.length; i++) {
      bounds.extend(points[i]);
      new google.maps.Marker({position: points[i], map: primefacesMap});
    }
    // Apply fitBounds
    primefacesMap.fitBounds(bounds); 
  }
//]]>
  </script>
</h:head>

<h:body onload="initPrimefacesComponent();" >
  <p:gmap center="41.3, 2" zoom="15" type="ROADMAP"   widgetVar="gmtls"
    style="width:600px;height:400px" />  
</h:body>
Run Code Online (Sandbox Code Playgroud)

以下是适用于没有使用primefaces创建的谷歌地图对象的代码:

<h:head>
  <script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript"/>
  <script type="text/javascript">
//<![CDATA[
  function initOriginalMap() {
    var mapOptions = {
      center: new google.maps.LatLng(41.3, 2),
      zoom: 15
    };
    var originalMap = new google.maps.Map(document.getElementById("map-canvas"),
        mapOptions);
    var bounds = new google.maps.LatLngBounds();
    var points = [
      new google.maps.LatLng(41.3, 2),
      new google.maps.LatLng(41.309, 2)
      ];

    // Extend bounds with each point
    for (var i = 0; i < points.length; i++) {
      bounds.extend(points[i]);
      new google.maps.Marker({position: points[i], map: originalMap});
    }

    // Apply fitBounds
    originalMap.fitBounds(bounds); 
  }
  google.maps.event.addDomListener(window, 'load', initOriginalMap);
//]]>
  </script>
</h:head>

<h:body >
  <div id="map-canvas" style="width:600px;height:400px"/>
</h:body>
Run Code Online (Sandbox Code Playgroud)

gaw*_*awi 5

fitBounds在PrimeFaces中工作,我必须再次覆盖原始源的地图的fitBounds属性:

//remember the property set by PrimeFaces
var tmp = map.fitBounds;

//replace the code by the one provided by google maps api
map.fitBounds = google.maps.Map.prototype.fitBounds;

//execute fitBounds function
this.fitBounds(bounds);

//restore PrimeFaces property (probably PrimeFaces use it somehow)
this.fitBounds = tmp;
Run Code Online (Sandbox Code Playgroud)