Harry Wood
home
>
maps
>
examples
> openlayers >
OpenLayers Mobile Resize
OpenLayers Mobile Resize
Meta tag which tells mobile devices not to scale down the web display (resulting in tiny zoom buttons)
<html> <head> <title>OpenLayers Mobile Resize</title> <meta name="viewport" content="user-scalable=no, width=device-width" /> <script src="https://cdnjs.cloudflare.com/ajax/libs/openlayers/2.11/lib/OpenLayers.js"></script> <style type="text/css"> html, body, #mapdiv { width:100%; height:100%; margin:0; } </style> </head> <body> <div id="mapdiv"></div> <script> map = new OpenLayers.Map("mapdiv"); map.addLayer(new OpenLayers.Layer.OSM()); var lonLat = new OpenLayers.LonLat( -0.1279688 ,51.5077286 ) .transform( new OpenLayers.Projection("EPSG:4326"), // transform from WGS 1984 map.getProjectionObject() // to Spherical Mercator Projection ); var zoom=16; var markers = new OpenLayers.Layer.Markers( "Markers" ); map.addLayer(markers); markers.addMarker(new OpenLayers.Marker(lonLat)); map.setCenter (lonLat, zoom); </script> </body></html>
view directly
Home
Blog
About
Maps
Other
Contact