How to use Google Maps API in leaflet-cloudmade

Question

Is there any way to integrate Google Maps with leaflet-cloudmade? I mean, I don't want to use the original cloudmade map, but I want to use Google Maps instead. I want to show a map of Alaska (not many roads there). If I use a cloudmade map, it would be just white.

This is what I do if I want to use cloudmade map:

var cloudmade = new L.TileLayer('http://{s}.tile.cloudmade.com/YOUR-API-KEY/997/256/{z}/{x}/{y}.png', {     attribution: 'Map data &copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, <a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery © <a href="http://cloudmade.com">CloudMade</a>',     maxZoom: 18 }); 

I know I should change the 'http://{s}.tile.cloudmade.com/YOUR-API-KEY/997/256/{z}/{x}/{y}.png' part. But, what should I write there if I want to use google map (or any other map)?

This is the documentation of leaflet-cloudmade (they don't say that much about using third-party map provider. They say they are agnostic about map-provider used in our application, so I think it should be possible to use Google Maps).

Answer 1

The official leaflet.js plugins page references the Plugins by Pavel Shramov package.
The provided Google.js gives you access to Google Maps tiles by using Google Maps API v3, with respect to the terms of use.

Here is a quick example: you can use it by first adding

<script src="http://maps.google.com/maps/api/js?v=3.2&sensor=false"></script> <script src="path/to/Google.js"></script> 

and then build your map:

var map = new L.Map('map', {center: new L.LatLng(43.6481, -79.4042), zoom: 13}); var gmap_layer = new L.Google('ROADMAP'); map.addLayer(gmap_layer); 

---

Note: there are also some forks mentioned in this gist.

Answer 2

Google don't allow you to use their tiles without using their own API to get them. See the General Terms:

Don’t misuse our Services. For example, don’t ... try to access them using a method other than the interface and the instructions that we provide.

Anything is possible, of course, so it's possible to get the tiles without the API, but your access may be blocked without warning:

We may suspend or stop providing our Services to you if you do not comply with our terms or policies or if we are investigating suspected misconduct.

That said, the Leaflet API doesn't look very different from the Google API, so conversion to use their API may well be worth considering.