Permalink
Switch branches/tags
Find file Copy path
Fetching contributors…
Cannot retrieve contributors at this time
154 lines (113 sloc) 4.45 KB

Mapbox IOS SDK Wrapper for Titanium

Uses the Mapbox iOS SDK develop branch.

Animation

Use

Put the compiled zip in your project, and add a reference in tiapp.xml. Built using Ti SDK 3.2.1.GA, tested on iOS 7.

Example

var mapbox = require('com.polancomedia.mapbox');

var mapView = mapbox.createView({
    map: 'control-room',
    //map: 'road-trip',
    minZoom: 0,
    maxZoom: 6,
    zoom: 10,
    accessToken: 'pk.xyz.abc', //REQUIRED!!!
    centerLatLng: [20.7972,-88.1598],
    width: Ti.UI.FILL,
    height: Ti.UI.FILL
});

win.add(mapView);
win.open();

See more examples in the example folder.

Sample Maps

The example folder contains two sample mbtiles maps:

control-room

  • Zoom levels 0 through 6
  • Full-world coverage

road-trip

  • Zoom levels 7 through 12
  • Only contains subset of world coverage

Properties

map

  • Required, path to local mbtiles file in Resources directory (include .mbtiles extension in string) or an online MapBox or a resolved path ( file.resolve(); ) of a file in the Application Data directory, or a TileStream id that looks something like: userName.map-szwegi5m.

accessToken

debugTiles

  • Optional, defaults to false.
  • Show grid with tile info to help with debugging.

hideAttribution

  • Optional, defaults to false.
  • Displays info button in corner of map.
  • See Mapbox Terms and Conditions for attribution info.

userLocation

  • Optional, defaults to false.
  • Displays the user's location on map.

backgroundColor

  • Optional, defaults to tan or beige or something like that
  • Background color of the map when tile is loading or not available
  • Useful to set this to the base color of your map if your map's colors contrast with the default color

Methods

clearTileCache()

  • Remove all tile images that were cached while viewing a remote map.

setZoom(4)

  • Zoom the map. Accepts a float to set the zoom level

setCenterLatLng([18.467354,-91.903534])

  • Centers the map on a latitude and longitude.

Map Events

'mapViewRegionDidChange'

  • Fires any time the map moves

'singleTapOnMap'

  • Returns coordinates of where the map was single tapped as latitude and longitude.

'longPressOnMap'

  • Returns coordinates of where the map was long-pressed as latitude and longitude.

Annotations

See Wiki Note: Annotations are a work in progress. You can set them like this:

mapView.setAnnotation({
	latitude: 18.467354,
	longitude: -91.903534,
	title: 'Test Title',
	subtitle: 'Subtitle'
});

Or you can also add them like the standard Ti map annotations:

var a1 = mapbox.createAnnotation({
	latitude: 18.467354,
	longitude: -91.903534,
    //markerImage: 'images/sample.png', //custom image for Annotation/Marker (optional)
	title: 'Test Title',
	subtitle: 'Subtitle'
});
mapView.addAnnotation(a1);

Shapes, Polygons, Routes, Lines

See Wiki

Just keep in mind that stuff like annotation-level setter/getters aren’t yet available.

Annotation and Shape Events

tapOnAnnotation

  • Returns info of selected Annotation (Heads up, event name and info may change).

Todos

  • Need to verify that min, max and default zoom levels work for maps that don't contain full-world (like road-trip).
  • Add support for remote maps
  • Add support for custom markers and other SDK items
  • Make mapbox.createAnnotation() and mapView.addAnnotation(annotation) interfaces similar to current Ti Map implementation
  • Full annotation support with events, images, clustering, polygons
  • Contributions welcome

Contributors

Big shout out to these folks for contributing to titanium-mapbox development. Thanks!

About

License

MIT License Copyright (c) 2013-2014 Polanco Media, LLC

Uses MapBox iOS SDK, (c) 2008-2014 MapBox and Route-Me Contributors