Click events on polygons in ti.map are slow on Android

I have a map where I add some polygons to indicate some areas (I get them as GeoJSON format). When the user clicks on a polygon I show the user some information about that area.

When the number of points in the polygons increase then this becomes slow on Android - or even sometimes crash the app.

This is the way I load the map:

mapView = Map.createView({
    mapType:Map.SATELLITE_TYPE,
    userLocation:true,
    rotateEnabled: false,
    bubbleParent:false    // Edit 2
});
mapView.addEventListener('click',clickHandler);
$.map.add(mapView);

I then set region and draw some polygons like this:

Ti.API.info('Set region and draw polygon: e.coords=' + JSON.stringify(e.coords));
mapView.setRegion({
    latitude:e.coords.latitude,
    longitude:e.coords.longitude,
    latitudeDelta:(currentLatDelta > 0.02 ? 0.02 : currentLatDelta),
    longitudeDelta:(currentLonDelta > 0.02 ? 0.02 : currentLonDelta)
});
mapView.addPolygon(getPolygon(e.coords));
mapView.addPolygon(getPolygonArea(area1));
mapView.addPolygon(getPolygonArea(area2));

The getPolygon method is a simple test method:

function getPolygon(pt){
    // return a polygon relative to the point
    var points = [];
    points.push({latitude:pt.latitude - 0.001, longitude:pt.longitude - 0.0012});
    points.push({latitude:pt.latitude - 0.001, longitude:pt.longitude + 0.0012});
    points.push({latitude:pt.latitude, longitude:pt.longitude + 0.002});
    points.push({latitude:pt.latitude + 0.001, longitude:pt.longitude + 0.0012});
    points.push({latitude:pt.latitude + 0.001, longitude:pt.longitude - 0.0012});
    points.push({latitude:pt.latitude, longitude:pt.longitude - 0.002});
    points.push({latitude:pt.latitude - 0.001, longitude:pt.longitude - 0.0012});
    Ti.API.info('getPolygon: points=' + JSON.stringify(points));
    var poly = Map.createPolygon({
        points: points,
        id:'poly',
        fillColor: '#55ec858f',
        strokeColor: 'black',
        strokeWidth: 1,
        bubbleParent:false    // Edit 2
    });
/* --> This event never triggers
    poly.addEventListener('singleTap', function(e){
        alert('Clicked inside: ' + e.shape.id);
        e.bubbleParent = false;
    });
*/
    return poly;
}

And the getPolygonArea method just creates the polygon based on a GeoJSON data structure (with all the points):

function getPolygonArea(area){
    var points = [];
    var i = 0;
    _.each(area.geometry.coordinates[0][0], function(point) {
        points.push({
            latitude : point[0],
            longitude : point[1]
        });
        i++;
    });
    console.info("Added " + i + " points for: " + area.properties.NAVN);
    var poly = Map.createPolygon({
        points : points,
        id : area.properties.NAVN,
        fillColor : '#66FF0000',
        strokeColor : 'black',
        strokeWidth : 1,
        bubbleParent:false    // Edit 2
    });
    return poly;
}

Obviously the latter is closer to my real code ;-)

If I just add the first simple polygon then the click event is caught immediately. If I add the area1 polygon (it has 80 points) then the click on any of the two polygons takes approx. 1 second. If I add the area2 polygon (with 320 points) then a click on any of the three polygons takes 4-5 seconds...

In my real app I have seen it take up to 45 seconds or even crash the app in places where there are several of these areas on the map (with many points).

I only draw the areas near where the user is located - so trying to restrict number of points drawn.

I have tried to add an event listener to the polygon (see the comments above) but has not been able to trigger it. I have tried: click, polygonClick and singleTap (following various mentions in my search of a solution).

So it seems the global eventhandler for the map is the one that I must use. That triggers - but with the delays...

On iOS - it just works. The event triggers immediately.

What can I do to make this work on Android?

I am on:

Mac OS 10.12.1
Appcelerator Studio, build: 4.8.0.201611120604
Titanium SDK: 5.5.0.GA
Test device: Nexus 5 - Android 6

Thanks in advance!

Edit

I have tried to upgrade my environment to the latest versions to see if that had any effect:

