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> |