freifunk/ffmap-backend
0
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

Merge branch 'master' of github.com:tcatm/ffmap-d3

Browse source
This commit is contained in:
Nils Schneider 2012-06-20 01:58:04 +02:00
parent d5c4c2139d 165c42004d
commit f2bced1fba
3 changed files with 66 additions and 31 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
html/force.js
View file

@ -27,8 +27,6 @@ function getOffset( el ) {
return { top: _y, left: _x } return { top: _y, left: _x }
} }
var offset = getOffset(document.getElementById('chart'))
var w, h var w, h
resize() resize()

35
html/geomap.html
View file

@ -1,18 +1,18 @@
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"> <html xmlns="http://www.w3.org/1999/xhtml">
<head> <head>
<meta http-equiv="content-type" content="text/html;charset=utf-8"> <meta http-equiv="content-type" content="text/html;charset=utf-8" />
<link rel="stylesheet" href="theme/default/style.css" type="text/css" /> <link rel="stylesheet" href="theme/default/style.css" type="text/css" />
<link href='style.css' rel='stylesheet' type='text/css' /> <link href='style.css' rel='stylesheet' type='text/css' />
<style type="text/css"> <style type="text/css">
#map { #map {
float: left;
width: 100%; width: 100%;
box-sizing:border-box; box-sizing:border-box;
} }
.olPopup p { margin:0px; } .olPopup p { margin:0px; }
.nodePopup { font-size: 0.8em; }
.nodePopup .label { font-weight: bold; }
</style> </style>
<title>Freifunk Lübeck - Knotenkarte</title> <title>Freifunk Lübeck - Knotenkarte</title>
@ -21,9 +21,34 @@
<script src="http://maps.burningsilicon.net/OpenLayers-2.8/OpenStreetMap.js"></script> <script src="http://maps.burningsilicon.net/OpenLayers-2.8/OpenStreetMap.js"></script>
<script type="text/javascript" src="d3.v2.js"></script> <script type="text/javascript" src="d3.v2.js"></script>
<script type="text/javascript" src="geomap.js"></script> <script type="text/javascript" src="geomap.js"></script>
<script type="text/javascript">
window.onresize = resize
function getOffset( el ) {
var _x = 0, _y = 0
while( el && !isNaN( el.offsetLeft ) && !isNaN( el.offsetTop ) ) {
_x += el.offsetLeft - el.scrollLeft
_y += el.offsetTop - el.scrollTop
el = el.offsetParent
}
return { top: _y, left: _x }
}
function resize() {
var offset = getOffset(document.getElementById('map'))
var w = window.innerWidth - offset.left
var h = window.innerHeight - offset.top - 1
d3.select("#map").style("width", w+"px").style("height", h+"px")
resizeMap()
}
</script>
</head> </head>
<body onload="init()"> <body onload="resize(); init()">
<header> <header>
<h1>luebeck.freifunk.net</h1> <h1>luebeck.freifunk.net</h1>
<ul> <ul>

14
html/geomap.js
View file

@ -1,4 +1,5 @@
var map; var map;
var vectorLayer;
OpenLayers.Control.Click = OpenLayers.Class(OpenLayers.Control); OpenLayers.Control.Click = OpenLayers.Class(OpenLayers.Control);
@ -43,6 +44,17 @@ function init()
load_json(vectorLayer, map) load_json(vectorLayer, map)
} }
function resizeMap()
{
if (map !== undefined) {
map.updateSize()
// Did someone say Chrome bug?
map.removeLayer(vectorLayer)
map.addLayer(vectorLayer)
}
}
function onPopupClose(evt) function onPopupClose(evt)
{ {
selectControl.unselect(selectedFeature); selectControl.unselect(selectedFeature);
@ -54,7 +66,7 @@ function onFeatureSelect(feature)
popup = new OpenLayers.Popup.FramedCloud("chicken", popup = new OpenLayers.Popup.FramedCloud("chicken",
feature.geometry.getBounds().getCenterLonLat(), feature.geometry.getBounds().getCenterLonLat(),
new OpenLayers.Size(100,150), new OpenLayers.Size(100,150),
"<div style='font-size:.8em'><b>Name:</b>"+feature.attributes.name+"<br><b>Description:</b>"+feature.attributes.description+"</div>", "<div class='nodePopup'><span class='label'>Name:</span> "+feature.attributes.name+"<br><span class='label'>Description:</span> "+feature.attributes.description+"</div>",
null, true, onPopupClose); null, true, onPopupClose);
feature.popup = popup; feature.popup = popup;
map.addPopup(popup); map.addPopup(popup);