1

我正在嘗試爲我的Google地圖標記實施羣集。目前我有一些自定義標記顏色,當您點擊它們時會觸發一個API調用。當這些結果被加載時,將會打開一個包含該標記的特定信息的底部表格。Android Google地圖markerClickListener for clusterItems

我想保留相同的功能(自定義標記/ clickListeners /標記周圍的半徑),但在縮小時添加羣集。我看過不同來源獲得幫助:

Android cluster and marker clicks

Android marker-clustering

MarkerManager.java

,但我不知道如何實現自定義標記,並偵聽器集羣項目。我可以使用標準標記獲得羣集,而不需要clicklisteners。這裏是一些圖像的插圖:

這是我目前的情況(我想要聚集這些標記)。正如你所看到的,下頁彈出,當我一個標記,點擊

Current sitution

這是我目前能夠做到的,但我想它與以前的圖片相結合

Cluster map

這裏是我的我的地圖片段的代碼的重要組成部分,(該Point類並實現ClusterItem接口):

private Map<Marker, Point> retailerInfo = new HashMap<>(); 

    private void markGeofencesOnMap() { 
     new GeofenceAreasRequest().getAllAreas(new GeofenceAreasCallback() { 
      @Override 
      public void onAreasLoaded(List<Point> points) { 
       for (final Point point : points) { 
        markerForGeofence(point); 
        drawRadius(point); 
       } 
      } 
      @Override 
      public void failedOnAreasLoaded(int message) { 
       Snackbar.make(coordinatorLayout, R.string.failed_loading_areas, Snackbar.LENGTH_LONG).show(); 
      } 
     }); 
    } 

    private void markerForGeofence(Point point) { 
     LatLng latLng = new LatLng(point.getLatitude(), point.getLongitude()); 
     MarkerOptions markerOptions = new MarkerOptions() 
       .position(latLng) 
       .flat(true) 
       .title(point.getTitle()) 
       .icon(BitmapDescriptorFactory.defaultMarker(195)); 
//  markerManager.getCollection("markerCollection").addMarker(markerOptions); 
//  markerManager.getCollection("markerCollection").setOnMarkerClickListener(this); 
//  mClusterManager.addItem(point); 
     geoFenceMarker = googleMap.addMarker(markerOptions); 
     retailerInfo.put(geoFenceMarker, point); 
    } 

    private void drawRadius(Point point) { 
     CircleOptions circleOptions = new CircleOptions() 
       .center(geoFenceMarker.getPosition()) 
       .strokeColor(Color.argb(50, 70, 70, 70)) 
       .fillColor(Color.argb(100, 150, 150, 150)) 
       .radius(point.getRadius()); 
     googleMap.addCircle(circleOptions); 
    } 

    private void googleMapSettings() { 
     int permissionCheck = ContextCompat.checkSelfPermission(getActivity(), 
       Manifest.permission.ACCESS_FINE_LOCATION); 
     if (permissionCheck == PackageManager.PERMISSION_GRANTED) { 
      googleMap.setMyLocationEnabled(true); 
     } else { 
      SystemRequirementsChecker.checkWithDefaultDialogs(getActivity()); 
     } 
     googleMap.getUiSettings().setZoomControlsEnabled(true); 
     CameraPosition cameraPosition = new CameraPosition.Builder().target(getLastLocation()).zoom(12).build(); 
     googleMap.animateCamera(CameraUpdateFactory.newCameraPosition(cameraPosition)); 
     googleMap.setOnMapClickListener(this); 
//  markerManager = new MarkerManager(googleMap); 
//  markerManager.newCollection("markerCollection"); 
//  mClusterManager = new ClusterManager<Point>(getActivity(), googleMap);//, markerManager); 
//  googleMap.setOnMarkerClickListener(mClusterManager); //markerManager); 
     googleMap.setOnCameraIdleListener(mClusterManager); 
     googleMap.setOnMarkerClickListener(this); 
    } 

    @Override 
    public boolean onMarkerClick(Marker marker) { 
     if (retailerInfo != null) { 
      String retailerId = retailerInfo.get(marker).getRetailer(); 
      new RetailersRequest().getRetailer(retailerId, new RetailersCallback() { 
       @Override 
       public void onRetailersLoad(List<Retailer> retailers) { 
        for (final Retailer retailer : retailers) { 
         mMapRetailerName.setText(retailer.getName()); 
         mMapRetailerStreet.setText(retailer.getStreet()); 
         mMapRetailerHouseNr.setText(retailer.getHousenumber()); 
         mMapRetailerPostalCode.setText(retailer.getPostalCode()); 
         mMapRetailerCity.setText(retailer.getCity()); 
        } 
        bottomSheet.setVisibility(View.VISIBLE); 
        mBottomSheetBehavior.setPeekHeight(400); 
        mBottomSheetBehavior.setState(BottomSheetBehavior.STATE_COLLAPSED); 
       } 

       @Override 
       public void failedOnRetailersLoaded(int code) { 
        Snackbar.make(coordinatorLayout, getString(R.string.failed_loading_retailers) + code, Snackbar.LENGTH_LONG).show(); 
       } 
      }); 
      CameraPosition cameraPosition = new CameraPosition.Builder().target(marker.getPosition()).zoom(14).build(); 
      googleMap.animateCamera(CameraUpdateFactory.newCameraPosition(cameraPosition)); 
     } 
     return true; 
    } 

    @Override 
    public void onMapClick(LatLng latLng) { 
     bottomSheet.setVisibility(View.GONE); 
    } 

    @Override 
    public void onMapReady(GoogleMap googleMap) { 
     this.googleMap = googleMap; 
     googleMapSettings(); 
     markGeofencesOnMap(); 
    } 

