iphone - How to cluster custom icons markers in GoogleMaps for iOS -
i'm developing app on want show lot of event on map. user can click on event , see lot of information it. customized marker icon of each event custom image , want cluster each custom markers. i'm able cluster default icon of googlemaps api if want cluster own marker icon i'm not able it.
here's current code :
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 image if event 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 personal marker icon (for 1 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 implements 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) } }
how can it?
look @ these screenshots of app maybe understand better issue.
you clustering first adding markers thats why happening.
what should
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 image if event 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 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 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 }
Comments
Post a Comment