Skip to content

Instantly share code, notes, and snippets.

@lexoyo
Last active March 21, 2017 00:24
Show Gist options
  • Save lexoyo/bc9afb5f854bf54ae9b7b98f3fe76bb5 to your computer and use it in GitHub Desktop.
Save lexoyo/bc9afb5f854bf54ae9b7b98f3fe76bb5 to your computer and use it in GitHub Desktop.
Open Street map from map URL and over HTTPS
<div id="mapdiv"></div>
<style>
#mapdiv {
width: 1000px;
height: 1000px;
}
</style>
<script src="https://cdnjs.cloudflare.com/ajax/libs/openlayers/2.11/OpenLayers.js"></script>
<script>
map = new OpenLayers.Map("mapdiv");
// map over https, solution from http://gis.stackexchange.com/questions/83953/openlayer-maps-issue-with-ssl/90308
var layer = new OpenLayers.Layer.OSM(
"OpenStreetMap",
// Official OSM tileset as protocol-independent URLs
[
'//a.tile.openstreetmap.org/${z}/${x}/${y}.png',
'//b.tile.openstreetmap.org/${z}/${x}/${y}.png',
'//c.tile.openstreetmap.org/${z}/${x}/${y}.png'
],
null);
map.addLayer(layer);
// apply position and zoom from map URL http://www.openstreetmap.org/#map=18/48.88680/2.34235&layers=C
var lonLat = new OpenLayers.LonLat(2.34235, 48.88680)
.transform(
new OpenLayers.Projection("EPSG:4326"), // transform from WGS 1984
map.getProjectionObject() // to Spherical Mercator Projection
);
var zoom=18;
map.setCenter (lonLat, zoom);
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment