Proprietary and confidential

Aurore JardMobile Lead Developer

“Design for tomorrow”

“Deconstruct what you know”

“Simplify”

“Love what you did”

@AuroreJard

April 12, 2016

Don’t lose your way optimizing maps rendering !

Talk : map optimizations ! Confidential

Requirements

Confidential

● Display○ Data as locality○ Zone on map

● User feature○ Move○ Zoom

● Access offline

Talk : map optimizations !

SDK Fight

Confidential

● Map○ https://developer.apple.com/maps/

● Google○ https://developers.google.com/maps/documentation/ios-sdk/

Talk : map optimizations !

Google Map VS Apple Maps

SDK Fight

Confidential

● Official documentation○ Maps○ Google iOS SDK

● Application also available on android : same experience on both● Map more precise● More possibilities

Talk : map optimizations !

First : easy steps

Confidential

● Get Data● Display data

Talk : map optimizations !

What about really a lot of data ?

ConfidentialTalk : map optimizations !

First impressions

Confidential

● UI/UX remarks○ Users are humans !

■ Adapt data according to zoom level■ Zone, details : only on high level of zoom■ Regroup data that eye can dissociate

● Performances○ Avoid treating data you don’t see...

Talk : map optimizations !

First : clustering

ConfidentialTalk : map optimizations !

First : clustering

Confidential

● Regroup close data○ easier user reading○ Indication on number of location

in one group

● Clustering possibilities :○ Grid based clustering○ Distance based clustering

Talk : map optimizations !

Easy optimizations :

Confidential

● Grid based clustering

Talk : map optimizations !

Easy optimizations :

Confidential

● Distance-based Clustering

Talk : map optimizations !

Second : don’t treat invisible data

Confidential

● Limitation :○ Zoom level

Talk : map optimizations !

Third : More optimization on sorting data

Confidential

● Why does it take so long ?

● Iterate over each location : 0(n)● Every move from the camera (move, zoom) need to iterate again

Talk : map optimizations !

for location in locations {if

visibleBounds.containsCoordinate(location.position) {// item should be display

} else { // ignore this location }

Third : More optimization on sorting data

Confidential

● Reduce complexity by using QuadTree object & algorithms !● Objective : subdivision of 2D space● QuadTree = Tree with 4 leafs

Talk : map optimizations !

Third : More optimization on sorting data

Confidential

● Step 1 :○ Build the tree from your initial data○ Keep iteration on all locations on that process

■ o(n) but only once

Talk : map optimizations !

Third : More optimization on sorting data

Confidential

● Step 2 :○ Search for locations in a specific area

■ Everytime you move / zoom

Talk : map optimizations !

Third : More optimization on sorting data

Confidential

● Why is it faster ?○ For loop only done once at initialisation○ Search then (user interactions)

■ O(h) (h = max depth of node in the tree)

Talk : map optimizations !

h=0

h=1

h=2

h=3

Links / Resources

Confidential

● Code :○ Open Source library for clustering with Google Map iOS SDK○ Display Large Amount of Data on iOS Map

● MapKit Apple Sample○ Apple Sample clustering

● Other○ QuadTree Interactive Explanations

Talk : map optimizations !

Have fun with maps ;)Thanks !

ConfidentialTalk : map optimizations !

Proprietary and confidential

@NurunMTL

CURIOUS TO KNOW MORE

Follow us

Nurun.com/NurunMontreal