Skip to content

Commit 230b6ca

Browse files
naderionaderio
committed
fix clustered marker events
1 parent 6f87c79 commit 230b6ca

File tree

5 files changed

+162
-100
lines changed

5 files changed

+162
-100
lines changed

‎demo/app/main-page.js‎

Lines changed: 77 additions & 77 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
var vmModule = require("./main-view-model");
2-
var observableModule = require("data/observable");
2+
var observableModule = require("tns-core-modules/data/observable");
3+
var platform = require("tns-core-modules/platform");
34
var GoogleMaps = require("nativescript-google-maps-sdk");
45
var GoogleMapsUtils = require("nativescript-google-maps-utils");
56
// var GoogleMapsUtils = require("./dev");
@@ -23,73 +24,90 @@ function pageLoaded(args) {
2324
}
2425
exports.pageLoaded = pageLoaded;
2526

26-
function onMapReady(args) {
27-
debug("onMapReady");
2827

29-
var mapView = args.object;
28+
function configureMap(mapView, options) {
3029

31-
if (mapView.android) {
32-
33-
function configure(mapView, options) {
34-
35-
options = options || {};
36-
37-
var uiSetting = mapView.gMap.getUiSettings();
38-
39-
if ('allGesturesEnabled' in options) {
40-
uiSetting.setAllGesturesEnabled(options.allGesturesEnabled);
41-
}
42-
if ('compassEnabled' in options) {
43-
uiSetting.setCompassEnabled(options.compassEnabled);
44-
}
45-
if ('indoorLevelPickerEnabled' in options) {
46-
uiSetting.setIndoorLevelPickerEnabled(options.indoorLevelPickerEnabled);
47-
}
48-
if ('mapToolbarEnabled' in options) {
49-
uiSetting.setMapToolbarEnabled(options.mapToolbarEnabled);
50-
}
51-
if ('myLocationButtonEnabled' in options) {
52-
uiSetting.setMyLocationButtonEnabled(options.myLocationButtonEnabled);
53-
}
54-
if ('rotateGesturesEnabled' in options) {
55-
uiSetting.setRotateGesturesEnabled(options.rotateGesturesEnabled);
56-
}
57-
if ('scrollGesturesEnabled' in options) {
58-
uiSetting.setScrollGesturesEnabled(options.scrollGesturesEnabled);
59-
}
60-
if ('tiltGesturesEnabled' in options) {
61-
uiSetting.setTiltGesturesEnabled(options.tiltGesturesEnabled);
62-
}
63-
if ('zoomControlsEnabled' in options) {
64-
uiSetting.setZoomControlsEnabled(options.zoomControlsEnabled);
65-
}
66-
if ('zoomGesturesEnabled' in options) {
67-
uiSetting.setZoomGesturesEnabled(options.zoomGesturesEnabled);
68-
}
69-
70-
if ('myLocationEnabled' in options) {
71-
mapView.gMap.setMyLocationEnabled(options.myLocationEnabled);
72-
}
73-
if ('trafficEnabled' in options) {
74-
mapView.gMap.setTrafficEnabled(options.trafficEnabled);
75-
}
30+
if (platform.isAndroid) {
7631

77-
}
32+
options = options || {};
7833

34+
var uiSetting = mapView.gMap.getUiSettings();
7935

80-
configure(mapView, {
81-
compassEnabled: true,
82-
zoomControlsEnabled: true,
83-
myLocationButtonEnabled: false,
84-
mapToolbarEnabled: true,
85-
allGesturesEnabled: true,
86-
myLocationEnabled: false,
87-
trafficEnabled: true,
88-
});
36+
if ('allGesturesEnabled' in options) {
37+
uiSetting.setAllGesturesEnabled(options.allGesturesEnabled);
38+
}
39+
if ('compassEnabled' in options) {
40+
uiSetting.setCompassEnabled(options.compassEnabled);
41+
}
42+
if ('indoorLevelPickerEnabled' in options) {
43+
uiSetting.setIndoorLevelPickerEnabled(options.indoorLevelPickerEnabled);
44+
}
45+
if ('mapToolbarEnabled' in options) {
46+
uiSetting.setMapToolbarEnabled(options.mapToolbarEnabled);
47+
}
48+
if ('myLocationButtonEnabled' in options) {
49+
uiSetting.setMyLocationButtonEnabled(options.myLocationButtonEnabled);
50+
}
51+
if ('rotateGesturesEnabled' in options) {
52+
uiSetting.setRotateGesturesEnabled(options.rotateGesturesEnabled);
53+
}
54+
if ('scrollGesturesEnabled' in options) {
55+
uiSetting.setScrollGesturesEnabled(options.scrollGesturesEnabled);
56+
}
57+
if ('tiltGesturesEnabled' in options) {
58+
uiSetting.setTiltGesturesEnabled(options.tiltGesturesEnabled);
59+
}
60+
if ('zoomControlsEnabled' in options) {
61+
uiSetting.setZoomControlsEnabled(options.zoomControlsEnabled);
62+
}
63+
if ('zoomGesturesEnabled' in options) {
64+
uiSetting.setZoomGesturesEnabled(options.zoomGesturesEnabled);
65+
}
8966

67+
if ('myLocationEnabled' in options) {
68+
mapView.gMap.setMyLocationEnabled(options.myLocationEnabled);
69+
}
70+
if ('trafficEnabled' in options) {
71+
mapView.gMap.setTrafficEnabled(options.trafficEnabled);
72+
}
9073

9174
}
9275

76+
}
77+
78+
function generateRandomPosition(position, distance) {
79+
var r = distance / 111300;
80+
81+
var x = position[0];
82+
var y = position[1];
83+
84+
var u = Math.random();
85+
var v = Math.random();
86+
87+
var w = r * Math.sqrt(u);
88+
var t = 2 * Math.PI * v;
89+
90+
var dx = w * Math.cos(t) / Math.cos(y);
91+
var xy = w * Math.sin(t);
92+
93+
return [x + dx, y + xy];
94+
}
95+
96+
function onMapReady(args) {
97+
debug("onMapReady");
98+
99+
var mapView = args.object;
100+
101+
configureMap(mapView, {
102+
compassEnabled: true,
103+
zoomControlsEnabled: true,
104+
myLocationButtonEnabled: false,
105+
mapToolbarEnabled: true,
106+
allGesturesEnabled: true,
107+
myLocationEnabled: false,
108+
trafficEnabled: true,
109+
});
110+
93111
debug("Setting a marker...");
94112

95113
var marker = new GoogleMaps.Marker();
@@ -105,24 +123,6 @@ function onMapReady(args) {
105123
var positionSet;
106124
var makerSet;
107125

108-
function generateRandomPosition(position, distance) {
109-
var r = distance / 111300;
110-
111-
var x = position[0];
112-
var y = position[1];
113-
114-
var u = Math.random();
115-
var v = Math.random();
116-
117-
var w = r * Math.sqrt(u);
118-
var t = 2 * Math.PI * v;
119-
120-
var dx = w * Math.cos(t) / Math.cos(y);
121-
var xy = w * Math.sin(t);
122-
123-
return [x + dx, y + xy];
124-
}
125-
126126
positionSet = [];
127127
for (var i = 0; i < 200; i++) {
128128
positionSet.push(generateRandomPosition([36.845026, 10.325454], 10000));

‎demo/package.json‎

Lines changed: 7 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -2,22 +2,21 @@
22
"nativescript": {
33
"id": "org.nativescript.demo",
44
"tns-ios": {
5-
"version": "2.0.0"
5+
"version": "3.0.1"
66
},
77
"tns-android": {
8-
"version": "2.5.0"
8+
"version": "3.0.1"
99
}
1010
},
1111
"dependencies": {
12-
"nativescript-google-maps-sdk": "^1.4.3",
12+
"nativescript-google-maps-sdk": "^2.1.3",
1313
"nativescript-google-maps-utils": "^0.1.2",
14-
"tns-core-modules": "^2.5.2"
14+
"tns-core-modules": "^3.0.1"
1515
},
1616
"devDependencies": {
17-
"babel-traverse": "6.7.6",
18-
"babel-types": "6.7.7",
19-
"babylon": "6.7.0",
20-
"filewalker": "0.1.2",
17+
"babel-traverse": "6.25.0",
18+
"babel-types": "6.25.0",
19+
"babylon": "6.17.3",
2120
"lazy": "1.0.11"
2221
}
2322
}

‎index.android.ts‎

Lines changed: 73 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,10 @@
22
declare var java;
33
declare var com;
44

5-
import * as utils from "utils/utils";
5+
import * as utils from "tns-core-modules/utils/utils";
66

77
import { MapView, Marker, Position } from "nativescript-google-maps-sdk"
88

9-
109
const LatLng = com.google.android.gms.maps.model.LatLng;
1110
const PolylineOptions = com.google.android.gms.maps.model.PolylineOptions;
1211
const LatLngBounds = com.google.android.gms.maps.model.LatLngBounds;
@@ -48,20 +47,84 @@ export function disableDebug(): void {
4847
}
4948

5049

50+
const CustomClusterItem = java.lang.Object.extend({
51+
52+
interfaces: [ClusterItem],
53+
54+
marker: null, // will be attached manually later
55+
56+
init: function () { },
57+
58+
getMarker: function () {
59+
return this.marker;
60+
},
61+
62+
getPosition: function () {
63+
return this.marker.position.android;
64+
},
65+
66+
getTitle: function () {
67+
return this.marker.title;
68+
},
69+
70+
getSnippet: function () {
71+
return this.marker.snippet;
72+
},
73+
74+
});
75+
76+
77+
const CustomClusterManager = ClusterManager.extend({
78+
79+
mapView: null, // will be attached manually later
80+
81+
onMarkerClick(gmsMarker) {
82+
this.super.onMarkerClick(gmsMarker);
83+
let marker = this.mapView.findMarker((marker) => {
84+
if (marker.android.getId) {
85+
return marker.android.getId() === gmsMarker.getId();
86+
}
87+
return marker.title === gmsMarker.getTitle() && marker.snippet === gmsMarker.getSnippet() && marker.position.android.equals(gmsMarker.getPosition());
88+
});
89+
marker && this.mapView.notifyMarkerTapped(marker);
90+
return false;
91+
},
92+
93+
onInfoWindowClick(gmsMarker) {
94+
this.super.onInfoWindowClick(gmsMarker);
95+
let marker = this.mapView.findMarker((marker) => {
96+
if (marker.android.getId) {
97+
return marker.android.getId() === gmsMarker.getId();
98+
}
99+
return marker.title === gmsMarker.getTitle() && marker.snippet === gmsMarker.getSnippet() && marker.position.android.equals(gmsMarker.getPosition());
100+
});
101+
marker && this.mapView.notifyMarkerInfoWindowTapped(marker);
102+
return false;
103+
},
104+
105+
});
106+
51107
export function setupMarkerCluster(mapView: MapView, markers: Array<Marker>, options) {
52108
debug('setupMarkerCluster');
53109

54-
var clusterManager = new ClusterManager(utils.ad.getApplicationContext(), mapView.gMap);
110+
var clusterManager = new CustomClusterManager(utils.ad.getApplicationContext(), mapView.gMap);
111+
112+
clusterManager.mapView = mapView;
55113

56-
mapView.gMap.setOnCameraIdleListener(clusterManager);
114+
if (mapView.gMap.setOnCameraIdleListener) {
115+
mapView.gMap.setOnCameraIdleListener(clusterManager);
116+
} else if (mapView.gMap.setOnCameraChangeListener) {
117+
mapView.gMap.setOnCameraChangeListener(clusterManager);
118+
}
119+
120+
mapView.gMap.setOnMarkerClickListener(clusterManager);
121+
mapView.gMap.setOnInfoWindowClickListener(clusterManager);
57122

58123
markers.forEach(function (marker) {
59-
clusterManager.addItem(new ClusterItem({
60-
rotation: marker.rotation,
61-
getPosition: function () {
62-
return marker.position.android;
63-
}
64-
}));
124+
let markerItem = new CustomClusterItem();
125+
markerItem.marker = marker;
126+
clusterManager.addItem(markerItem);
127+
mapView._markers.push(marker);
65128
});
66129

67130
clusterManager.cluster();

‎package.json‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "nativescript-google-maps-utils",
3-
"version": "0.1.2",
3+
"version": "0.2.0",
44
"description": "NativeScript Google Maps SDK utility library to support features such as marker clustering, heatmap, ...",
55
"main": "index",
66
"nativescript": {
@@ -30,9 +30,9 @@
3030
},
3131
"homepage": "https://github.com/naderio/nativescript-google-maps-utils#readme",
3232
"devDependencies": {
33-
"tns-core-modules": "^2.5.2",
34-
"tns-platform-declarations": "^2.5.2",
35-
"typescript": "^2.1.6"
33+
"tns-core-modules": "^3.0.1",
34+
"tns-platform-declarations": "^3.0.1",
35+
"typescript": "^2.3.4"
3636
},
3737
"dependencies": {
3838
"nativescript-google-maps-sdk": "*"

‎platforms/android/include.gradle‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,5 +7,5 @@ android {
77
}
88

99
dependencies {
10-
compile 'com.google.maps.android:android-maps-utils:0.4.+'
10+
compile 'com.google.maps.android:android-maps-utils:0.5'
1111
}

0 commit comments

Comments
 (0)