All Projects → TradeMe → Mapme

TradeMe / Mapme

Licence: mit
The Android maps adapter

Programming Languages

kotlin
9241 projects

Projects that are alternatives of or similar to Mapme

Airbnb Android Google Map View
This is a sample Android Application which has Google Map view similar to what AirBnb Android Application. Moving Markers like Uber/Ola. Custom Google Search for places. Recycler view with Animations added.
Stars: ✭ 175 (-79.27%)
Mutual labels:  googlemaps, recyclerview, maps
js-markerclusterer
Create and manage clusters for large amounts of markers
Stars: ✭ 92 (-89.1%)
Mutual labels:  googlemaps, maps, markers
vue-mapbox-map
A minimalist Vue component wrapping Mapbox GL or MapLibre GL for dynamic interaction!
Stars: ✭ 26 (-96.92%)
Mutual labels:  maps, mapbox
angular-mapboxgl-directive
AngularJS directive for Mapbox GL
Stars: ✭ 43 (-94.91%)
Mutual labels:  maps, mapbox
Mapdeck
R interface to Deck.gl and Mapbox
Stars: ✭ 296 (-64.93%)
Mutual labels:  mapbox, maps
school-finder
👀 Find schools by location
Stars: ✭ 16 (-98.1%)
Mutual labels:  googlemaps, mapbox
Dual-color-Polyline-Animation
This library will help to show the polyline in dual color similar as Uber.
Stars: ✭ 73 (-91.35%)
Mutual labels:  maps, markers
Mappa
A canvas wrapper for Maps 🗺 🌍
Stars: ✭ 290 (-65.64%)
Mutual labels:  mapbox, maps
svelte-mapbox
MapBox Map and Autocomplete components for Svelte (or Vanilla JS)
Stars: ✭ 267 (-68.36%)
Mutual labels:  maps, mapbox
Sketch Map Generator
Sketch plugin to fill a shape with a map generated from a given location using Google Maps and Mapbox
Stars: ✭ 824 (-2.37%)
Mutual labels:  mapbox, maps
Mapbox Gl Native
Interactive, thoroughly customizable maps in native Android, iOS, macOS, Node.js, and Qt applications, powered by vector tiles and OpenGL
Stars: ✭ 4,091 (+384.72%)
Mutual labels:  mapbox, maps
Leaflet.freedraw
🌏 FreeDraw allows the free-hand drawing of shapes on your Leaflet.js map layer – providing an intuitive and familiar UX for creating geospatial boundaries similar to Zoopla and others. Included out-of-the-box is the concaving of polygons, polygon merging and simplifying, as well as the ability to add edges and modify existing shapes.
Stars: ✭ 446 (-47.16%)
Mutual labels:  maps, markers
svelte-googlemaps
Svelte Google Maps Components
Stars: ✭ 62 (-92.65%)
Mutual labels:  googlemaps, maps
google-maps-utility-library-v3-read-only
git clone of http://google-maps-utility-library-v3.googlecode.com/svn/
Stars: ✭ 51 (-93.96%)
Mutual labels:  googlemaps, maps
deck.gl-time-series-widget
A React Time Slider implementation for DECK.GL - (non)temporal data - by CPU filtering ⌛
Stars: ✭ 19 (-97.75%)
Mutual labels:  maps, mapbox
Covid19 Full Stack Application
Coronavirus - (COVID-19) Full Stack Application
Stars: ✭ 270 (-68.01%)
Mutual labels:  mapbox, googlemaps
Prunecluster
Fast and realtime marker clustering for Leaflet
Stars: ✭ 473 (-43.96%)
Mutual labels:  maps, markers
Maps
🌍🌏🌎 The whole world fits inside your cloud!
Stars: ✭ 253 (-70.02%)
Mutual labels:  mapbox, maps
Road Orientation Map
A visualization of road orientations on an interactive map
Stars: ✭ 254 (-69.91%)
Mutual labels:  mapbox, maps
Js Samples
Samples for the Google Maps JavaScript v3 API
Stars: ✭ 362 (-57.11%)
Mutual labels:  googlemaps, maps

MapMe

MapMe

Download Build Status

MapMe is an Android library for working with Maps. MapMe brings the adapter pattern to Maps, simplifying the management of markers and annotations.

MapMe supports both Google Maps and Mapbox

Download

//base dependency
compile 'nz.co.trademe.mapme:mapme:1.2.0'
  
//for Google Maps support
compile 'nz.co.trademe.mapme:googlemaps:1.2.0'
  
//for Mapbox support
compile 'nz.co.trademe.mapme:mapbox:1.2.0'

Usage

A simple MapsAdapter might look like this:

class MapsAdapter(context: Context, private val markers: List<MarkerData>) : GoogleMapMeAdapter(context) {

    fun onCreateAnnotation(factory: AnnotationFactory, position: Int, annotationType: Int): MapAnnotation {
        val item = this.markers[position]
        return factory.createMarker(item.getLatLng(), null, item.getTitle())
    }

    fun onBindAnnotation(annotation: MapAnnotation, position: Int, payload: Any) {
        if (annotation is MarkerAnnotation) {
            val item = this.markers[position]
            annotation.setTitle(item.getTitle())
        }
    }

    val itemCount: Int
        get() = markers.size()
}

Using the adapter in your view:

val adapter: MapMeAdapter = GoogleMapMeAdapter(context, items)
adapter.setOnAnnotationClickListener(this)

mapView.getMapAsync { googleMap ->
    //Attach the adapter to the map view once it's initialized
    adapter.attach(mapView, googleMap)
}

Dispatch data updates to the adapter:

// add new data and tell the adapter about it

items.addAll(myData)
adapter.notifyDataSetChanged()

// or with DiffUtil

val diff = DiffUtil.calculateDiff(myDiffCallback)
diff.dispatchUpdatesTo(adapter)

Click listeners

MapMe takes the pain out of click listeners too. No more setting tags on markers and trying to match a tag to your data when the click event is received.

MapMe has a setOnAnnotationClickListener method that will pass back a MapAnnotation containing the position of the item in the list of data:

mapsAdapter.setOnAnnotationClickListener(OnMapAnnotationClickListener { annotation ->
            //retrieve the data item based on the position
            val item = myData[annotation.position]
            
            //handle item click here
            
            true
        })

Info window clicks are handled in the same way.

Animations

While MapMe doesn't handle marker animations directly, it does provide a onAnnotationAdded method on the adapter that is called when a marker is added to the map.

This is the ideal place to start an animation.

For example, the following animates a markers alpha when it is added to the map:

override fun onAnnotationAdded(annotation: MapAnnotation) {
        if (annotation !is MarkerAnnotation) return

        ObjectAnimator.ofFloat(annotation, "alpha", 0f, 1f)
                .apply {
                    duration = 150
                    interpolator = DecelerateInterpolator()
                    start()
               }
}

Markers and Annotations

MapMe is based around the concept of Annotations. An annotation is anything displayed on the map.

The only annotation currently supported is Markers. We hope to support many more in the future.

We'd love PR's adding support for more annotations!

Multiple annotation types

More complex adapters can override getItemAnnotationType to work with multiple annotations. The annotation type is passed to onCreateAnnotation just like in a RecyclerView Adapter.

AnnotationFactory

MapMe differs from list adapters in that the creation of annotations must be left up to the map as they are not standard Android views.

The MapAdapter onCreateAnnotation method provides an AnnotationFactory as a parameter that must be used to create and return Map Annotations.

DiffUtil

As well as support for standard Adapter methods such as notifyDataSetChanged, and notifyItemInserted, MapMe supports (and recommends) DiffUtil.

DiffUtil is where the true power of MapMe comes into play. Simple manipulate the data set, calculate the diff and dispatch it to MapMe. The map will instantly reflect the data.

A DiffResult can be dispatched to the MapAdapter just as you would a RecyclerView:

DiffUtil.DiffResult diffResult = DiffUtil.calculateDiff(new MarkerDiffCallback(this.markers, newMarkers));
diffResult.dispatchUpdatesTo(mapAdapter);

Why the adapter pattern?

Working with a few map markers is simple, but working with hundreds can become a mess of spaghetti code.

The adapter pattern provides a clear separation of data from the view, allowing the data to be manipulated freely without the concern of updating the view.

We think this is a pattern fits perfectly with maps.

Contributing

We love contributions, but make sure to checkout CONTRIBUTING.MD first!

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].