example:
http://wiki.openstreetmap.org/wiki/OpenLayers_Simple_Example
<html>
<head>
<title>OpenStreetMap</title>
<!-- bring in the OpenLayers javascript library
(here we bring it from the remote site, but you could
easily serve up this javascript yourself) -->
<script src="http://www.openlayers.org/api/OpenLayers.js"></script>
<!-- bring in the OpenStreetMap OpenLayers layers.
Using this hosted file will make sure we are kept up
to date with any necessary changes -->
<script src="http://www.openstreetmap.org/openlayers/OpenStreetMap.js"></script>
<script type="text/javascript">
// Start position for the map (hardcoded here for simplicity)
var lat=51.508;
var lon=-0.118;
var zoom=13;
var map; //complex object of type OpenLayers.Map
//Initialise the 'map' object
function init() {
map = new OpenLayers.Map ("map", {
controls:[
new OpenLayers.Control.Navigation(),
new OpenLayers.Control.PanZoomBar(),
new OpenLayers.Control.Attribution()],
maxExtent: new OpenLayers.Bounds(-20037508.34,-20037508.34,20037508.34,20037508.34),
maxResolution: 156543.0399,
numZoomLevels: 19,
units: 'm',
projection: new OpenLayers.Projection("EPSG:900913"),
displayProjection: new OpenLayers.Projection("EPSG:4326")
} );
// Define the map layer
// Other defined layers are OpenLayers.Layer.OSM.Mapnik, OpenLayers.Layer.OSM.Maplint and OpenLayers.Layer.OSM.CycleMap
layerTilesAtHome = new OpenLayers.Layer.OSM.Osmarender("Osmarender");
map.addLayer(layerTilesAtHome);
if( ! map.getCenter() ){
var lonLat = new OpenLayers.LonLat(lon, lat).transform(new OpenLayers.Projection("EPSG:4326"), map.getProjectionObject());
map.setCenter (lonLat, zoom);
}
}
</script>
</head>
<!-- body.onload is called once the page is loaded (call the 'init' function) -->
<body onload="init();">
<!-- define a DIV into which the map will appear. Make it take up the whole window -->
<div style="width:100%; height:100%" id="map"></div>
</body>
</html>
分享到：
相关推荐
- Select OpenStreetMap, for example - You can open OpenStreetMap at the same position with Google maps - Left click: Open in the same tab. Middle click: Open in a new tab. This app is greatly ...
app.use('/proxy', createProxyMiddleware({ target: 'your_mapservice_url', changeOrigin: true })); app.listen(3000); ``` 然后，OpenLayers的请求指向你的代理服务地址，如`/proxy/your_mapservice_...
For example the following code snippet is enough to build and query a basic index given an [OSM](https://www.openstreetmap.org) PBF data export. ```cpp #include #include #include #include #...
- *osmparser*: Used to parse an OpenStreetMap (OSM) bz2-compressed map file. Call it with `./deploy/osmparser path_to_osm.bz2 path_to_output.graph.bz2` - *precalculation*: Used to build an overlay ...
Use a nice stamp and mention your name, street address, EMail address and any comment you like to say. 5. As this code make use of OpenSSL, your rights are restricted by OpenSSL license as soon ...
用法安装OSRM Gem gem install osrm配置 require 'osrm' OSRM.configure( # Connection server: 'example.com', # Must be specified port: 8080, # Default: 80 or 443 if SSL use_ssl: true, # Default: false ...