91 lines
2.3 KiB
HTML
91 lines
2.3 KiB
HTML
|
<!DOCTYPE HTML>
|
||
|
|
<title>OpenLayers Simplest Example</title>
|
||
|
|
<div id="demoMap" style="height:220px"></div>
|
||
|
|
<script src="http://www.openlayers.org/api/OpenLayers.js"></script>
|
||
|
|
<script>
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
map = new OpenLayers.Map("demoMap");
|
||
|
|
var mapnik = new OpenLayers.Layer.OSM();
|
||
|
|
var fromProjection = new OpenLayers.Projection("EPSG:4326"); // Transform from WGS 1984
|
||
|
|
var toProjection = new OpenLayers.Projection("EPSG:900913"); // to Spherical Mercator Projection
|
||
|
|
var position = new OpenLayers.LonLat(37.443195, 55.888869).transform( fromProjection, toProjection);;
|
||
|
|
var zoom = 12;
|
||
|
|
|
||
|
|
map.addLayer(mapnik);
|
||
|
|
map.setCenter(position, zoom);
|
||
|
|
|
||
|
|
var markers = new OpenLayers.Layer.Markers( "Markers" );
|
||
|
|
map.addLayer(markers);
|
||
|
|
|
||
|
|
function AddMarker(x, y, state)
|
||
|
|
{
|
||
|
|
if (state == 0)
|
||
|
|
{
|
||
|
|
marker_addr = "http://mephi1984.jino.ru/osm/marker_mobile.png";
|
||
|
|
}
|
||
|
|
else if (state == 1)
|
||
|
|
{
|
||
|
|
marker_addr = "http://mephi1984.jino.ru/osm/marker.png";
|
||
|
|
}
|
||
|
|
else
|
||
|
|
{
|
||
|
|
marker_addr = "http://mephi1984.jino.ru/osm/marker_alarm.png";
|
||
|
|
}
|
||
|
|
|
||
|
|
var size = new OpenLayers.Size(21,25);
|
||
|
|
var offset = new OpenLayers.Pixel(-(size.w/2), -size.h);
|
||
|
|
var icon = new OpenLayers.Icon(marker_addr, size, offset);
|
||
|
|
|
||
|
|
var lon_Lat = new OpenLayers.LonLat(x, y).transform(fromProjection, toProjection);
|
||
|
|
markers.addMarker(new OpenLayers.Marker(lon_Lat, icon));
|
||
|
|
}
|
||
|
|
|
||
|
|
function Clear()
|
||
|
|
{
|
||
|
|
markers.clearMarkers();
|
||
|
|
}
|
||
|
|
|
||
|
|
//AddMarker(37.443195, 55.888869);
|
||
|
|
|
||
|
|
|
||
|
|
function AddMarkerWithPopup(x, y, state, text)
|
||
|
|
{
|
||
|
|
|
||
|
|
if (state == 0)
|
||
|
|
{
|
||
|
|
marker_addr = "http://mephi1984.jino.ru/osm/marker_mobile.png";
|
||
|
|
}
|
||
|
|
else if (state == 1)
|
||
|
|
{
|
||
|
|
marker_addr = "http://mephi1984.jino.ru/osm/marker.png";
|
||
|
|
}
|
||
|
|
else
|
||
|
|
{
|
||
|
|
marker_addr = "http://mephi1984.jino.ru/osm/marker_alarm.png";
|
||
|
|
}
|
||
|
|
|
||
|
|
var size = new OpenLayers.Size(21,25);
|
||
|
|
var offset = new OpenLayers.Pixel(-(size.w/2), -size.h);
|
||
|
|
var icon = new OpenLayers.Icon(marker_addr, size, offset);
|
||
|
|
|
||
|
|
var lon_Lat = new OpenLayers.LonLat(x, y).transform(fromProjection, toProjection);
|
||
|
|
|
||
|
|
var marker = new OpenLayers.Marker(lon_Lat, icon);
|
||
|
|
|
||
|
|
marker.events.register('mousedown', marker, function(evt) { alert(text); OpenLayers.Event.stop(evt); });
|
||
|
|
|
||
|
|
markers.addMarker(marker);
|
||
|
|
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
</script>
|