rra/Border-Check
1
0
Fork 0
mirror of https://github.com/rscmbbng/Border-Check.git synced 2024-12-28 23:01:34 +01:00
Code Issues Projects Releases Wiki Activity

added node clustering

Browse Source
This commit is contained in:
rscmbbng 2013-09-23 19:08:29 +02:00
parent 842734a68d
commit 47045c3fc5
1 changed files with 108 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

116
web/js/bc.js
View File

@ -1,14 +1,14 @@
window.onload = function () { window.onload = function () {
index = 0
var map = L.map('map',{ var map = L.map('map',{
minZoom: 2, minZoom: 2,
maxZoom:5, maxZoom:5,
}).setView([38.0, -97.0], 3); }).setView(latlong[index], 2);
L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', { L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {
attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors' attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
}).addTo(map); }).addTo(map);
//the slider bar //the slider bar
$('#button').bind('click', function(){ $('#button').bind('click', function(){
$('#bar').animate({"width": '200'}) $('#bar').animate({"width": '200'})
@ -18,17 +18,56 @@ window.onload = function () {
}) })
//function chain for drawing the markers and lines on the map. $('#but').bind('click', function(){
console.log('click')
$('.leaflet-popup-content-wrapper').css({'height':'700px'})
$('#metadata-content').show()
})window.onload = function () {
index = 0 index = 0
var map = L.map('map',{
minZoom: 2,
maxZoom:5,
}).setView(latlong[index], 2);
L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {
attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
}).addTo(map);
//the slider bar
$('#button').bind('click', function(){
$('#bar').animate({"width": '200'})
var info = $("<div id = info><p>this is where info goes</p><p>I will make a 'slide back' option later</p></div>")
.appendTo("#bar")
console.log('click')
})
$('#but').bind('click', function(){
console.log('click')
$('.leaflet-popup-content-wrapper').css({'height':'700px'})
$('#metadata-content').show()
})
//function chain for drawing the markers and lines on the map.
delay = (400+timestamp_list[index]) delay = (400+timestamp_list[index])
clusterGroup = new L.MarkerClusterGroup();
AddStep(latlong[index], latlong[index+1], index) AddStep(latlong[index], latlong[index+1], index)
function AddMarkerCluster(marker, index){
clusterGroup.addLayer(marker)
}
function AddMarker(src, index){ function AddMarker(src, index){
var marker = L.marker([src[0], src[1]]).bindPopup( var marker = L.marker([src[0], src[1]])
"<p>Hop no:"+hop_list[index]+"<br /><a>show metadata</a></p><p id=metadata'>Server name:<br />"+server_name_list[index]+"<br />Network owner:<br />"+asn_list[index]+"</p>" var popup = L.Popup({
); maxHeight: 50})
marker.addTo(map).openPopup() var popupcontent = "<p>Hop no:"+hop_list[index]+"<br /><div id='metadata' $(this).hide()><button id='but'>show metadata</button><div id='metadata-content'>Server name:<br />"+server_name_list[index]+"<br />Network owner:<br />"+asn_list[index]+"</div></div>"
marker.bindPopup(popupcontent)
//marker.addTo(map).openPopup()
$('#metadata-content').hide()
AddMarkerCluster(marker)
map.addLayer(clusterGroup)
} }
function AddStep(src, dest, index){ function AddStep(src, dest, index){
@ -66,5 +105,66 @@ window.onload = function () {
index = index + 1 index = index + 1
delay = (400 + timestamp_list[index]) delay = (400 + timestamp_list[index])
} }
$('.leaflet-marker-icon').bind('click', function(){
console.log('clickkkk')
})
};
//function chain for drawing the markers and lines on the map.
delay = (400+timestamp_list[index])
AddStep(latlong[index], latlong[index+1], index)
function AddMarker(src, index){
var marker = L.marker([src[0], src[1]])
var popup = L.Popup({
maxHeight: 50})
var popupcontent = "<p>Hop no:"+hop_list[index]+"<br /><div id='metadata' $(this).hide()><button id='but'>show metadata</button><div id='metadata-content'>Server name:<br />"+server_name_list[index]+"<br />Network owner:<br />"+asn_list[index]+"</div></div>"
marker.bindPopup(popupcontent)
marker.addTo(map).openPopup()
$('#metadata-content').hide()
}
function AddStep(src, dest, index){
var b = new R.BezierAnim([src, dest], {})
map.addLayer(b)
AddMarker(src, index)
processStep(index)
//console.log(delay)
}
function processStep (index) {
map.panTo(latlong[index]);
if (index < counter_max-2) {
//console.log('hop#', hop_list[index])
changeFavicon('js/world/'+country_code_list[index]+'.png')
window.setTimeout(function () {
AddStep(latlong[index], latlong[index+1], index)
}, delay);}
else
if (index < counter_max-1){
//console.log('hop#', hop_list[index])
changeFavicon('js/world/'+country_code_list[index]+'.png')
window.setTimeout(function () {
AddStep(latlong[index], latlong[index], index)
}, delay);}
else
if (index = counter_max-1){
changeFavicon('js/world/'+country_code_list[index]+'.png')
//console.log('fin')
//map.fitBounds([bounds])
}
index = index + 1
delay = (400 + timestamp_list[index])
}
$('.leaflet-marker-icon').bind('click', function(){
console.log('clickkkk')
})
}; };