| 1 |
<html xmlns="http://www.w3.org/1999/xhtml"> |
|---|
| 2 |
<head> |
|---|
| 3 |
<meta http-equiv="imagetoolbar" content="no"> <!--ie image gizmo OFF!--> |
|---|
| 4 |
|
|---|
| 5 |
<style type="text/css"> |
|---|
| 6 |
body { font-family: sans-serif; font-weight: bold; font-size: .8em; } |
|---|
| 7 |
body { |
|---|
| 8 |
border: 0px; |
|---|
| 9 |
margin: 0px; |
|---|
| 10 |
padding: 0px; |
|---|
| 11 |
} |
|---|
| 12 |
#map { |
|---|
| 13 |
width: 65%; |
|---|
| 14 |
height: 100%; |
|---|
| 15 |
border: 0px; |
|---|
| 16 |
padding: 0px; |
|---|
| 17 |
} |
|---|
| 18 |
</style> |
|---|
| 19 |
|
|---|
| 20 |
<script src="lib/OpenLayers.js"></script> |
|---|
| 21 |
<script type="text/javascript"> |
|---|
| 22 |
<!-- |
|---|
| 23 |
var lat = 850000; |
|---|
| 24 |
var lon = 180000; |
|---|
| 25 |
var zoom = 0; |
|---|
| 26 |
var map, layer; |
|---|
| 27 |
|
|---|
| 28 |
function init(){ |
|---|
| 29 |
|
|---|
| 30 |
map = new OpenLayers.Map( $('map'), {maxExtent: new OpenLayers.Bounds(33861, 717605, 330846, 1019656), maxResolution: 296985/1024, projection:"EPSG:2805" } ); |
|---|
| 31 |
var basemap = new OpenLayers.Layer.WMS( "Boston", |
|---|
| 32 |
"http://boston.freemap.in/cgi-bin/mapserv?", |
|---|
| 33 |
{map: '/www/freemap.in/boston/map/mass.map', layers: 'border,water,roads', format: 'png'} ); |
|---|
| 34 |
var rapid = new OpenLayers.Layer.WMS( "Rapid Transit", |
|---|
| 35 |
"http://boston.freemap.in/cgi-bin/mapserv?", |
|---|
| 36 |
{map: '/www/freemap.in/boston/map/mass.map', layers: 'rapid_transit', format: 'png'} ); |
|---|
| 37 |
var buildings = new OpenLayers.Layer.WMS( "Buildings", |
|---|
| 38 |
"http://boston.freemap.in/cgi-bin/mapserv?", |
|---|
| 39 |
{map: '/www/freemap.in/boston/map/mass.map', layers: 'buildings', format: 'png'} ); |
|---|
| 40 |
|
|---|
| 41 |
map.addLayer(basemap); |
|---|
| 42 |
map.addLayer(rapid); |
|---|
| 43 |
map.addLayer(buildings); |
|---|
| 44 |
map.setCenter(new OpenLayers.LonLat(lon, lat), zoom); |
|---|
| 45 |
map.addControl(new OpenLayers.Control.LayerSwitcher()); |
|---|
| 46 |
} |
|---|
| 47 |
function getaddress() { |
|---|
| 48 |
if (!document.getElementById('address').value) {return; } |
|---|
| 49 |
document.getElementById('status').innerHTML = "Finding address..."; |
|---|
| 50 |
var address = document.getElementById('address').value; |
|---|
| 51 |
address = escape(address); |
|---|
| 52 |
addr = "/geocode.cgi?address="+address; |
|---|
| 53 |
var handler = XMLrequest(); |
|---|
| 54 |
if (handler) { |
|---|
| 55 |
handler.onreadystatechange=function() { |
|---|
| 56 |
if (handler.readyState == 4 && handler.status == 200) { |
|---|
| 57 |
var latlon = handler.responseText; |
|---|
| 58 |
latlon = latlon.split(","); |
|---|
| 59 |
if (latlon[1]) { |
|---|
| 60 |
map.setCenter(new OpenLayers.LonLat(parseFloat(latlon[1]), parseFloat(latlon[0])), 15); |
|---|
| 61 |
document.getElementById('status').innerHTML = ""; |
|---|
| 62 |
|
|---|
| 63 |
} else { |
|---|
| 64 |
document.getElementById('status').innerHTML = "Could not find address, sorry."; |
|---|
| 65 |
} |
|---|
| 66 |
} |
|---|
| 67 |
} |
|---|
| 68 |
handler.open("GET", addr, true); |
|---|
| 69 |
handler.send(''); |
|---|
| 70 |
} |
|---|
| 71 |
} |
|---|
| 72 |
function XMLrequest() { |
|---|
| 73 |
xmlhttp={}; |
|---|
| 74 |
try { |
|---|
| 75 |
xmlhttp=new ActiveXObject("Msxml2.XMLHTTP"); |
|---|
| 76 |
} catch (e) { |
|---|
| 77 |
try { |
|---|
| 78 |
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); |
|---|
| 79 |
} catch (E) { } |
|---|
| 80 |
} |
|---|
| 81 |
try { |
|---|
| 82 |
xmlhttp = new XMLHttpRequest(); |
|---|
| 83 |
} catch (e) {} |
|---|
| 84 |
return xmlhttp; |
|---|
| 85 |
} |
|---|
| 86 |
function setLink() { |
|---|
| 87 |
var link = document.getElementById("link"); |
|---|
| 88 |
var center = map.getCenter(); |
|---|
| 89 |
var zoom = map.getZoom(); |
|---|
| 90 |
link.innerHTML="http://boston.freemap.in/?zoom="+zoom+"&lat="+center.lat+"&lon="+center.lon; |
|---|
| 91 |
} |
|---|
| 92 |
|
|---|
| 93 |
</script> |
|---|
| 94 |
</head> |
|---|
| 95 |
|
|---|
| 96 |
<body onload="init()"> |
|---|
| 97 |
<div id="right" style="float:right;width:30%;padding:10px;" ><h1>Boston Free Map</h1>Search: <input type="text" id='address' name="address"><input type="submit" value="Go!" onclick="javascript:getaddress()"/> |
|---|
| 98 |
<div id="status" style="height:20px;min-height:20px;"> </div> |
|---|
| 99 |
<div>Map powered by <a href="http://www.openlayers.org/">OpenLayers</a> |
|---|
| 100 |
and <a href="http://mapserver.gis.umn.edu/">MapServer</a>. |
|---|
| 101 |
Data downloaded from |
|---|
| 102 |
<a href="http://www.mass.gov/mgis/">Office of Geographic and Environmental Information (MassGIS)</a>.</div> |
|---|
| 103 |
<!--<a onclick="setLink(); return false" href="#" id="update">Update Link</a> |
|---|
| 104 |
<div id="link"></div>--> |
|---|
| 105 |
</div> |
|---|
| 106 |
<div id="map"></div> |
|---|
| 107 |
</body> |
|---|
| 108 |
</html> |
|---|