我希望有人能幫助我走出正確的方向。謝謝!

回答

0

好的,在發現更多的痕跡和錯誤之後,我想我已經整理了大部分內容。我所要做的只是將自定義DefaultClusterRenderer附加到我的clusterManager。在地圖片段中,我可以使用onClusterItemClick來處理標記點擊。我仍然存在的一個問題是,在放大和縮小時,這些圓圈並未全部正確呈現。

private void markGeofencesOnMap() { 
    new GeofenceAreasRequest().getAllAreas(new GeofenceAreasCallback() { 
     @Override 
     public void onAreasLoaded(List<Point> points) { 
      for (final Point point : points) { 
       mClusterManager.addItem(point); 
      } 
     } 
    }); 
} 

private void googleMapSettings() {   
    mClusterManager = new ClusterManager<Point>(getActivity(), googleMap); 
    // attach custom renderer behaviour 
    mClusterManager.setRenderer(new OwnPointRendered(getActivity().getApplicationContext(), googleMap, mClusterManager)); 
    mClusterManager.setOnClusterItemClickListener(this); 
    googleMap.setOnMarkerClickListener(mClusterManager); 
    googleMap.setOnCameraIdleListener(mClusterManager); 
} 

@Override 
public boolean onClusterItemClick(ClusterItem clusterItem) { 
    // cast ClusterItem to my Point class to handle marker clicks 
    Point retailer = (Point) clusterItem; 
    String retailerId = retailer.getRetailer(); 
    return true; 
} 

OwnPointRendered.class

public class OwnPointRendered extends DefaultClusterRenderer<Point> { 
private final GoogleMap map; 
private List<Circle> circleList = new ArrayList<>(); 

public OwnPointRendered(Context context, GoogleMap map, 
         ClusterManager<Point> clusterManager) { 
    super(context, map, clusterManager); 
    this.map = map; 
} 

@Override 
protected void onBeforeClusterItemRendered(Point item, MarkerOptions markerOptions) { 
    markerOptions.flat(true); 
    markerOptions.icon(BitmapDescriptorFactory.defaultMarker(195)); 
    drawRadius(item); 
    super.onBeforeClusterItemRendered(item, markerOptions); 
} 

@Override 
protected void onClusterRendered(Cluster<Point> cluster, Marker marker) { 
    super.onClusterRendered(cluster, marker); 
    for (Circle circle : circleList) { 
     circle.remove(); 
    } 
    circleList.clear(); 
} 

private void drawRadius(Point point) { 
    CircleOptions circleOptions = new CircleOptions() 
      .center(point.getPosition()) 
      .strokeColor(Color.argb(50, 70, 70, 70)) 
      .fillColor(Color.argb(100, 150, 150, 150)) 
      .radius(point.getRadius()); 
    Circle circle = map.addCircle(circleOptions); 
    circleList.add(circle); 
} 
+0

沒有人找到一個解決方案,除去圈? –