Permalink
Browse files

center map on click location, better display for chart under the map

  • Loading branch information...
1 parent b4b4d8c commit 4a4910ef6977d261ca0963b523101cfed8e37924 @dkm committed Mar 12, 2012
Showing with 27 additions and 26 deletions.
  1. +6 −7 airspace/static/js/airspace.js
  2. +3 −2 airspace/static/style-amap.css
  3. +5 −4 airspace/static/style.css
  4. +13 −13 templates/airspace/amap.html
View
13 airspace/static/js/airspace.js
@@ -524,12 +524,15 @@ function displayZoneInfo(feature) {
info += '<li>Ceiling: ' + zoneSpecToString(feature.attributes['ceiling']) + '</li>';
info += '</li></fieldset>';
- var feat_lonlat_center = feature.geometry.getBounds().getCenterLonLat();
- map.panTo(feat_lonlat_center);
+// var feat_lonlat_center = feature.geometry.getBounds().getCenterLonLat();
+ var pixel = globalSelectCtrl.handlers.feature.evt.xy;
+ var location = map.getLonLatFromPixel(pixel);
+
+ map.panTo(location);
var popup = new OpenLayers.Popup.FramedCloud(
"zone-info",
- feat_lonlat_center,
+ location,
null,
info,
null,true);
@@ -538,10 +541,6 @@ function displayZoneInfo(feature) {
map.addPopup(popup, true);
}
-function clearZoneInfo(feature) {
- $('#zone-info').html("");
-}
-
function cleanIntersection() {
if (inter_vectors == undefined) {
initIntersectionLayer();
View
5 airspace/static/style-amap.css
@@ -1,7 +1,8 @@
div#chart-placeholder {
- width:800px;
+ left:0px;
+ right: 110px;
height:150px;
- float:left;
+ float:left;
}
div#chart-vertical {
View
9 airspace/static/style.css
@@ -75,13 +75,14 @@ h6 {
.smallmap {
/* width: 1200px;*/
/* height: 500px; */
-
- height: 100%;
+ /* top : 0px; */
+ /* bottom: 150px; */
+ height: 80%;
border: 1px solid #ccc;
}
#content {
- left: 185px;
+ left: 195px;
right: 0px;
top: 0px;
bottom: 0px;
@@ -91,7 +92,7 @@ h6 {
#left {
width: 185px;
- left: 0px;
+ left: 10px;
position: absolute;
}
View
26 templates/airspace/amap.html
@@ -40,6 +40,10 @@
<div id="content">
<div id="map" class="smallmap"></div>
+ <div id="charts">
+ <div id="chart-placeholder"></div>
+ <div id="chart-vertical"></div>
+ </div>
</div>
<div id="left">
@@ -76,7 +80,6 @@
<div id="zone_count">Zone Count:</div>
<div id="inter_count">Intersections Count:</div>
- <div id="zone-info"> </div>
<ul id="controlToggle">
<li>
@@ -95,15 +98,9 @@
</ul>
<div id="highlighted"></div>
- <div id="info"></div>
- </div> <!-- sidebar -->
-
- <div id="charts">
- <div id="chart-placeholder"></div>
- <div id="chart-vertical"></div>
- </div>
+ </div> <!-- left -->
- <script defer="defer" type="text/javascript">
+ <script defer="defer" type="text/javascript">
$('#spinner-ajax-load').hide();
$('#spinner-ajax-load').html('<img src="{{ STATIC_URL}}img/ajax-loader.gif" alt="loading"/> Loading data from remote server...');
var map = new OpenLayers.Map('map', {
@@ -154,19 +151,22 @@
});
map.addControl(highlightCtrl);
- var selectCtrl = new OpenLayers.Control.SelectFeature(vectors,
+ // don't change this name.
+ // it is used in displayZoneInfo to get coordinates
+ // of the click as this info is not
+ // provided to the handler...
+ var globalSelectCtrl = new OpenLayers.Control.SelectFeature(vectors,
{clickout: true,
onSelect: displayZoneInfo,
- onUnselect: clearZoneInfo,
}
);
- map.addControl(selectCtrl);
+ map.addControl(globalSelectCtrl);
map.addControl(new OpenLayers.Control.MousePosition());
highlightCtrl.activate();
layer_switcher.activate();
- selectCtrl.activate();
+ globalSelectCtrl.activate();
// map.events.register("mousemove", map, function(e) {
// var position = this.events.getMousePosition(e);

0 comments on commit 4a4910e

Please sign in to comment.