[TIMOB-5769] Android: Add the ability to add multiple polygons to the MapView
| GitHub Issue | n/a |
|---|---|
| Type | New Feature |
| Priority | High |
| Status | Closed |
| Resolution | Fixed |
| Resolution Date | 2015-05-28T07:14:03.000+0000 |
| Affected Version/s | Release 1.7.2 |
| Fix Version/s | Release 4.1.0 |
| Components | Android |
| Labels | SupportTeam, module_androidmapv2, qe-manualtest, qe-testadded |
| Reporter | Eduardo Gomez |
| Assignee | Ashraf Abu |
| Created | 2011-10-17T08:04:06.000+0000 |
| Updated | 2015-06-10T19:04:20.000+0000 |
Description
Feature Request
To add routes and allow for multiple polygons to be added to the MapView as well as have fill, opacity and color properties.Utilities
That would allow developers to implement geofencing (see http://en.wikipedia.org/wiki/Geo-fence) a common technique for Android apps.Customer notes
"We'd like to be able to hook into the events when a user enters and leaves a geo-fenced polygon or a radius around a geolocated point."Attachments
| File | Date | Size |
|---|---|---|
| geofence01.jpg | 2011-10-17T08:04:06.000+0000 | 47052 |
| geofence02.jpg | 2011-10-17T08:04:06.000+0000 | 151942 |
| MapsIMG_0255.PNG | 2013-02-07T01:15:13.000+0000 | 227808 |
| ti.map-android-2.3.1.zip | 2015-05-06T08:37:31.000+0000 | 3525184 |
Can be fixed on Android Maps v2
Test code app.js for PR that will be added here:
tiapp.xml that was used (for android map api key):Titanium.UI.setBackgroundColor('#000'); Ti.Map = require('ti.map'); var self = Ti.UI.createWindow({ backgroundColor : '#800' }); // create UI components var view = Ti.UI.createView({ backgroundColor : '#800', }); var mapview; // add map after window opens self.addEventListener('open', function() { // Make sure we only add the map once if (mapview !== undefined) { return; } mapview = Titanium.Map.createView({ mapType : Titanium.Map.NORMAL_TYPE, region : { latitude : 37.389569, longitude : -122.050212, latitudeDelta : 0.1, longitudeDelta : 0.1 }, animate : true, regionFit : true, userLocation : false, top : '70dp' }); // Handle all map annotation clicks mapview.addEventListener('click', function(e) { if (e.annotation && (e.clicksource === 'leftButton' || e.clicksource == 'leftPane')) { mapview.removeAnnotation(e.annotation); } }); var appc = Ti.Map.createAnnotation({ latitude : 37.389569, longitude : -122.050212, title : 'Appcelerator HQ', subtitle : 'Mountain View, CA', pincolor : Ti.Map.ANNOTATION_GREEN }); var randLoc = Ti.Map.createAnnotation({ latitude : 37.389569, longitude : -122.0855498, title : 'Random Location', subtitle : 'Mountain View, CA', pincolor : Ti.Map.ANNOTATION_ORANGE }); var apple = Ti.Map.createAnnotation({ latitude : 37.331689, longitude : -122.030731, title : 'Apple HQ', subtitle : 'Cupertino, CA', pincolor : Ti.Map.ANNOTATION_RED }); var google = Ti.Map.createAnnotation({ latitude : 37.422502, longitude : -122.0855498, title : 'Google HQ', subtitle : 'Mountain View, CA', pincolor : Ti.Map.ANNOTATION_VIOLET }); var route = Ti.Map.createRoute({ width : 4, color : '#f00', points : [{ latitude : google.latitude, longitude : google.longitude }, { latitude : appc.latitude, longitude : appc.longitude }, { latitude : apple.latitude, longitude : apple.longitude }, { latitude : randLoc.latitude, longitude : randLoc.longitude }] }); var polygon = Ti.Map.createPolygon({ fillColor : '#30f0', points : [{ latitude : google.latitude, longitude : google.longitude }, { latitude : appc.latitude, longitude : appc.longitude }, { latitude : apple.latitude, longitude : apple.longitude }, { latitude : randLoc.latitude, longitude : randLoc.longitude }] }); var circle = Ti.Map.createCircle({ center : { latitude : google.latitude, longitude : google.longitude }, radius : 3000, fillColor : '#3f00' }); var mapview = Ti.Map.createView({ mapType : Ti.Map.NORMAL_TYPE, region : { latitude : 37.389569, longitude : -122.050212, latitudeDelta : 0.2, longitudeDelta : 0.2 }, annotations : [google, appc, apple, randLoc] }); mapview.addPolygon(polygon); mapview.addCircle(circle); self.add(mapview); }); self.add(view); self.open();PR: https://github.com/appcelerator-modules/ti.map/pull/93
Closed PR 93 in favor of https://github.com/appcelerator-modules/ti.map/pull/86. Will be reviewing this PR.
Update: New PR: https://github.com/appcelerator-modules/ti.map/pull/99 https://github.com/appcelerator-modules/ti.map/pull/86 is closed. Everything in PR86 was merged into 1 commit in PR99.
Binary update PR: https://github.com/appcelerator/titanium_mobile/pull/6881
Verified the feature. We can add ploygon's & circle's on to mapview. Closing. Environment: Appc Studio : 4.1.0.201505071004 Ti SDK : 4.1.0.v20150610043614 Ti CLI : 4.0.1 Alloy : 1.6.0 MAC Yosemite : 10.10.3 Appc npm : 4.0.0 Appc CLI : 4.0.2-rc2 Node: v0.10.37 Nexus 5 - Android 5.1.1 Map Module: 2.3.1