I've successfully embedded a Google Maps API v3 map on my site, and added OpenStreetMaps (OSM) as the base layer. Is it possible to use Google's tiles as the base layer, and then overlay street data on top of that, rather than the entire OSM layer?
<script type="text/javascript" charset="utf-8">
$(function(){
google.maps.MapTypeId.push("OSM");
var osmMapType = new google.maps.ImageMapType({
getTileUrl: function(coord, zoom) {
return "http://tile.openstreetmap.org/" + zoom + "/" + coord.x + "/" + coord.y + ".png";
},
tileSize: new google.maps.Size(256, 256),
isPng: true,
alt: "OpenStreetMap layer",
name: "OpenStreetMap"
});
$("#map-canvas").gmap3({
action: 'init',
options:{
center: [22.49156846196823, 89.75802349999992],
zoom:2,
mapTypeId: google.maps.MapTypeId.ROADMAP,//google.maps.MapTypeId.OSM,
mapTypeControl: true,
mapTypeControlOptions: {
style: google.maps.MapTypeControlStyle.DEFAULT
},
navigationControl: true,
scrollwheel: true,
streetViewControl: true
}
});
});
</script>