I use Google Maps API to display OSM tiles. Log story short, the code below helps you make this:
be displayed like this:
Notice how the one OSM tile that shows the whole map is replicated left and right forever. In this way the tiles will be shown the same way like Google tiles.
The code to initialize the Google Maps API with OSM tiles:
function init_osm() {
map_osm = new google.maps.Map(map_div, {
center: new google.maps.LatLng(pos.lat, pos.lng),
zoom: pos.zoom,
mapTypeId: "OSM",
mapTypeControl: false,
streetViewControl: false
});
//Define OSM map type pointing at the OpenStreetMap tile server
map_osm.mapTypes.set("OSM", new google.maps.ImageMapType({
getTileUrl: function(coord, zoom) {
var maxTile = Math.pow(2, zoom);
if (coord.y < 0 || coord.y >= maxTile) { return;};
var x = coord.x % maxTile;
var y = coord.y % maxTile;
x = x < 0 ? x + maxTile : x;
y = y < 0 ? y + maxTile : y;
return "http://tile.openstreetmap.org/" + zoom + "/"
+ coord.x + "/" + coord.y + ".png";
},
tileSize: new google.maps.Size(256, 256),
name: "OpenStreetMap",
maxZoom: 19
}));
};