I want to use the Leaflet Javascript Library to display both a Google and Bing Tile Layer, though I'm unsure how to construct the url. The documentation shows an example using OSM:

var cloudmadeUrl = 'http://{s}.tile.cloudmade.com/YOUR-API-KEY/997/256/{z}/{x}/{y}.png',
cloudmade = new L.TileLayer(cloudmadeUrl, {maxZoom: 18});

But for some reason I can't duplicate this for either Bing or Google. Any ideas?


3 Answers 3


Google Maps

Google Maps forbids such uses. The only allowed access to their content is through their Maps API (see section 10.1 of the ToS).

Bing Maps Web Services

Bing Maps is the only commercial provider I know that allows such uses, through their Web Services feature. You will need an API key, though.

Bing will be a bit annoying to get, since they use quadkeys (an unique index for each tile) instead of {x,y} coordinates (good comparison there). You'll therefore need to create a new L.ILayer implementation that conforms to this URL scheme.

Since you're of course not the first one to have this request  ;)  , some others have already coded such implementations. One is a pending pull request to the Leaflet repo, the other is directly available as a Gist. Try whichever you prefer, and add your weight to the pull request to make it merged faster  :)

  • MattiSG, do Google's restrictions imply that OpenLayers is out-of-line? The API provides a class for a Google Layer within your OpenLayers map: dev.openlayers.org/releases/OpenLayers-2.11/doc/apidocs/files/… Is it okay to portray Google map data using OpenLayers or Leaflet, as long as the request to get the data are made using the Maps API?
    – Ryan Clark
    Commented May 25, 2012 at 15:57
  • @RyanClark Well, from Google ToS 10.1.1: “For example, you must not access map tiles or imagery through interfaces or channels other than the Maps API(s).”. So, as long as OpenLayers provides an abstraction layer over the official Maps API, it is ok. It would not be ok if it accessed the tiles directly. At least, that's how I understand it ;)
    – MattiSG
    Commented May 28, 2012 at 18:13
  • Google has given permission in writing to OpenLayers (I can't find the post right now to link to), so you are in the clear if you use OpenLayers. Commented Nov 5, 2012 at 4:59

I know google maps forbids it, yet if you use this plugin, you can do it.

Check the google.html file under the examples folder.

Change line 15 to:

var ggl = new L.Google("ROADMAP);

It should then work for you :)

However, I dunno if this abides by google's TOS!


You can try to use Bing maps tiles directly. I think this is not compliant with Bing TOS, but register the key at Microsoft, give them copyright link from maps implementation, and there should be no problem. Check out for example Maps of All to see live Bing tiles inside Google maps API. If you then check http://www.mapsofall.com/public/js.js, there is concrete URL of Bing tiles.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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