1

場所を検索すると地図が更新されますが、センタリング値は更新されません。

/* 以下に xhtml を示します */

<h:outputLabel value="Search Location :" for="acSimple" />
<p:autoComplete id="acSimple" minQueryLength="0" value="#{sampleMapProducer.searchString}" forceSelection="true" completeMethod="#{sampleMapProducer.complete}">
    <p:ajax event="itemSelect" update="gmap_loc" process="#{sampleMapProducer.searchCenter}" />
    <p:ajax process="@this" update="gmap_loc" />
</p:autoComplete>
<p:outputPanel id="gmapPanel" autoUpdate="true">
    <p:gmap center="#{sampleMapProducer.searchCenter}" zoom="6" type="ROADMAP" style="width:100%;height:600px" model="#{sampleMapProducer.mapBySearch}" id="gmap_loc"></p:gmap>
</p:outputPanel>

マップの Bean コード:

private void clearMap (MapModel map)
{
    for (Marker marker : map.getMarkers()) {
        marker.setVisible(false);
    }
}

/* 検索用の地図を取得 */

 public MapModel getMapBySearch () 
 {
    clearMap(mapBySearch);
    for (Marker markerIterator : markersList)
    {
        if (searchString == null || searchString.trim().equals(""))
        {
            mapBySearch.addOverlay(markerForLocation(markerIterator,BLUE_DOT));
        }
        else
        {
          if (markerIterator.getTitle().toLowerCase().contains(searchString.toLowerCase()))
            {
                mapBySearch.addOverlay(markerForLocation(markerIterator,BLUE_DOT));
            }
        }
    }
    return mapBySearch;
}

/* オートコンプリート文字列 */

public List<String> complete ( String searchString) 
{
    List<String> suggestedStrings = new ArrayList<String>();
    for (String locationName : LOCATION_NAMES)
    {
        if (locationName.toLowerCase().contains(searchString.toLowerCase())) {
            suggestedStrings.add(locationName);
        }
    }
    this.searchString = searchString;
    return suggestedStrings;
}

/* ロケーションセンターを取得 */

public String getLocationCenter () 
{ 
    String center = "39,-98"; 
    for (LocationGeocodeBean geoCode : GEO_CODES) 
    { 
        if (geoCode.getId().equals(selectedLocationId())) 
        { 
            if ((geoCode.getLatitude() != 0) && (geoCode.getLongitude() != 0)) 
            { 
                center = String.format("%s,%s", geoCode.getLatitude(),geoCode.getLongitude()); } 
                return center; 
            } 
        } 

    }
    return center; 
}
4

1 に答える 1

0

あなたのコードを完全には理解していないので、簡単な例を作成しました。マップにいくつかのマーカーを配置し、マップをクリックすると、マップの中心がマーカーになります。コールバック パラメータを利用できます。したがって、フォームで何かをクリックまたは選択すると、パラメーターが返され、これが JavaScript でキャッチされ、マップが更新されます。次の例を試してください。

豆：

public class MapBean
{
    private MapModel advancedModel;

    public MapBean()
    {   
    advancedModel = new DefaultMapModel();

    LatLng coord1 = new LatLng(36.883707, 30.689216);
    LatLng coord2 = new LatLng(36.879703, 30.706707);
    LatLng coord3 = new LatLng(36.885233, 30.702323);

    advancedModel.addOverlay(new Marker(coord1));
    advancedModel.addOverlay(new Marker(coord2));
    advancedModel.addOverlay(new Marker(coord3));

    }

    public MapModel getAdvancedModel()
    {

    return advancedModel;
    }

    public void onMarkerSelect(OverlaySelectEvent event)
    {   
    Marker marker = (Marker) event.getOverlay();
    RequestContext context = RequestContext.getCurrentInstance();        
        context.addCallbackParam("lat", marker.getLatlng().getLat()); 
        context.addCallbackParam("lng", marker.getLatlng().getLng());        
    }

}

そして、.xhtml

<h:form id="form">
    <p:gmap center="36.890257,30.707417" zoom="13" type="HYBRID" model="#{mapBean.advancedModel}" style="width:600px;height:400px" id="maps" widgetVar="map" onPointClick="pointClick(event)">
        <p:ajax event="overlaySelect" listener="#{mapBean.onMarkerSelect}" oncomplete="handleComplete(xhr, status, args)"/>
    </p:gmap>
    <script type="text/javascript">  
        function handleComplete(xhr, status, args) 
        {  
            //Create center point from callback params
            var latlng = new google.maps.LatLng(args.lat , args.lng);
            //Get de google map from your widget now you can use the googlemap api
            var gmap = map.getMap();
            gmap.setCenter(latlng);                   
        }   
    </script>  
</h:form>
于 2013-09-11T06:46:03.083 に答える