如何在GoogleMaps for iOS中群集自定义图标标记

Question

我正在开发一个应用程序，我想在地图上显示很多事件。 用户可以单击某个事件并查看有关它的大量信息。 我使用自定义图像自定义了每个事件的标记图标，现在我想对每个自定义标记进行聚类。 我能够对GoogleMaps API的默认图标进行聚类，但如果我想将自己的标记图标聚类，我就无法进行聚类。

这是我目前的代码：

var mapView: GMSMapView!
var clusterManager: GMUClusterManager!
let isClustering: Bool = true
let isCustom: Bool = true

override func viewDidLoad() {
    super.viewDidLoad()

    mapView = GMSMapView(frame: view.frame)
    mapView.camera = GMSCameraPosition.camera(withLatitude: 13.756331, longitude: 100.501765, zoom: 12.0)
    mapView.mapType = .normal
    mapView.delegate = self
    view.addSubview(mapView)

    if isClustering {
        var iconGenerator: GMUDefaultClusterIconGenerator!
        if isCustom { // Here's my image if the event are clustered
            var images: [UIImage] = [UIImage(named: "m1.png")!, UIImage(named: "m2.png")!, UIImage(named: "m3.png")!, UIImage(named: "m4.png")!, UIImage(named: "m5.png")!]
            iconGenerator = GMUDefaultClusterIconGenerator(buckets: [5, 10, 15, 20, 25], backgroundImages: images)
        } else {
            iconGenerator = GMUDefaultClusterIconGenerator()
        }

        let algorithm = GMUNonHierarchicalDistanceBasedAlgorithm()
        let renderer = GMUDefaultClusterRenderer(mapView: mapView, clusterIconGenerator: iconGenerator)

        clusterManager = GMUClusterManager(map: mapView, algorithm: algorithm, renderer: renderer)
        clusterManager.cluster()
        clusterManager.setDelegate(self, mapDelegate: self)
    } else {
    }

    // Here's my personal marker icon (for one location)
    let firstLocation = CLLocationCoordinate2DMake(48.898902, 2.282664)
    let marker = GMSMarker(position: firstLocation)
    marker.icon = UIImage(named: "pointeurx1") //Apply custom marker
    marker.map = mapView

    let secondLocation = CLLocationCoordinate2DMake(48.924572, 2.360207)
    let secondMarker = GMSMarker(position: secondLocation)
    secondMarker.icon = UIImage(named: "pointeurx1")
    secondMarker.map = mapView

    let threeLocation = CLLocationCoordinate2DMake(48.841619, 2.253113)
    let threeMarker = GMSMarker(position: threeLocation)
    threeMarker.icon = UIImage(named: "pointeurx1")
    threeMarker.map = mapView

    let fourLocation = CLLocationCoordinate2DMake(48.858575, 2.294556)
    let fourMarker = GMSMarker(position: fourLocation)
    fourMarker.icon = UIImage(named: "pointeurx1")
    fourMarker.map = mapView

    let fiveLocation = CLLocationCoordinate2DMake(48.873819, 2.295200)
    let fiveMarker = GMSMarker(position: fiveLocation)
    fiveMarker.icon = UIImage(named: "pointeurx1")
    fiveMarker.map = mapView
}

/// Point of Interest Item which implements the GMUClusterItem protocol.
class POIItem: NSObject, GMUClusterItem {
    var position: CLLocationCoordinate2D
    var name: String!

    init(position: CLLocationCoordinate2D, name: String) {
        self.position = position
        self.name = name
    }
}

func clusterManager(_ clusterManager: GMUClusterManager, didTap cluster: GMUCluster) {
    let newCamera = GMSCameraPosition.camera(withTarget: cluster.position, zoom: mapView.camera.zoom + 1)
    let update = GMSCameraUpdate.setCamera(newCamera)
    mapView.moveCamera(update)
}
}

我该怎么做？

看看我的应用程序的这些截图，然后你可以更好地理解我的问题。

第一个是Google地图的红色默认标记图标，您可以在蓝色中看到我在项目中添加的群集图标。 然后你明白我在viewDidLoad（）上添加了一些位置，然后是红色标记。 你还可以看到另外两个不同的标记，谷歌一个是橙色，另一个是我个人标记图标，我想用于一个位置的每个标记图标。 但你也可以看到问题，问题是蓝色群集图标不添加我在地图上添加的标记图标（它在蓝色群集图标内显示4个，它是围绕它的4个图标但是当出现蓝色群集图标时它周围的标记图标不会消失。

第二张图片，如果我进行缩放，蓝色群集图标会消失，但您还可以看到另一个问题，我添加的位置还有另一个红色默认标记图标，谷歌地图显示在他们上方（你可以看到它少了因为我的个人橙色标记图标

Answer 1

您实际上是先聚类，然后添加标记，这就是为什么会发生这种情况。

你应该做的是

class MarkerModel: NSObject, GMUClusterItem {
var position: CLLocationCoordinate2D
var name: String

init(position: CLLocationCoordinate2D, name: String) {
    self.position = position
    self.name = name
}
}


override func viewDidLoad() {
super.viewDidLoad()

mapView = GMSMapView(frame: view.frame)
mapView.camera = GMSCameraPosition.camera(withLatitude: 13.756331, longitude: 100.501765, zoom: 12.0)
mapView.mapType = .normal
mapView.delegate = self
view.addSubview(mapView)

if isClustering {
    var iconGenerator: GMUDefaultClusterIconGenerator!
    if isCustom { // Here's my image if the event are clustered
        var images: [UIImage] = [UIImage(named: "m1.png")!, UIImage(named: "m2.png")!, UIImage(named: "m3.png")!, UIImage(named: "m4.png")!, UIImage(named: "m5.png")!]
        iconGenerator = GMUDefaultClusterIconGenerator(buckets: [5, 10, 15, 20, 25], backgroundImages: images)
    } else {
        iconGenerator = GMUDefaultClusterIconGenerator()
    }

    let algorithm = GMUNonHierarchicalDistanceBasedAlgorithm()
    let renderer = GMUDefaultClusterRenderer(mapView: mapView, clusterIconGenerator: iconGenerator)

    clusterManager = GMUClusterManager(map: mapView, algorithm: algorithm, renderer: renderer)

} else {
}
}

func addMarkers(cameraLatitude : Float, cameraLongitude : Float) {
    let extent = 0.01
    for index in 1...clusterItemCount {
        let lat = cameraLatitude + extent * randomScale()
        let lng = cameraLongitude + extent * randomScale()
        let name = "Item \(index)"

        let position = CLLocationCoordinate2DMake(lat, lng)

        let item = MarkerModel(position: position, name: name)
        item.icon = #imageLiteral(resourceName: "marker")
        clusterManager.add(item)
    }
     clusterManager.cluster()
        clusterManager.setDelegate(self, mapDelegate: self)
}

func randomScale() -> Double {
    return Double(arc4random()) / Double(UINT32_MAX) * 2.0 - 1.0
}

func renderer(_ renderer: GMUClusterRenderer, markerFor object: Any) -> GMSMarker? {

    let marker = GMSMarker()
    if let model = object as? MarkerModel {
         // set image view for gmsmarker
    }

    return marker
}

func clusterManager(_ clusterManager: GMUClusterManager, didTap cluster: GMUCluster) -> Bool {
    let newCamera = GMSCameraPosition.camera(withTarget: cluster.position, zoom: mapView.camera.zoom + 1)
    let update = GMSCameraUpdate.setCamera(newCamera)
    mapView.moveCamera(update)
    return false
}