map.addControl(box);
map.events.register("moveend", map, validateLinks);
map.events.triggerEvent("moveend");
+ if (map.getZoom() >= 16) {
+ useMap();
+ } else {
+ $("status").innerHTML = "Zoom in or Select an area of the map to view.";
+ }
}
function stopBrowse() {
function useMap() {
var bounds = map.getExtent();
- setBounds(bounds);
getData(bounds);
return false;
}
function endDrag(bbox) {
var bounds = bbox.getBounds();
- setBounds(bounds);
box.deactivate();
getData(bounds);
$("drag_box").innerHTML = "Manually select a different area";
}
function displayFeatureWarning() {
+ $("status").innerHTML = "";
var div = document.createElement("div");
var p = document.createElement("p");
p.appendChild(document.createTextNode("You have loaded an area which contains " + featureList.length + " features. In general, some browsers may not cope well with displaying this quantity of data. Generally, browsers work best at displaying less than 100 features at a time: doing anything else may make your browser slow/unresponsive. If you are sure you want to display this data, you may do so by clicking the button below."));
var url = "/api/0.5/map?bbox="+bounds.toBBOX();
+ loadGML(url);
+ }
+ function loadGML(url) {
$("status").innerHTML = "Loading...";
if (!gml) {
- var def = OpenLayers.Feature.Vector.style['default'];
var style = new OpenLayers.Style();
style.addRules([new OpenLayers.Rule(
{'symbolizer':
gml = new OpenLayers.Layer.GML("Data",url,
{format: OpenLayers.Format.OSM, formatOptions: {checkTags: true},
maxFeatures: 100, requestSuccess: customDataLoader,
- styleMap: new OpenLayers.StyleMap({'default': style, 'select': {'strokeColor': '#0000ff'}})
+ styleMap: new OpenLayers.StyleMap({'default': style, 'select': {'strokeColor': '#0000ff', strokeWidth: 8}})
}
);
gml.events.register("loadend", gml, dataLoaded );
currentFeature = null;
}
-
function dataLoaded() {
$("status").innerHTML = "Loaded " + this.features.length + " features. (<a href='"+ this.url+"'>API</a>)";
currentFeature = feature;
}
- function setBounds(bounds) {
- var epsg4326 = new OpenLayers.Projection("EPSG:4326");
- var decimals = Math.pow(10, Math.floor(map.getZoom() / 3));
-
- bounds = bounds.clone().transform(map.getProjectionObject(), epsg4326);
-
- $("minlon").innerHTML = Math.round(bounds.left * decimals) / decimals;
- $("minlat").innerHTML = Math.round(bounds.bottom * decimals) / decimals;
- $("maxlon").innerHTML = Math.round(bounds.right * decimals) / decimals;
- $("maxlat").innerHTML = Math.round(bounds.top * decimals) / decimals;
- }
function validateLinks() {
var bounds = this.getExtent();
bounds = bounds.clone().transform(map.getProjectionObject(), epsg4326);
<% end %>
<li><%= link_to 'GPS Traces', {:controller => 'trace', :action => 'list'}, {:id => 'traceanchor', :title => 'manage traces', :class => traceclass} %></li>
<li><%= link_to 'User Diaries', {:controller => 'diary_entry', :action => 'list'}, {:id => 'diaryanchor', :title => 'view user diaries', :class => diaryclass} %></li>
- <li><%= link_to_remote 'Browse', {:url => {:controller => 'browse', :action => 'start'}}, {:href => url_for( {:controller => 'browse', :action => 'index'}), :id => 'browseanchor', :title => 'browse data', :class => browseclass} %></li>
</ul>
</div>