Check out the latest version of Routino: svn co http://routino.org/svn/trunk routino
Contents of /trunk/web/www/routino/visualiser.js
Parent Directory
|
Revision Log
Revision 1326 -
(show annotations)
(download)
(as text)
Sat May 18 09:48:24 2013 UTC (11 years, 10 months ago) by amb
File MIME type: application/javascript
File size: 29937 byte(s)
Sat May 18 09:48:24 2013 UTC (11 years, 10 months ago) by amb
File MIME type: application/javascript
File size: 29937 byte(s)
Change to using a popup like in the router and highlight the selected item when the popup is displayed.
1 | // |
2 | // Routino data visualiser web page Javascript |
3 | // |
4 | // Part of the Routino routing software. |
5 | // |
6 | // This file Copyright 2008-2013 Andrew M. Bishop |
7 | // |
8 | // This program is free software: you can redistribute it and/or modify |
9 | // it under the terms of the GNU Affero General Public License as published by |
10 | // the Free Software Foundation, either version 3 of the License, or |
11 | // (at your option) any later version. |
12 | // |
13 | // This program is distributed in the hope that it will be useful, |
14 | // but WITHOUT ANY WARRANTY; without even the implied warranty of |
15 | // MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the |
16 | // GNU Affero General Public License for more details. |
17 | // |
18 | // You should have received a copy of the GNU Affero General Public License |
19 | // along with this program. If not, see <http://www.gnu.org/licenses/>. |
20 | // |
21 | |
22 | |
23 | // |
24 | // Data types |
25 | // |
26 | |
27 | var data_types=[ |
28 | "junctions", |
29 | "super", |
30 | "oneway", |
31 | "highway", |
32 | "transport", |
33 | "barrier", |
34 | "turns", |
35 | "speed", |
36 | "weight", |
37 | "height", |
38 | "width", |
39 | "length", |
40 | "property", |
41 | "errorlogs" |
42 | ]; |
43 | |
44 | |
45 | // |
46 | // Styles |
47 | // |
48 | |
49 | var junction_colours={ |
50 | 0: "#FFFFFF", |
51 | 1: "#FF0000", |
52 | 2: "#FFFF00", |
53 | 3: "#00FF00", |
54 | 4: "#8B4513", |
55 | 5: "#00BFFF", |
56 | 6: "#FF69B4", |
57 | 7: "#000000", |
58 | 8: "#000000", |
59 | 9: "#000000" |
60 | }; |
61 | |
62 | var junction_styles={}; |
63 | |
64 | var selectable_node_style,node_style,segment_style,highlight_style; |
65 | |
66 | |
67 | //////////////////////////////////////////////////////////////////////////////// |
68 | /////////////////////////////// Initialisation ///////////////////////////////// |
69 | //////////////////////////////////////////////////////////////////////////////// |
70 | |
71 | // Process the URL query string and extract the arguments |
72 | |
73 | var legal={"^lon" : "^[-0-9.]+$", |
74 | "^lat" : "^[-0-9.]+$", |
75 | "^zoom" : "^[0-9]+$"}; |
76 | |
77 | var args={}; |
78 | |
79 | if(location.search.length>1) |
80 | { |
81 | var query,queries; |
82 | |
83 | query=location.search.replace(/^\?/,""); |
84 | query=query.replace(/;/g,'&'); |
85 | queries=query.split('&'); |
86 | |
87 | for(var i=0;i<queries.length;i++) |
88 | { |
89 | queries[i].match(/^([^=]+)(=(.*))?$/); |
90 | |
91 | k=RegExp.$1; |
92 | v=unescape(RegExp.$3); |
93 | |
94 | for(var l in legal) |
95 | { |
96 | if(k.match(RegExp(l)) && v.match(RegExp(legal[l]))) |
97 | args[k]=v; |
98 | } |
99 | } |
100 | } |
101 | |
102 | |
103 | //////////////////////////////////////////////////////////////////////////////// |
104 | ///////////////////////////////// Map handling ///////////////////////////////// |
105 | //////////////////////////////////////////////////////////////////////////////// |
106 | |
107 | var map; |
108 | var layerMap=[], layerHighlights, layerVectors, layerBoxes; |
109 | var epsg4326, epsg900913; |
110 | |
111 | var box; |
112 | var select; |
113 | |
114 | // |
115 | // Initialise the 'map' object |
116 | // |
117 | |
118 | function map_init() // called from visualiser.html |
119 | { |
120 | lon =args["lon"]; |
121 | lat =args["lat"]; |
122 | zoom=args["zoom"]; |
123 | |
124 | // Map URLs and limits are in mapprops.js. |
125 | |
126 | // |
127 | // Create the map |
128 | // |
129 | |
130 | epsg4326=new OpenLayers.Projection("EPSG:4326"); |
131 | epsg900913=new OpenLayers.Projection("EPSG:900913"); |
132 | |
133 | map = new OpenLayers.Map ("map", |
134 | { |
135 | controls:[ |
136 | new OpenLayers.Control.Navigation(), |
137 | new OpenLayers.Control.PanZoomBar(), |
138 | new OpenLayers.Control.ScaleLine(), |
139 | new OpenLayers.Control.LayerSwitcher() |
140 | ], |
141 | |
142 | projection: epsg900913, |
143 | displayProjection: epsg4326, |
144 | |
145 | minZoomLevel: mapprops.zoomout, |
146 | numZoomLevels: mapprops.zoomin-mapprops.zoomout+1, |
147 | maxResolution: 156543.03390625 / Math.pow(2,mapprops.zoomout), |
148 | |
149 | // These two lines are not needed with OpenLayers 2.12 |
150 | units: "m", |
151 | maxExtent: new OpenLayers.Bounds(-20037508.34, -20037508.34, 20037508.34, 20037508.34), |
152 | |
153 | restrictedExtent: new OpenLayers.Bounds(mapprops.westedge,mapprops.southedge,mapprops.eastedge,mapprops.northedge).transform(epsg4326,epsg900913) |
154 | }); |
155 | |
156 | // Add map tile layers |
157 | |
158 | for(var l=0;l < mapprops.mapdata.length;l++) |
159 | { |
160 | layerMap[l] = new OpenLayers.Layer.TMS(mapprops.mapdata[l].label, |
161 | mapprops.mapdata[l].tileurl, |
162 | { |
163 | getURL: limitedUrl, |
164 | displayOutsideMaxExtent: true, |
165 | buffer: 1 |
166 | }); |
167 | map.addLayer(layerMap[l]); |
168 | } |
169 | |
170 | // Update the attribution if the layer changes |
171 | |
172 | map.events.register("changelayer",layerMap,change_attribution_event); |
173 | |
174 | function change_attribution_event(event) |
175 | { |
176 | for(var l=0;l < mapprops.mapdata.length;l++) |
177 | if(this[l] == event.layer) |
178 | change_attribution(l); |
179 | } |
180 | |
181 | function change_attribution(l) |
182 | { |
183 | var data_url =mapprops.mapdata[l].attribution.data_url; |
184 | var data_text=mapprops.mapdata[l].attribution.data_text; |
185 | var tile_url =mapprops.mapdata[l].attribution.tile_url; |
186 | var tile_text=mapprops.mapdata[l].attribution.tile_text; |
187 | |
188 | document.getElementById("attribution_data").innerHTML="<a href=\"" + data_url + "\" target=\"data_attribution\">" + data_text + "</a>"; |
189 | document.getElementById("attribution_tile").innerHTML="<a href=\"" + tile_url + "\" target=\"tile_attribution\">" + tile_text + "</a>"; |
190 | } |
191 | |
192 | change_attribution(0); |
193 | |
194 | // Get a URL for the tile (mostly copied from OpenLayers/Layer/XYZ.js). |
195 | |
196 | function limitedUrl(bounds) |
197 | { |
198 | var res = map.getResolution(); |
199 | |
200 | var x = Math.round((bounds.left - this.maxExtent.left) / (res * this.tileSize.w)); |
201 | var y = Math.round((this.maxExtent.top - bounds.top) / (res * this.tileSize.h)); |
202 | var z = map.getZoom() + map.minZoomLevel; |
203 | |
204 | var limit = Math.pow(2, z); |
205 | x = ((x % limit) + limit) % limit; |
206 | |
207 | var xyz = {'x': x, 'y': y, 'z': z}; |
208 | var url = this.url; |
209 | |
210 | if (OpenLayers.Util.isArray(url)) |
211 | { |
212 | var s = '' + xyz.x + xyz.y + xyz.z; |
213 | url = this.selectUrl(s, url); |
214 | } |
215 | |
216 | return OpenLayers.String.format(url, xyz); |
217 | } |
218 | |
219 | // Add two vectors layers (one for highlights that display behind the vectors) |
220 | |
221 | layerHighlights = new OpenLayers.Layer.Vector("Highlights"); |
222 | map.addLayer(layerHighlights); |
223 | |
224 | layerVectors = new OpenLayers.Layer.Vector("Markers"); |
225 | map.addLayer(layerVectors); |
226 | |
227 | for(var colour in junction_colours) |
228 | junction_styles[colour]=new OpenLayers.Style({},{stroke: false, pointRadius: 2,fillColor: junction_colours[colour]}); |
229 | |
230 | node_style = new OpenLayers.Style({},{stroke: false, pointRadius: 3,fillColor : "#FF0000"}); |
231 | segment_style = new OpenLayers.Style({},{fill: false , strokeWidth: 2,strokeColor: "#FF0000"}); |
232 | selectable_node_style= new OpenLayers.Style({},{stroke: false, pointRadius: 3,fillColor: "#FF0000",cursor: "pointer"}); |
233 | |
234 | highlight_style = new OpenLayers.Style({},{strokeColor: "#F0F000",strokeWidth: 8, |
235 | fillColor: "#F0F000",pointRadius: 6}); |
236 | |
237 | // Handle feature selection and popup |
238 | |
239 | select = new OpenLayers.Control.SelectFeature(layerVectors, |
240 | {onSelect: selectFeature, onUnselect: unselectFeature}); |
241 | |
242 | map.addControl(select); |
243 | select.activate(); |
244 | |
245 | createPopup(); |
246 | |
247 | // Add a boxes layer |
248 | |
249 | layerBoxes = new OpenLayers.Layer.Boxes("Boundary"); |
250 | map.addLayer(layerBoxes); |
251 | |
252 | box=null; |
253 | |
254 | // Set the map centre to the limited range specified |
255 | |
256 | map.setCenter(map.restrictedExtent.getCenterLonLat(), map.getZoomForExtent(map.restrictedExtent,true)); |
257 | map.maxResolution = map.getResolution(); |
258 | |
259 | // Move the map |
260 | |
261 | if(lon != undefined && lat != undefined && zoom != undefined) |
262 | { |
263 | if(lon<mapprops.westedge) lon=mapprops.westedge; |
264 | if(lon>mapprops.eastedge) lon=mapprops.eastedge; |
265 | |
266 | if(lat<mapprops.southedge) lat=mapprops.southedge; |
267 | if(lat>mapprops.northedge) lat=mapprops.northedge; |
268 | |
269 | if(zoom<mapprops.zoomout) zoom=mapprops.zoomout; |
270 | if(zoom>mapprops.zoomin) zoom=mapprops.zoomin; |
271 | |
272 | var lonlat = new OpenLayers.LonLat(lon,lat); |
273 | lonlat.transform(epsg4326,epsg900913); |
274 | |
275 | map.moveTo(lonlat,zoom-map.minZoomLevel); |
276 | } |
277 | } |
278 | |
279 | |
280 | // |
281 | // Format a number in printf("%.5f") format. |
282 | // |
283 | |
284 | function format5f(number) |
285 | { |
286 | var newnumber=Math.floor(number*100000+0.5); |
287 | var delta=0; |
288 | |
289 | if(newnumber>=0 && newnumber<100000) delta= 100000; |
290 | if(newnumber<0 && newnumber>-100000) delta=-100000; |
291 | |
292 | var string=String(newnumber+delta); |
293 | |
294 | var intpart =string.substring(0,string.length-5); |
295 | var fracpart=string.substring(string.length-5,string.length); |
296 | |
297 | if(delta>0) intpart="0"; |
298 | if(delta<0) intpart="-0"; |
299 | |
300 | return(intpart + "." + fracpart); |
301 | } |
302 | |
303 | |
304 | // |
305 | // Build a set of URL arguments for the map location |
306 | // |
307 | |
308 | function buildMapArguments() |
309 | { |
310 | var lonlat = map.getCenter().clone(); |
311 | lonlat.transform(epsg900913,epsg4326); |
312 | |
313 | var zoom = map.getZoom() + map.minZoomLevel; |
314 | |
315 | return "lat=" + format5f(lonlat.lat) + ";lon=" + format5f(lonlat.lon) + ";zoom=" + zoom; |
316 | } |
317 | |
318 | |
319 | // |
320 | // Update a URL |
321 | // |
322 | |
323 | function updateURL(element) // called from visualiser.html |
324 | { |
325 | if(element.id == "permalink_url") |
326 | element.href=location.pathname + "?" + buildMapArguments(); |
327 | |
328 | if(element.id == "router_url") |
329 | element.href="router.html" + "?" + buildMapArguments(); |
330 | |
331 | if(element.id == "edit_url") |
332 | element.href="http://www.openstreetmap.org/edit" + "?" + buildMapArguments(); |
333 | |
334 | if(element.id.match(/^lang_([a-zA-Z-]+)_url$/)) |
335 | element.href="visualiser.html" + "." + RegExp.$1 + "?" + buildMapArguments(); |
336 | } |
337 | |
338 | |
339 | //////////////////////////////////////////////////////////////////////////////// |
340 | ///////////////////////// Popup and selection handling ///////////////////////// |
341 | //////////////////////////////////////////////////////////////////////////////// |
342 | |
343 | var popup=null; |
344 | |
345 | // |
346 | // Create a popup - not using OpenLayers because want it fixed on screen not fixed on map. |
347 | // |
348 | |
349 | function createPopup() |
350 | { |
351 | popup=document.createElement('div'); |
352 | |
353 | popup.className = "popup"; |
354 | |
355 | popup.innerHTML = "<span></span>"; |
356 | |
357 | popup.style.display = "none"; |
358 | |
359 | popup.style.position = "fixed"; |
360 | popup.style.top = "-4000px"; |
361 | popup.style.left = "-4000px"; |
362 | popup.style.zIndex = "100"; |
363 | |
364 | popup.style.padding = "5px"; |
365 | |
366 | popup.style.opacity=0.85; |
367 | popup.style.border="4px solid"; |
368 | |
369 | document.body.appendChild(popup); |
370 | } |
371 | |
372 | |
373 | // |
374 | // Draw a popup - not using OpenLayers because want it fixed on screen not fixed on map. |
375 | // |
376 | |
377 | function drawPopup(html) |
378 | { |
379 | if(html==null) |
380 | { |
381 | popup.style.display="none"; |
382 | return; |
383 | } |
384 | |
385 | if(popup.style.display=="none") |
386 | { |
387 | var map_div=document.getElementById("map"); |
388 | |
389 | popup.style.left =map_div.offsetParent.offsetLeft+map_div.offsetLeft+60 + "px"; |
390 | popup.style.top = map_div.offsetTop +30 + "px"; |
391 | popup.style.width =map_div.clientWidth-100 + "px"; |
392 | |
393 | popup.style.display=""; |
394 | } |
395 | |
396 | popup.innerHTML=html; |
397 | } |
398 | |
399 | |
400 | // |
401 | // Select a feature |
402 | // |
403 | |
404 | function selectFeature(feature) |
405 | { |
406 | drawPopup(feature.errorstring); |
407 | |
408 | layerHighlights.destroyFeatures(); |
409 | |
410 | highlight = new OpenLayers.Feature.Vector(feature.geometry.clone(),{},highlight_style); |
411 | |
412 | layerHighlights.addFeatures([highlight]); |
413 | } |
414 | |
415 | |
416 | // |
417 | // Un-select a feature |
418 | // |
419 | |
420 | function unselectFeature(feature) |
421 | { |
422 | layerHighlights.destroyFeatures(); |
423 | |
424 | drawPopup(null); |
425 | } |
426 | |
427 | |
428 | //////////////////////////////////////////////////////////////////////////////// |
429 | /////////////////////////////// Server handling //////////////////////////////// |
430 | //////////////////////////////////////////////////////////////////////////////// |
431 | |
432 | // |
433 | // Display the status |
434 | // |
435 | |
436 | function displayStatus(type,subtype,content) |
437 | { |
438 | var child=document.getElementById("result_status").firstChild; |
439 | |
440 | do |
441 | { |
442 | if(child.id != undefined) |
443 | child.style.display="none"; |
444 | |
445 | child=child.nextSibling; |
446 | } |
447 | while(child != undefined); |
448 | |
449 | var chosen_status=document.getElementById("result_status_" + type); |
450 | |
451 | chosen_status.style.display=""; |
452 | |
453 | if(subtype != null) |
454 | { |
455 | var format_status=document.getElementById("result_status_" + subtype).innerHTML; |
456 | |
457 | chosen_status.innerHTML=format_status.replace('#',String(content)); |
458 | } |
459 | } |
460 | |
461 | |
462 | // |
463 | // Display data statistics |
464 | // |
465 | |
466 | function displayStatistics() |
467 | { |
468 | // Use AJAX to get the statistics |
469 | |
470 | OpenLayers.Request.GET({url: "statistics.cgi", success: runStatisticsSuccess}); |
471 | } |
472 | |
473 | |
474 | // |
475 | // Success in running data statistics generation. |
476 | // |
477 | |
478 | function runStatisticsSuccess(response) |
479 | { |
480 | document.getElementById("statistics_data").innerHTML="<pre>" + response.responseText + "</pre>"; |
481 | document.getElementById("statistics_link").style.display="none"; |
482 | } |
483 | |
484 | |
485 | // |
486 | // Get the requested data |
487 | // |
488 | |
489 | function displayData(datatype) // called from visualiser.html |
490 | { |
491 | for(var data in data_types) |
492 | hideshow_hide(data_types[data]); |
493 | |
494 | if(datatype != "") |
495 | hideshow_show(datatype); |
496 | |
497 | // Delete the old data |
498 | |
499 | unselectFeature(); |
500 | |
501 | select.deactivate(); |
502 | |
503 | layerVectors.destroyFeatures(); |
504 | layerHighlights.destroyFeatures(); |
505 | |
506 | if(box != null) |
507 | layerBoxes.removeMarker(box); |
508 | box=null; |
509 | |
510 | // Print the status |
511 | |
512 | displayStatus("no_data"); |
513 | |
514 | // Return if just here to clear the data |
515 | |
516 | if(datatype == "") |
517 | return; |
518 | |
519 | // Get the new data |
520 | |
521 | var mapbounds=map.getExtent().clone(); |
522 | mapbounds.transform(epsg900913,epsg4326); |
523 | |
524 | var url="visualiser.cgi"; |
525 | |
526 | url=url + "?lonmin=" + mapbounds.left; |
527 | url=url + ";latmin=" + mapbounds.bottom; |
528 | url=url + ";lonmax=" + mapbounds.right; |
529 | url=url + ";latmax=" + mapbounds.top; |
530 | url=url + ";data=" + datatype; |
531 | |
532 | // Use AJAX to get the data |
533 | |
534 | switch(datatype) |
535 | { |
536 | case 'junctions': |
537 | OpenLayers.Request.GET({url: url, success: runJunctionsSuccess, failure: runFailure}); |
538 | break; |
539 | case 'super': |
540 | OpenLayers.Request.GET({url: url, success: runSuperSuccess, faliure: runFailure}); |
541 | break; |
542 | case 'oneway': |
543 | OpenLayers.Request.GET({url: url, success: runOnewaySuccess, failure: runFailure}); |
544 | break; |
545 | case 'highway': |
546 | var highways=document.forms["highways"].elements["highway"]; |
547 | for(var h in highways) |
548 | if(highways[h].checked) |
549 | highway=highways[h].value; |
550 | url+="-" + highway; |
551 | OpenLayers.Request.GET({url: url, success: runHighwaySuccess, falure: runFailure}); |
552 | break; |
553 | case 'transport': |
554 | var transports=document.forms["transports"].elements["transport"]; |
555 | for(var t in transports) |
556 | if(transports[t].checked) |
557 | transport=transports[t].value; |
558 | url+="-" + transport; |
559 | OpenLayers.Request.GET({url: url, success: runTransportSuccess, failure: runFailure}); |
560 | break; |
561 | case 'barrier': |
562 | var transports=document.forms["barriers"].elements["barrier"]; |
563 | for(var t in transports) |
564 | if(transports[t].checked) |
565 | transport=transports[t].value; |
566 | url+="-" + transport; |
567 | OpenLayers.Request.GET({url: url, success: runBarrierSuccess, failure: runFailure}); |
568 | break; |
569 | case 'turns': |
570 | OpenLayers.Request.GET({url: url, success: runTurnsSuccess, failure: runFailure}); |
571 | break; |
572 | case 'speed': |
573 | case 'weight': |
574 | case 'height': |
575 | case 'width': |
576 | case 'length': |
577 | OpenLayers.Request.GET({url: url, success: runLimitSuccess, failure: runFailure}); |
578 | break; |
579 | case 'property': |
580 | var properties=document.forms["properties"].elements["property"]; |
581 | for(var p in properties) |
582 | if(properties[p].checked) |
583 | property=properties[p].value; |
584 | url+="-" + property; |
585 | OpenLayers.Request.GET({url: url, success: runPropertySuccess, falure: runFailure}); |
586 | break; |
587 | case 'errorlogs': |
588 | OpenLayers.Request.GET({url: url, success: runErrorlogSuccess, falure: runFailure}); |
589 | break; |
590 | } |
591 | } |
592 | |
593 | |
594 | // |
595 | // Success in getting the junctions. |
596 | // |
597 | |
598 | function runJunctionsSuccess(response) |
599 | { |
600 | var lines=response.responseText.split('\n'); |
601 | |
602 | var features=[]; |
603 | |
604 | for(var line=0;line<lines.length;line++) |
605 | { |
606 | var words=lines[line].split(' '); |
607 | |
608 | if(line == 0) |
609 | { |
610 | var lat1=words[0]; |
611 | var lon1=words[1]; |
612 | var lat2=words[2]; |
613 | var lon2=words[3]; |
614 | |
615 | var bounds = new OpenLayers.Bounds(lon1,lat1,lon2,lat2).transform(epsg4326,epsg900913); |
616 | |
617 | box = new OpenLayers.Marker.Box(bounds); |
618 | |
619 | layerBoxes.addMarker(box); |
620 | } |
621 | else if(words[0] != "") |
622 | { |
623 | var lat=words[0]; |
624 | var lon=words[1]; |
625 | var count=words[2]; |
626 | |
627 | var lonlat= new OpenLayers.LonLat(lon,lat).transform(epsg4326,epsg900913); |
628 | |
629 | var point = new OpenLayers.Geometry.Point(lonlat.lon,lonlat.lat); |
630 | |
631 | features.push(new OpenLayers.Feature.Vector(point,{},junction_styles[count])); |
632 | } |
633 | } |
634 | |
635 | layerVectors.addFeatures(features); |
636 | |
637 | displayStatus("data","junctions",lines.length-2); |
638 | } |
639 | |
640 | |
641 | // |
642 | // Success in getting the super-node and super-segments |
643 | // |
644 | |
645 | function runSuperSuccess(response) |
646 | { |
647 | var lines=response.responseText.split('\n'); |
648 | |
649 | var features=[]; |
650 | |
651 | var nodepoint; |
652 | |
653 | for(var line=0;line<lines.length;line++) |
654 | { |
655 | var words=lines[line].split(' '); |
656 | |
657 | if(line == 0) |
658 | { |
659 | var lat1=words[0]; |
660 | var lon1=words[1]; |
661 | var lat2=words[2]; |
662 | var lon2=words[3]; |
663 | |
664 | var bounds = new OpenLayers.Bounds(lon1,lat1,lon2,lat2).transform(epsg4326,epsg900913); |
665 | |
666 | box = new OpenLayers.Marker.Box(bounds); |
667 | |
668 | layerBoxes.addMarker(box); |
669 | } |
670 | else if(words[0] != "") |
671 | { |
672 | var lat=words[0]; |
673 | var lon=words[1]; |
674 | var type=words[2]; |
675 | |
676 | var lonlat= new OpenLayers.LonLat(lon,lat).transform(epsg4326,epsg900913); |
677 | |
678 | var point = new OpenLayers.Geometry.Point(lonlat.lon,lonlat.lat); |
679 | |
680 | if(type == "n") |
681 | { |
682 | nodepoint=point; |
683 | |
684 | features.push(new OpenLayers.Feature.Vector(point,{},node_style)); |
685 | } |
686 | else |
687 | { |
688 | var segment = new OpenLayers.Geometry.LineString([nodepoint,point]); |
689 | |
690 | features.push(new OpenLayers.Feature.Vector(segment,{},segment_style)); |
691 | } |
692 | } |
693 | } |
694 | |
695 | layerVectors.addFeatures(features); |
696 | |
697 | displayStatus("data","super",lines.length-2); |
698 | } |
699 | |
700 | |
701 | // |
702 | // Success in getting the oneway data |
703 | // |
704 | |
705 | function runOnewaySuccess(response) |
706 | { |
707 | var hex={0: "00", 1: "11", 2: "22", 3: "33", 4: "44", 5: "55", 6: "66", 7: "77", |
708 | 8: "88", 9: "99", 10: "AA", 11: "BB", 12: "CC", 13: "DD", 14: "EE", 15: "FF"}; |
709 | |
710 | var lines=response.responseText.split('\n'); |
711 | |
712 | var features=[]; |
713 | |
714 | for(var line=0;line<lines.length;line++) |
715 | { |
716 | var words=lines[line].split(' '); |
717 | |
718 | if(line == 0) |
719 | { |
720 | var lat1=words[0]; |
721 | var lon1=words[1]; |
722 | var lat2=words[2]; |
723 | var lon2=words[3]; |
724 | |
725 | var bounds = new OpenLayers.Bounds(lon1,lat1,lon2,lat2).transform(epsg4326,epsg900913); |
726 | |
727 | box = new OpenLayers.Marker.Box(bounds); |
728 | |
729 | layerBoxes.addMarker(box); |
730 | } |
731 | else if(words[0] != "") |
732 | { |
733 | var lat1=words[0]; |
734 | var lon1=words[1]; |
735 | var lat2=words[2]; |
736 | var lon2=words[3]; |
737 | |
738 | var lonlat1= new OpenLayers.LonLat(lon1,lat1).transform(epsg4326,epsg900913); |
739 | var lonlat2= new OpenLayers.LonLat(lon2,lat2).transform(epsg4326,epsg900913); |
740 | |
741 | //var point1 = new OpenLayers.Geometry.Point(lonlat1.lon,lonlat1.lat); |
742 | var point2 = new OpenLayers.Geometry.Point(lonlat2.lon,lonlat2.lat); |
743 | |
744 | var dlat = lonlat2.lat-lonlat1.lat; |
745 | var dlon = lonlat2.lon-lonlat1.lon; |
746 | var dist = Math.sqrt(dlat*dlat+dlon*dlon)/10; |
747 | var ang = Math.atan2(dlat,dlon); |
748 | |
749 | var point3 = new OpenLayers.Geometry.Point(lonlat1.lon+dlat/dist,lonlat1.lat-dlon/dist); |
750 | var point4 = new OpenLayers.Geometry.Point(lonlat1.lon-dlat/dist,lonlat1.lat+dlon/dist); |
751 | |
752 | var segment = new OpenLayers.Geometry.LineString([point2,point3,point4,point2]); |
753 | |
754 | var r=Math.round(7.5+7.9*Math.cos(ang)); |
755 | var g=Math.round(7.5+7.9*Math.cos(ang+2.0943951)); |
756 | var b=Math.round(7.5+7.9*Math.cos(ang-2.0943951)); |
757 | var colour = "#" + hex[r] + hex[g] + hex[b]; |
758 | |
759 | var style=new OpenLayers.Style({},{strokeWidth: 2,strokeColor: colour}); |
760 | |
761 | features.push(new OpenLayers.Feature.Vector(segment,{},style)); |
762 | } |
763 | } |
764 | |
765 | layerVectors.addFeatures(features); |
766 | |
767 | displayStatus("data","oneway",lines.length-2); |
768 | } |
769 | |
770 | |
771 | // |
772 | // Success in getting the highway data |
773 | // |
774 | |
775 | function runHighwaySuccess(response) |
776 | { |
777 | var lines=response.responseText.split('\n'); |
778 | |
779 | var features=[]; |
780 | |
781 | for(var line=0;line<lines.length;line++) |
782 | { |
783 | var words=lines[line].split(' '); |
784 | |
785 | if(line == 0) |
786 | { |
787 | var lat1=words[0]; |
788 | var lon1=words[1]; |
789 | var lat2=words[2]; |
790 | var lon2=words[3]; |
791 | |
792 | var bounds = new OpenLayers.Bounds(lon1,lat1,lon2,lat2).transform(epsg4326,epsg900913); |
793 | |
794 | box = new OpenLayers.Marker.Box(bounds); |
795 | |
796 | layerBoxes.addMarker(box); |
797 | } |
798 | else if(words[0] != "") |
799 | { |
800 | var lat1=words[0]; |
801 | var lon1=words[1]; |
802 | var lat2=words[2]; |
803 | var lon2=words[3]; |
804 | |
805 | var lonlat1= new OpenLayers.LonLat(lon1,lat1).transform(epsg4326,epsg900913); |
806 | var lonlat2= new OpenLayers.LonLat(lon2,lat2).transform(epsg4326,epsg900913); |
807 | |
808 | var point1 = new OpenLayers.Geometry.Point(lonlat1.lon,lonlat1.lat); |
809 | var point2 = new OpenLayers.Geometry.Point(lonlat2.lon,lonlat2.lat); |
810 | |
811 | var segment = new OpenLayers.Geometry.LineString([point1,point2]); |
812 | |
813 | features.push(new OpenLayers.Feature.Vector(segment,{},segment_style)); |
814 | } |
815 | } |
816 | |
817 | layerVectors.addFeatures(features); |
818 | |
819 | displayStatus("data","highway",lines.length-2); |
820 | } |
821 | |
822 | |
823 | // |
824 | // Success in getting the transport data |
825 | // |
826 | |
827 | function runTransportSuccess(response) |
828 | { |
829 | var lines=response.responseText.split('\n'); |
830 | |
831 | var features=[]; |
832 | |
833 | for(var line=0;line<lines.length;line++) |
834 | { |
835 | var words=lines[line].split(' '); |
836 | |
837 | if(line == 0) |
838 | { |
839 | var lat1=words[0]; |
840 | var lon1=words[1]; |
841 | var lat2=words[2]; |
842 | var lon2=words[3]; |
843 | |
844 | var bounds = new OpenLayers.Bounds(lon1,lat1,lon2,lat2).transform(epsg4326,epsg900913); |
845 | |
846 | box = new OpenLayers.Marker.Box(bounds); |
847 | |
848 | layerBoxes.addMarker(box); |
849 | } |
850 | else if(words[0] != "") |
851 | { |
852 | var lat1=words[0]; |
853 | var lon1=words[1]; |
854 | var lat2=words[2]; |
855 | var lon2=words[3]; |
856 | |
857 | var lonlat1= new OpenLayers.LonLat(lon1,lat1).transform(epsg4326,epsg900913); |
858 | var lonlat2= new OpenLayers.LonLat(lon2,lat2).transform(epsg4326,epsg900913); |
859 | |
860 | var point1 = new OpenLayers.Geometry.Point(lonlat1.lon,lonlat1.lat); |
861 | var point2 = new OpenLayers.Geometry.Point(lonlat2.lon,lonlat2.lat); |
862 | |
863 | var segment = new OpenLayers.Geometry.LineString([point1,point2]); |
864 | |
865 | features.push(new OpenLayers.Feature.Vector(segment,{},segment_style)); |
866 | } |
867 | } |
868 | |
869 | layerVectors.addFeatures(features); |
870 | |
871 | displayStatus("data","transport",lines.length-2); |
872 | } |
873 | |
874 | |
875 | // |
876 | // Success in getting the barrier data |
877 | // |
878 | |
879 | function runBarrierSuccess(response) |
880 | { |
881 | var lines=response.responseText.split('\n'); |
882 | |
883 | var features=[]; |
884 | |
885 | for(var line=0;line<lines.length;line++) |
886 | { |
887 | var words=lines[line].split(' '); |
888 | |
889 | if(line == 0) |
890 | { |
891 | var lat1=words[0]; |
892 | var lon1=words[1]; |
893 | var lat2=words[2]; |
894 | var lon2=words[3]; |
895 | |
896 | var bounds = new OpenLayers.Bounds(lon1,lat1,lon2,lat2).transform(epsg4326,epsg900913); |
897 | |
898 | box = new OpenLayers.Marker.Box(bounds); |
899 | |
900 | layerBoxes.addMarker(box); |
901 | } |
902 | else if(words[0] != "") |
903 | { |
904 | var lat=words[0]; |
905 | var lon=words[1]; |
906 | |
907 | var lonlat= new OpenLayers.LonLat(lon,lat).transform(epsg4326,epsg900913); |
908 | |
909 | var point = new OpenLayers.Geometry.Point(lonlat.lon,lonlat.lat); |
910 | |
911 | features.push(new OpenLayers.Feature.Vector(point,{},node_style)); |
912 | } |
913 | } |
914 | |
915 | layerVectors.addFeatures(features); |
916 | |
917 | displayStatus("data","barrier",lines.length-2); |
918 | } |
919 | |
920 | |
921 | // |
922 | // Success in getting the turn restrictions data |
923 | // |
924 | |
925 | function runTurnsSuccess(response) |
926 | { |
927 | var lines=response.responseText.split('\n'); |
928 | |
929 | var features=[]; |
930 | |
931 | for(var line=0;line<lines.length;line++) |
932 | { |
933 | var words=lines[line].split(' '); |
934 | |
935 | if(line == 0) |
936 | { |
937 | var lat1=words[0]; |
938 | var lon1=words[1]; |
939 | var lat2=words[2]; |
940 | var lon2=words[3]; |
941 | |
942 | var bounds = new OpenLayers.Bounds(lon1,lat1,lon2,lat2).transform(epsg4326,epsg900913); |
943 | |
944 | box = new OpenLayers.Marker.Box(bounds); |
945 | |
946 | layerBoxes.addMarker(box); |
947 | } |
948 | else if(words[0] != "") |
949 | { |
950 | var lat1=words[0]; |
951 | var lon1=words[1]; |
952 | var lat2=words[2]; |
953 | var lon2=words[3]; |
954 | var lat3=words[4]; |
955 | var lon3=words[5]; |
956 | |
957 | var lonlat1= new OpenLayers.LonLat(lon1,lat1).transform(epsg4326,epsg900913); |
958 | var lonlat2= new OpenLayers.LonLat(lon2,lat2).transform(epsg4326,epsg900913); |
959 | var lonlat3= new OpenLayers.LonLat(lon3,lat3).transform(epsg4326,epsg900913); |
960 | |
961 | var point1 = new OpenLayers.Geometry.Point(lonlat1.lon,lonlat1.lat); |
962 | var point2 = new OpenLayers.Geometry.Point(lonlat2.lon,lonlat2.lat); |
963 | var point3 = new OpenLayers.Geometry.Point(lonlat3.lon,lonlat3.lat); |
964 | |
965 | var segments = new OpenLayers.Geometry.LineString([point1,point2,point3]); |
966 | |
967 | features.push(new OpenLayers.Feature.Vector(segments,{},segment_style)); |
968 | } |
969 | } |
970 | |
971 | layerVectors.addFeatures(features); |
972 | |
973 | displayStatus("data","turns",lines.length-2); |
974 | } |
975 | |
976 | |
977 | // |
978 | // Success in getting the speed/weight/height/width/length limits |
979 | // |
980 | |
981 | function runLimitSuccess(response) |
982 | { |
983 | var lines=response.responseText.split('\n'); |
984 | |
985 | var features=[]; |
986 | |
987 | var nodelonlat; |
988 | |
989 | for(var line=0;line<lines.length;line++) |
990 | { |
991 | var words=lines[line].split(' '); |
992 | |
993 | if(line == 0) |
994 | { |
995 | var lat1=words[0]; |
996 | var lon1=words[1]; |
997 | var lat2=words[2]; |
998 | var lon2=words[3]; |
999 | |
1000 | var bounds = new OpenLayers.Bounds(lon1,lat1,lon2,lat2).transform(epsg4326,epsg900913); |
1001 | |
1002 | box = new OpenLayers.Marker.Box(bounds); |
1003 | |
1004 | layerBoxes.addMarker(box); |
1005 | } |
1006 | else if(words[0] != "") |
1007 | { |
1008 | var lat=words[0]; |
1009 | var lon=words[1]; |
1010 | var number=words[2]; |
1011 | |
1012 | var lonlat= new OpenLayers.LonLat(lon,lat).transform(epsg4326,epsg900913); |
1013 | |
1014 | if(number == undefined) |
1015 | { |
1016 | var point = new OpenLayers.Geometry.Point(lonlat.lon,lonlat.lat); |
1017 | |
1018 | nodelonlat=lonlat; |
1019 | |
1020 | features.push(new OpenLayers.Feature.Vector(point,{},node_style)); |
1021 | } |
1022 | else |
1023 | { |
1024 | var dlat = lonlat.lat-nodelonlat.lat; |
1025 | var dlon = lonlat.lon-nodelonlat.lon; |
1026 | var dist = Math.sqrt(dlat*dlat+dlon*dlon)/60; |
1027 | |
1028 | var point = new OpenLayers.Geometry.Point(nodelonlat.lon+dlon/dist,nodelonlat.lat+dlat/dist); |
1029 | |
1030 | features.push(new OpenLayers.Feature.Vector(point,{}, |
1031 | new OpenLayers.Style({},{externalGraphic: 'icons/limit-' + number + '.png', |
1032 | graphicYOffset: -9, |
1033 | graphicWidth: 19, |
1034 | graphicHeight: 19}))); |
1035 | } |
1036 | } |
1037 | } |
1038 | |
1039 | layerVectors.addFeatures(features); |
1040 | |
1041 | displayStatus("data","limit",lines.length-2); |
1042 | } |
1043 | |
1044 | |
1045 | // |
1046 | // Success in getting the property data |
1047 | // |
1048 | |
1049 | function runPropertySuccess(response) |
1050 | { |
1051 | var lines=response.responseText.split('\n'); |
1052 | |
1053 | var features=[]; |
1054 | |
1055 | for(var line=0;line<lines.length;line++) |
1056 | { |
1057 | var words=lines[line].split(' '); |
1058 | |
1059 | if(line == 0) |
1060 | { |
1061 | var lat1=words[0]; |
1062 | var lon1=words[1]; |
1063 | var lat2=words[2]; |
1064 | var lon2=words[3]; |
1065 | |
1066 | var bounds = new OpenLayers.Bounds(lon1,lat1,lon2,lat2).transform(epsg4326,epsg900913); |
1067 | |
1068 | box = new OpenLayers.Marker.Box(bounds); |
1069 | |
1070 | layerBoxes.addMarker(box); |
1071 | } |
1072 | else if(words[0] != "") |
1073 | { |
1074 | var lat1=words[0]; |
1075 | var lon1=words[1]; |
1076 | var lat2=words[2]; |
1077 | var lon2=words[3]; |
1078 | |
1079 | var lonlat1= new OpenLayers.LonLat(lon1,lat1).transform(epsg4326,epsg900913); |
1080 | var lonlat2= new OpenLayers.LonLat(lon2,lat2).transform(epsg4326,epsg900913); |
1081 | |
1082 | var point1 = new OpenLayers.Geometry.Point(lonlat1.lon,lonlat1.lat); |
1083 | var point2 = new OpenLayers.Geometry.Point(lonlat2.lon,lonlat2.lat); |
1084 | |
1085 | var segment = new OpenLayers.Geometry.LineString([point1,point2]); |
1086 | |
1087 | features.push(new OpenLayers.Feature.Vector(segment,{},segment_style)); |
1088 | } |
1089 | } |
1090 | |
1091 | layerVectors.addFeatures(features); |
1092 | |
1093 | displayStatus("data","property",lines.length-2); |
1094 | } |
1095 | |
1096 | |
1097 | // |
1098 | // Success in getting the error log data |
1099 | // |
1100 | |
1101 | function runErrorlogSuccess(response) |
1102 | { |
1103 | var lines=response.responseText.split('\n'); |
1104 | |
1105 | var features=[]; |
1106 | |
1107 | for(var line=0;line<lines.length;line++) |
1108 | { |
1109 | var words=lines[line].split(' '); |
1110 | |
1111 | if(line == 0) |
1112 | { |
1113 | var lat1=words[0]; |
1114 | var lon1=words[1]; |
1115 | var lat2=words[2]; |
1116 | var lon2=words[3]; |
1117 | |
1118 | var bounds = new OpenLayers.Bounds(lon1,lat1,lon2,lat2).transform(epsg4326,epsg900913); |
1119 | |
1120 | box = new OpenLayers.Marker.Box(bounds); |
1121 | |
1122 | layerBoxes.addMarker(box); |
1123 | } |
1124 | else if(words[0] != "") |
1125 | { |
1126 | var lat=words[0]; |
1127 | var lon=words[1]; |
1128 | var string=words.slice(2).join(" "); |
1129 | |
1130 | var lonlat = new OpenLayers.LonLat(lon,lat).transform(epsg4326,epsg900913); |
1131 | |
1132 | var point = new OpenLayers.Geometry.Point(lonlat.lon,lonlat.lat); |
1133 | |
1134 | feature = new OpenLayers.Feature.Vector(point,{},selectable_node_style); |
1135 | |
1136 | features.push(feature); |
1137 | |
1138 | feature.errorstring=string; |
1139 | } |
1140 | } |
1141 | |
1142 | select.activate(); |
1143 | |
1144 | layerVectors.addFeatures(features); |
1145 | |
1146 | displayStatus("data","errorlogs",lines.length-2); |
1147 | } |
1148 | |
1149 | |
1150 | // |
1151 | // Failure in getting data. |
1152 | // |
1153 | |
1154 | function runFailure(response) |
1155 | { |
1156 | displayStatus("failed"); |
1157 | } |