Using style from Cloudmade on Leaflet.js maps

Question

I'm using Leaflet for my web project. For the map tile, I'm using Cloudmade images.

L.tileLayer('http://{s}.tile.cloudmade.com/{key}/22677/256/{z}/{x}/{y}.png', {
        styleId: 123544,
        attribution: 'Map data © 2011 OpenStreetMap contributors, Imagery © 2012 CloudMade',
        key: 'XXXXXXXX'
    }).addTo(map);

I've tried to put the style to this map but the style doesn't work. I just want to put blue on river and sea.

Thank you.

Answer 1

I use cloudmade on one of my website, this is how i use their tiles :

L.tileLayer('http://{s}.tile.cloudmade.com/{your_key}/{style_id}/256/{z}/{x}/{y}.png', {
        attribution: 'Map data © 2011 OpenStreetMap contributors, Imagery © 2012 CloudMade'
}).addTo(map);

Key and style are directly in the url, you might want to use the basic cloudmade style, id is 1.

And yes, cloudmade is turning off their service for small users, but it's not effective now, may 1st so your map should work.