6

We have an application working with OpenLayers and are using OpenStreetmap for the map tiles, however they don't look great.

Is there anyway to style these maps?

I read something about Mapbox but it uses Leaflet API, however we use OpenLayers and our app is heavily using it. What options do I have?

5 Answers 5

7

MapBox doesn't require you to use the MapBox.js API - you can use your customized tiles with OpenLayers easily by using OpenLayers.Layer.XYZ.

3
  • I've signed up for a mapbox account, can you give me an overview of what to do to get it working with openlayers? i'm not quite sure
    – Quade
    Aug 7, 2013 at 13:36
  • 1
    Create a map in your account, click 'Publish', click 'MapBox.js', copy the map id and then in OpenLayers-land, OpenLayers.Layer.XYZ('MapBox', 'http://a.tiles.mapbox.com/v3/[mapid]/${z}/${y}/${x}.png')
    – tmcw
    Aug 7, 2013 at 20:39
  • +1 Answers the question. Just wanted to highlight that as @Burton449 notes, MapBox free usage is limited.
    – Michael
    Aug 7, 2013 at 20:50
6

You will have to host the openstreet map data on your own server and generate your styled tiles yourself. Look at Mapnik for tiling. MapBox could be a solution that is hosted in the cloud, but it is not free to use (but you can have limited free use and storage).

9
  • MapBox does have a free option. You can customize tiles, which MapBox will cloud host free for up to 3k map views. 50MB of storage is also included in the free plan.
    – Roy
    Aug 1, 2013 at 17:07
  • Ok, I did not know that. You mean 3k map hits (refresh, pan, zoom = 1 hit) or 3k "user-session" view? Aug 1, 2013 at 17:13
  • 3
    I made a custom tileset on their website (as opposed to tilemill), and worked it into a website I'm developing. With all of the refreshes I did to get the look I wanted (and sharing the page with a few others) I have 522 map views. There might be a more specific explanation of map views on their site, but I haven't seen it.
    – Roy
    Aug 1, 2013 at 17:26
  • 1
    From mapbox.com/plans -- 15 tiles is a 'map view'
    – Scro
    Aug 1, 2013 at 20:16
  • 1
    Cloudmade seems to allow caching as mentionnend on the website main page. Aug 5, 2013 at 14:55
2

you can use prepared styles or create your own in cloudmade, this service offers 500K tiles free per month.

1
  • this option is no more available by cloudmade
    – geogeek
    Dec 11, 2014 at 23:04
1

Once you have managed to store the OSM data in a local Postgis database, you are free to style your map as you want using Mapnik. Here is a list of available services with different styles:

http://wiki.openstreetmap.org/wiki/List_of_OSM_based_Services

For a start-off, you can also use Maperitive. You can style your map easily on the screen, and let the software create the tiles for openlayers: http://ksmapper.blogspot.de/2011/08/simple-openstreetmap-tile-rendering.html

0

You can use Mapbox tiles. just create a layer and add it to map.

var mapbox = new OpenLayers.Layer.XYZ(
                "MapBox",
                [
                    "http://a.tiles.mapbox.com/v3/[mapid]/${z}/${x}/${y}.png",
                    "http://b.tiles.mapbox.com/v3/[mapid]/${z}/${x}/${y}.png",
                    "http://c.tiles.mapbox.com/v3/[mapid]/${z}/${x}/${y}.png",
                    "http://d.tiles.mapbox.com/v3/[mapid]/${z}/${x}/${y}.png"
                ], {
                    attribution: "Tiles &copy; <a href='http://mapbox.com/'>MapBox</a>",
                    sphericalMercator: true,
                    wrapDateLine: false,
                    // numZoomLevels: 5,
                    isBaseLayer:true
                }
            );
            map.addLayer(mapbox);

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.