1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
|
<& /elements/header-logo.html, { title => 'Find Census Tract Map', head => $head, } &>
<P><h1>Please select your location on the map</h1></P>
<P> </P>
<table>
<tr>
<td valign=top>
<input type="button" value="Use below census track" onclick="changeMainDiv()">
<P>
Census Tract: <div id="mycensustract"></div>
<input type=hidden id="censustract" value="">
</td>
<td>
<div id="mapid" style="width: 600px; height: 600px;">Retrieving Map.</div>
</td>
</tr>
</table>
<script>
var url = 'xmlhttp-openstreetmap.html?loc=<%$loc%>';
$.getJSON(url,function(data){
var latlong = [data[0].lat, data[0].lon];
var mymap = L.map('mapid').setView(latlong, 15);
var popup = L.popup();
var mainLayer = L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
maxZoom: 19,
attribution: '© <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>'
}).addTo(mymap);
var markersLayer = new L.LayerGroup();
mymap.addLayer(markersLayer);
function onMapClick(e) {
markersLayer.clearLayers();
var marker = L.marker([e.latlng.lat, e.latlng.lng]);
marker.bindPopup("You selected (" + e.latlng.lat + " , " + e.latlng.lng + ")").openPopup();
markersLayer.addLayer(marker);
document.getElementById("mycensustract").innerHTML = "Retrieving census tract...";
getCensusTract(e.latlng.lat, e.latlng.lng);
}
mymap.on('click', onMapClick);
function getCensusTract(lat, lon) {
var url = 'xmlhttp-censustract.html?lat=' + lat + '&lon=' + lon + '&census_year=<%$census_year%>';
$.getJSON(url,function(data){
document.getElementById("mycensustract").innerHTML = data.Block.FIPS;
});
}
});
function changeMainDiv(lat,lng) {
window.opener.document.getElementById("newcensustract").innerHTML = document.getElementById("mycensustract").innerHTML;
window.opener.document.getElementById("new_tract").value = document.getElementById("mycensustract").innerHTML;
window.opener.document.getElementById("setnewtractdiv").style.display = "block";
window.opener.document.getElementById("cancelsubmissiontop").style.display = "none";
window.opener.document.getElementById("cancelsubmissionbottom").style.display = "block";
window.close();
}
</script>
</body>
</html>
<%init>
local $SIG{__DIE__}; #disable Mason error trap
my $DEBUG = 0;
my $head = '
<link rel="stylesheet" href="elements/leaflet/leaflet.css"/>
<script src="elements/leaflet/leaflet.js"></script>
';
my $census_year = $cgi->param('census_year');
my $pre = $cgi->param('pre');
my $zip_code = $cgi->param('zip_code');
my $address = $cgi->param('address');
my $loc = $zip_code ? $zip_code : $address;
</%init>
|