Appcelerator Studio, build: 4.8.1.201611291132
Titanium SDK: 6.0.0.GA
ti.map: 3.1.0 for Android

But alas it made no difference - still dead slow :-(

If you don't know the GeoJSON format then you can see an example here (the areas that I am drawing)

Edit (2)

I tried to replace the click event with a longclick event. And the long-click reacts exactly as expected. However, a click still locks the screen for 4-5 seconds.

Therefore, I had a look at the LogCat in the Android Device Monitor, and it shows among other things entries like this that could seem to be related (see eg. here):

12-05 12:28:44.406: I/InputDispatcher(883): Window 'Window{f958ab5 u0 dk.dalsgaarddata.mapdemo/org.appcelerator.titanium.TiActivity}' spent 2530.9ms processing the last input event: MotionEvent(deviceId=7, source=0x00001002, action=0, actionButton=0x00000000, flags=0x00000000, metaState=0x00000000, buttonState=0x00000000, edgeFlags=0x00000000, xPrecision=1.0, yPrecision=1.0, displayId=0, pointers=[0: (203.0, 788.0)]), policyFlags=0x62000000
12-05 12:28:44.407: I/InputDispatcher(883): Window 'Window{f958ab5 u0 dk.dalsgaarddata.mapdemo/org.appcelerator.titanium.TiActivity}' spent 2524.3ms processing the last input event: MotionEvent(deviceId=7, source=0x00001002, action=2, actionButton=0x00000000, flags=0x00000000, metaState=0x00000000, buttonState=0x00000000, edgeFlags=0x00000000, xPrecision=1.0, yPrecision=1.0, displayId=0, pointers=[0: (205.0, 790.0)]), policyFlags=0x62000000
12-05 12:28:44.408: I/InputDispatcher(883): Window 'Window{f958ab5 u0 dk.dalsgaarddata.mapdemo/org.appcelerator.titanium.TiActivity}' spent 2516.3ms processing the last input event: MotionEvent(deviceId=7, source=0x00001002, action=2, actionButton=0x00000000, flags=0x00000000, metaState=0x00000000, buttonState=0x00000000, edgeFlags=0x00000000, xPrecision=1.0, yPrecision=1.0, displayId=0, pointers=[0: (217.0, 793.0)]), policyFlags=0x62000000
12-05 12:28:44.409: I/InputDispatcher(883): Window 'Window{f958ab5 u0 dk.dalsgaarddata.mapdemo/org.appcelerator.titanium.TiActivity}' spent 2507.7ms processing the last input event: MotionEvent(deviceId=7, source=0x00001002, action=2, actionButton=0x00000000, flags=0x00000000, metaState=0x00000000, buttonState=0x00000000, edgeFlags=0x00000000, xPrecision=1.0, yPrecision=1.0, displayId=0, pointers=[0: (237.0, 798.0)]), policyFlags=0x62000000
12-05 12:28:44.410: I/InputDispatcher(883): Window 'Window{f958ab5 u0 dk.dalsgaarddata.mapdemo/org.appcelerator.titanium.TiActivity}' spent 2499.4ms processing the last input event: MotionEvent(deviceId=7, source=0x00001002, action=2, actionButton=0x00000000, flags=0x00000000, metaState=0x00000000, buttonState=0x00000000, edgeFlags=0x00000000, xPrecision=1.0, yPrecision=1.0, displayId=0, pointers=[0: (255.0, 804.0)]), policyFlags=0x62000000
12-05 12:28:44.411: I/InputDispatcher(883): Window 'Window{f958ab5 u0 dk.dalsgaarddata.mapdemo/org.appcelerator.titanium.TiActivity}' spent 2491.1ms processing the last input event: MotionEvent(deviceId=7, source=0x00001002, action=2, actionButton=0x00000000, flags=0x00000000, metaState=0x00000000, buttonState=0x00000000, edgeFlags=0x00000000, xPrecision=1.0, yPrecision=1.0, displayId=0, pointers=[0: (277.0, 813.0)]), policyFlags=0x62000000
12-05 12:28:44.412: I/InputDispatcher(883): Window 'Window{f958ab5 u0 dk.dalsgaarddata.mapdemo/org.appcelerator.titanium.TiActivity}' spent 2483.1ms processing the last input event: MotionEvent(deviceId=7, source=0x00001002, action=2, actionButton=0x00000000, flags=0x00000000, metaState=0x00000000, buttonState=0x00000000, edgeFlags=0x00000000, xPrecision=1.0, yPrecision=1.0, displayId=0, pointers=[0: (297.0, 822.0)]), policyFlags=0x62000000
12-05 12:28:44.413: I/InputDispatcher(883): Window 'Window{f958ab5 u0 dk.dalsgaarddata.mapdemo/org.appcelerator.titanium.TiActivity}' spent 2474.6ms processing the last input event: MotionEvent(deviceId=7, source=0x00001002, action=2, actionButton=0x00000000, flags=0x00000000, metaState=0x00000000, buttonState=0x00000000, edgeFlags=0x00000000, xPrecision=1.0, yPrecision=1.0, displayId=0, pointers=[0: (322.0, 835.0)]), policyFlags=0x62000000
12-05 12:28:44.414: I/InputDispatcher(883): Window 'Window{f958ab5 u0 dk.dalsgaarddata.mapdemo/org.appcelerator.titanium.TiActivity}' spent 2466.5ms processing the last input event: MotionEvent(deviceId=7, source=0x00001002, action=2, actionButton=0x00000000, flags=0x00000000, metaState=0x00000000, buttonState=0x00000000, edgeFlags=0x00000000, xPrecision=1.0, yPrecision=1.0, displayId=0, pointers=[0: (343.0, 847.0)]), policyFlags=0x62000000
12-05 12:28:44.415: I/InputDispatcher(883): Window 'Window{f958ab5 u0 dk.dalsgaarddata.mapdemo/org.appcelerator.titanium.TiActivity}' spent 2457.9ms processing the last input event: MotionEvent(deviceId=7, source=0x00001002, action=2, actionButton=0x00000000, flags=0x00000000, metaState=0x00000000, buttonState=0x00000000, edgeFlags=0x00000000, xPrecision=1.0, yPrecision=1.0, displayId=0, pointers=[0: (363.0, 859.0)]), policyFlags=0x62000000
12-05 12:28:44.417: I/InputDispatcher(883): Window 'Window{f958ab5 u0 dk.dalsgaarddata.mapdemo/org.appcelerator.titanium.TiActivity}' spent 2449.7ms processing the last input event: MotionEvent(deviceId=7, source=0x00001002, action=2, actionButton=0x00000000, flags=0x00000000, metaState=0x00000000, buttonState=0x00000000, edgeFlags=0x00000000, xPrecision=1.0, yPrecision=1.0, displayId=0, pointers=[0: (381.0, 869.0)]), policyFlags=0x62000000
12-05 12:28:44.418: I/InputDispatcher(883): Window 'Window{f958ab5 u0 dk.dalsgaarddata.mapdemo/org.appcelerator.titanium.TiActivity}' spent 2441.1ms processing the last input event: MotionEvent(deviceId=7, source=0x00001002, action=2, actionButton=0x00000000, flags=0x00000000, metaState=0x00000000, buttonState=0x00000000, edgeFlags=0x00000000, xPrecision=1.0, yPrecision=1.0, displayId=0, pointers=[0: (398.0, 878.0)]), policyFlags=0x62000000
12-05 12:28:44.419: I/InputDispatcher(883): Window 'Window{f958ab5 u0 dk.dalsgaarddata.mapdemo/org.appcelerator.titanium.TiActivity}' spent 2433.2ms processing the last input event: MotionEvent(deviceId=7, source=0x00001002, action=2, actionButton=0x00000000, flags=0x00000000, metaState=0x00000000, buttonState=0x00000000, edgeFlags=0x00000000, xPrecision=1.0, yPrecision=1.0, displayId=0, pointers=[0: (408.0, 885.0)]), policyFlags=0x62000000
12-05 12:28:44.420: I/InputDispatcher(883): Window 'Window{f958ab5 u0 dk.dalsgaarddata.mapdemo/org.appcelerator.titanium.TiActivity}' spent 2424.7ms processing the last input event: MotionEvent(deviceId=7, source=0x00001002, action=2, actionButton=0x00000000, flags=0x00000000, metaState=0x00000000, buttonState=0x00000000, edgeFlags=0x00000000, xPrecision=1.0, yPrecision=1.0, displayId=0, pointers=[0: (417.0, 891.0)]), policyFlags=0x62000000
12-05 12:28:44.422: I/InputDispatcher(883): Window 'Window{f958ab5 u0 dk.dalsgaarddata.mapdemo/org.appcelerator.titanium.TiActivity}' spent 2416.7ms processing the last input event: MotionEvent(deviceId=7, source=0x00001002, action=2, actionButton=0x00000000, flags=0x00000000, metaState=0x00000000, buttonState=0x00000000, edgeFlags=0x00000000, xPrecision=1.0, yPrecision=1.0, displayId=0, pointers=[0: (424.0, 895.0)]), policyFlags=0x62000000
12-05 12:28:44.423: I/InputDispatcher(883): Window 'Window{f958ab5 u0 dk.dalsgaarddata.mapdemo/org.appcelerator.titanium.TiActivity}' spent 2408.0ms processing the last input event: MotionEvent(deviceId=7, source=0x00001002, action=2, actionButton=0x00000000, flags=0x00000000, metaState=0x00000000, buttonState=0x00000000, edgeFlags=0x00000000, xPrecision=1.0, yPrecision=1.0, displayId=0, pointers=[0: (430.0, 899.0)]), policyFlags=0x62000000
12-05 12:28:44.424: I/InputDispatcher(883): Window 'Window{f958ab5 u0 dk.dalsgaarddata.mapdemo/org.appcelerator.titanium.TiActivity}' spent 2400.0ms processing the last input event: MotionEvent(deviceId=7, source=0x00001002, action=2, actionButton=0x00000000, flags=0x00000000, metaState=0x00000000, buttonState=0x00000000, edgeFlags=0x00000000, xPrecision=1.0, yPrecision=1.0, displayId=0, pointers=[0: (438.0, 905.0)]), policyFlags=0x62000000
12-05 12:28:44.424: I/InputDispatcher(883): Window 'Window{f958ab5 u0 dk.dalsgaarddata.mapdemo/org.appcelerator.titanium.TiActivity}' spent 2391.4ms processing the last input event: MotionEvent(deviceId=7, source=0x00001002, action=2, actionButton=0x00000000, flags=0x00000000, metaState=0x00000000, buttonState=0x00000000, edgeFlags=0x00000000, xPrecision=1.0, yPrecision=1.0, displayId=0, pointers=[0: (447.0, 912.0)]), policyFlags=0x62000000
12-05 12:28:44.425: I/InputDispatcher(883): Window 'Window{f958ab5 u0 dk.dalsgaarddata.mapdemo/org.appcelerator.titanium.TiActivity}' spent 2383.3ms processing the last input event: MotionEvent(deviceId=7, source=0x00001002, action=2, actionButton=0x00000000, flags=0x00000000, metaState=0x00000000, buttonState=0x00000000, edgeFlags=0x00000000, xPrecision=1.0, yPrecision=1.0, displayId=0, pointers=[0: (456.0, 921.0)]), policyFlags=0x62000000
12-05 12:28:44.426: I/InputDispatcher(883): Window 'Window{f958ab5 u0 dk.dalsgaarddata.mapdemo/org.appcelerator.titanium.TiActivity}' spent 2374.7ms processing the last input event: MotionEvent(deviceId=7, source=0x00001002, action=2, actionButton=0x00000000, flags=0x00000000, metaState=0x00000000, buttonState=0x00000000, edgeFlags=0x00000000, xPrecision=1.0, yPrecision=1.0, displayId=0, pointers=[0: (466.0, 929.0)]), policyFlags=0x62000000
12-05 12:28:44.426: I/InputDispatcher(883): Window 'Window{f958ab5 u0 dk.dalsgaarddata.mapdemo/org.appcelerator.titanium.TiActivity}' spent 2367.0ms processing the last input event: MotionEvent(deviceId=7, source=0x00001002, action=2, actionButton=0x00000000, flags=0x00000000, metaState=0x00000000, buttonState=0x00000000, edgeFlags=0x00000000, xPrecision=1.0, yPrecision=1.0, displayId=0, pointers=[0: (476.0, 937.0)]), policyFlags=0x62000000
12-05 12:28:44.427: I/InputDispatcher(883): Window 'Window{f958ab5 u0 dk.dalsgaarddata.mapdemo/org.appcelerator.titanium.TiActivity}' spent 2358.6ms processing the last input event: MotionEvent(deviceId=7, source=0x00001002, action=2, actionButton=0x00000000, flags=0x00000000, metaState=0x00000000, buttonState=0x00000000, edgeFlags=0x00000000, xPrecision=1.0, yPrecision=1.0, displayId=0, pointers=[0: (484.0, 943.0)]), policyFlags=0x62000000
12-05 12:28:44.428: I/InputDispatcher(883): Window 'Window{f958ab5 u0 dk.dalsgaarddata.mapdemo/org.appcelerator.titanium.TiActivity}' spent 2350.8ms processing the last input event: MotionEvent(deviceId=7, source=0x00001002, action=2, actionButton=0x00000000, flags=0x00000000, metaState=0x00000000, buttonState=0x00000000, edgeFlags=0x00000000, xPrecision=1.0, yPrecision=1.0, displayId=0, pointers=[0: (490.0, 948.0)]), policyFlags=0x62000000
12-05 12:28:44.428: I/InputDispatcher(883): Window 'Window{f958ab5 u0 dk.dalsgaarddata.mapdemo/org.appcelerator.titanium.TiActivity}' spent 2342.4ms processing the last input event: MotionEvent(deviceId=7, source=0x00001002, action=2, actionButton=0x00000000, flags=0x00000000, metaState=0x00000000, buttonState=0x00000000, edgeFlags=0x00000000, xPrecision=1.0, yPrecision=1.0, displayId=0, pointers=[0: (493.0, 950.0)]), policyFlags=0x62000000
12-05 12:28:44.429: I/InputDispatcher(883): Window 'Window{f958ab5 u0 dk.dalsgaarddata.mapdemo/org.appcelerator.titanium.TiActivity}' spent 2334.3ms processing the last input event: MotionEvent(deviceId=7, source=0x00001002, action=2, actionButton=0x00000000, flags=0x00000000, metaState=0x00000000, buttonState=0x00000000, edgeFlags=0x00000000, xPrecision=1.0, yPrecision=1.0, displayId=0, pointers=[0: (494.0, 951.0)]), policyFlags=0x62000000
12-05 12:28:44.430: I/InputDispatcher(883): Window 'Window{f958ab5 u0 dk.dalsgaarddata.mapdemo/org.appcelerator.titanium.TiActivity}' spent 2348.2ms processing the last input event: MotionEvent(deviceId=7, source=0x00001002, action=1, actionButton=0x00000000, flags=0x00000000, metaState=0x00000000, buttonState=0x00000000, edgeFlags=0x00000000, xPrecision=1.0, yPrecision=1.0, displayId=0, pointers=[0: (494.0, 951.0)]), policyFlags=0x62000000

I have also tried to set bubbleParent=false on the polygons and the mapview itself (see code samples) - no noticeable difference observed.

So I guess that I need a way to entirely disable listening on the click event - as the longclick event behaves as expected - and I can live with a long click when it does not lock the app and gives the result I expect

Edit (3)

*I have found that the delay is there no matter whether I listen to the click event or not... So the best solution right now is to implement listeners for both events and then remove any polygons as soon as they are outside of the visible screen - and just redraw them if the user goes back to that area.*

/John

The problem is in this Code: https://github.com/appcelerator-modules/ti.map/blob/3359e673bfb99f1973887e611b546479b47809e2/android/src/ti/map/TiUIMapView.java#L1079

It Loops through every Overlay you have on the Map, so the more you have overlays, the slower it gets to get back an event.

My Solution was to remove all the Overlays I didn't need... (in My case I didn't need to listed to any overlay, only Annotations), and rebuilt the module. Unfortunately I have to always update my custom module to remove these loops and to get also the new features in Ti.Map.