commit
165c42004d
|
@ -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()
|
||||||
|
|
|
@ -1,36 +1,61 @@
|
||||||
|
<!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;
|
||||||
|
}
|
||||||
|
.olPopup p { margin:0px; }
|
||||||
|
.nodePopup { font-size: 0.8em; }
|
||||||
|
.nodePopup .label { font-weight: bold; }
|
||||||
|
</style>
|
||||||
|
|
||||||
box-sizing:border-box;
|
<title>Freifunk Lübeck - Knotenkarte</title>
|
||||||
|
|
||||||
}
|
<script src="http://maps.burningsilicon.net/OpenLayers-2.8/OpenLayers.js"></script>
|
||||||
.olPopup p { margin:0px; }
|
<script src="http://maps.burningsilicon.net/OpenLayers-2.8/OpenStreetMap.js"></script>
|
||||||
</style>
|
<script type="text/javascript" src="d3.v2.js"></script>
|
||||||
|
<script type="text/javascript" src="geomap.js"></script>
|
||||||
|
|
||||||
<title>Freifunk Lübeck - Knotenkarte</title>
|
<script type="text/javascript">
|
||||||
|
window.onresize = resize
|
||||||
|
|
||||||
<script src="http://maps.burningsilicon.net/OpenLayers-2.8/OpenLayers.js"></script>
|
function getOffset( el ) {
|
||||||
<script src="http://maps.burningsilicon.net/OpenLayers-2.8/OpenStreetMap.js"></script>
|
var _x = 0, _y = 0
|
||||||
<script type="text/javascript" src="d3.v2.js"></script>
|
|
||||||
<script type="text/javascript" src="geomap.js"></script>
|
|
||||||
</head>
|
|
||||||
|
|
||||||
<body onload="init()">
|
while( el && !isNaN( el.offsetLeft ) && !isNaN( el.offsetTop ) ) {
|
||||||
<header>
|
_x += el.offsetLeft - el.scrollLeft
|
||||||
<h1>luebeck.freifunk.net</h1>
|
_y += el.offsetTop - el.scrollTop
|
||||||
<ul>
|
el = el.offsetParent
|
||||||
<li><a href="nodes.html">Knotengraph</a></li>
|
}
|
||||||
<li><a href="geomap.html">Knotenkarte</a></li>
|
return { top: _y, left: _x }
|
||||||
</ul>
|
}
|
||||||
</header>
|
|
||||||
<div id="map"></div>
|
function resize() {
|
||||||
</body>
|
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>
|
||||||
|
|
||||||
|
<body onload="resize(); init()">
|
||||||
|
<header>
|
||||||
|
<h1>luebeck.freifunk.net</h1>
|
||||||
|
<ul>
|
||||||
|
<li><a href="nodes.html">Knotengraph</a></li>
|
||||||
|
<li><a href="geomap.html">Knotenkarte</a></li>
|
||||||
|
</ul>
|
||||||
|
</header>
|
||||||
|
<div id="map"></div>
|
||||||
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
|
@ -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);
|
||||||
|
|
Loading…
Reference in New Issue