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
84
85
86
87
88
89
90
91
92
93
94
|
//Utility functions for map info window
function mapit(lat,lon,zoom,id) {
map = L.map(document.getElementById("map-wrapper-"+id));
centerCoord = new L.LatLng(lat, lon);
zoom = zoom;
L.tileLayer.provider('Esri.WorldTopoMap', {maxZoom: 18, attribution: 'Map data © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, <a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Tiles © Esri and the GIS User Community'}).addTo(map);
map.setView(centerCoord, zoom);
////get the geojson for this map
$.ajax({
url: "/projects/data/natparks/"+id+".json",
dataType: "json",
success: function(data, text, request) { draw_poly(data, map); }
//complete: function(xhr, status) {console.log(status); return false; },
});
//draw the polygon
function draw_poly(data, map) {
var myStyle = {
"color": "#201a11",
"weight": 2,
"opacity": 0.65
};
L.geoJson(data, {
style: myStyle
}).addTo(map);
}
}
// utility functions to create/remove map container
function create_map(obj) {
var lat = parseFloat(obj.attr('data-latitude'));
var lon = parseFloat(obj.attr('data-longitude'));
var zoom= parseInt(obj.attr('data-zoom'));
var id= obj.attr('data-id');
//create container divs
$(obj).parents().eq(3).append('<div class="map-container" id="map-container-'+id+'">');
$('#map-container-'+id).append('<div class="map-wrapper" id="map-wrapper-'+id+'">');
mapit(lat,lon,zoom,id);
}
function remove_map(id) {
$(id).remove();
}
//functions to handle the "more" link
// utility functions to create/remove camera info container
function get_exif(obj,id) {
//$(obj).parents().eq(2).append('<div id="exif-container">');
$(obj).parents().eq(3).append('<div class="more-container" id="'+id+'">'); $(obj).parents().eq(2).children('.meta').clone().appendTo('#'+id).css('visibility', 'visible');
//deal with the variable height of div.legend
$('#exif-container').css({
bottom: function(index, value) {
return parseFloat($(obj).parent().parent().css("height"))-14;
}
});
}
function remove_exif(id) {
$('#'+id).remove();
}
$(document).ready(function(){
//set up click events for map button
$('.map-link').click( function() {
var more_id = 'more-container-'+$(this).parent().next().children('.more-link').attr('id').split('-')[1];
var id = '#map-container-'+$(this).attr('data-id');
if ($('#'+more_id).is(":visible")){
remove_exif(more_id);
}
if ($(id).is(":visible")) {
remove_map(id);
} else {
create_map($(this));
}
return false;
});
//set up click events for more info button
$('.more-link').click( function() {
var map_id = '#map-container-'+$(this).parent().prev().children('.map-link').attr('data-id');
var id = 'more-container-'+this.id.split('-')[1];
if ($(map_id).is(":visible")){
remove_map(map_id);
}
if ($('#'+id).is(":visible")) {
remove_exif(id);
} else {
get_exif(this, id);
}
return false;
});
});
|
