Search code examples
androidmapsgoogle-maps-mobile

Efficient way to change color of Map Marker


I'm using a GoogleMap with lots of small markers loaded. We are talking perhaps 400-500 markers. Upon user interaction, I want to have a subset of those markers change color, perhaps 100-300 of them. I want to achieve this ideally in 30ms or under, but up to 50-60ms would be acceptable.

Right now I have code something like:

onUserInteraction... {
    changeColors(getTheSubset)
}

changeColors(subset) {
    getMarkersForSubset(subset).removeAllFromMap();
    map.addNewMarkers(subset)
}

So I remove the old markers in some color (say, green), and add new markers for those locations (say, black). When the subset is no longer relevant, I do the opposite process.

On the busiest parts of the map I am seeing this take 500ms or more, and there's noticeable lag with different markers changing colors at different times. So I am curious if there is a better math-based way to draw small circles on a map and change their colors without removing/adding markers and while minimizing alloc/gc.


Solution

  • So LevelListDrawables are not an option, due to Gmap's use of BitmapDescriptorFactory.

    One solution I found was to draw a Marker on top of the old one with the new color, then delete the old one from underneath.

    There were two issues to that.

    • One, google-maps-android-v2 doesn't support z-indexing for Markers.
    • Two, if you have a lot of Markers to change the color of, the performance of it causes artifacts.

    Now, recently Google released an update that made Markers with a common Bitmap a lot faster to draw, but you can always throw more Markers at it and break it.

    I also attempted to draw a Marker on top, but with its visibility set to false, and to then set it to true when that location got "selected". This didn't seem too much faster although in fairness I did not benchmark it.

    The conclusion: Don't change Bitmaps on Markers. (For now)