Routino SVN Repository Browser

Check out the latest version of Routino: svn co http://routino.org/svn/trunk routino

ViewVC logotype

Annotation of /trunk/web/www/routino/visualiser.html.en

Parent Directory Parent Directory | Revision Log Revision Log


Revision 1321 - (hide annotations) (download)
Fri May 17 14:54:56 2013 UTC (11 years, 10 months ago) by amb
File size: 22112 byte(s)
Allow dumping error logs from filedumper.

1 amb 569 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
2     <HTML>
3    
4 amb 1257 <HEAD>
5     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
6     <meta name="keywords" content="openstreetmap routino verifier">
7    
8     <title>Routino : Data Visualiser for Routino OpenStreetMap Data</title>
9    
10 amb 569 <!--
11     Routino data visualiser web page.
12    
13     Part of the Routino routing software.
14    
15 amb 1239 This file Copyright 2008-2013 Andrew M. Bishop
16 amb 569
17     This program is free software: you can redistribute it and/or modify
18     it under the terms of the GNU Affero General Public License as published by
19     the Free Software Foundation, either version 3 of the License, or
20     (at your option) any later version.
21    
22     This program is distributed in the hope that it will be useful,
23     but WITHOUT ANY WARRANTY; without even the implied warranty of
24     MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
25     GNU Affero General Public License for more details.
26    
27     You should have received a copy of the GNU Affero General Public License
28     along with this program. If not, see http://www.gnu.org/licenses/.
29     -->
30    
31     <!-- OpenLayers Javascript library -->
32     <script src="../openlayers/OpenLayers.js" type="text/javascript"></script>
33    
34     <!-- Page elements -->
35     <script src="page-elements.js" type="text/javascript"></script>
36     <link href="page-elements.css" type="text/css" rel="stylesheet">
37    
38 amb 577 <!-- Router and visualiser shared features -->
39     <link href="maplayout.css" type="text/css" rel="stylesheet">
40     <!--[if IE 6]>
41     <link href="maplayout-ie6-bugfixes.css" type="text/css" rel="stylesheet">
42     <![endif]-->
43     <!--[if IE 7]>
44     <link href="maplayout-ie7-bugfixes.css" type="text/css" rel="stylesheet">
45     <![endif]-->
46    
47 amb 569 <!-- Visualiser specific features -->
48 amb 933 <script src="mapprops.js" type="text/javascript"></script>
49 amb 569 <script src="visualiser.js" type="text/javascript"></script>
50     <link href="visualiser.css" type="text/css" rel="stylesheet">
51 amb 1257 </HEAD>
52 amb 569
53 amb 985 <BODY onload="map_init();">
54 amb 569
55     <!-- Left hand side of window - data panel -->
56    
57     <div class="left_panel">
58    
59 amb 577 <div class="tab_box">
60     <span id="tab_visualiser" onclick="tab_select('visualiser');" class="tab_selected" title="Select data options">Visualiser</span>
61     <span id="tab_router" onclick="tab_select('router');" class="tab_unselected" title="Plan a route">Router</span>
62     <span id="tab_data" onclick="tab_select('data');" class="tab_unselected" title="View database information">Data</span>
63     </div>
64 amb 569
65 amb 577 <div class="tab_content" id="tab_visualiser_div">
66 amb 569
67 amb 577 <div class="hideshow_box">
68     <span class="hideshow_title">Routino Data Visualiser</span>
69     This web page allows visualisation of the data that Routino uses for routing.
70 amb 623 Only data relevant for routing is displayed and some will therefore be excluded.
71 amb 577 <div align="center">
72 amb 584 <a target="other" href="http://www.routino.org/">Routino Website</a>
73 amb 577 |
74 amb 1240 <a target="other" href="documentation/">Documentation</a>
75 amb 569 </div>
76 amb 577 </div>
77 amb 569
78 amb 577 <div class="hideshow_box">
79 amb 986 <span id="hideshow_language_show" onclick="hideshow_show('language');" class="hideshow_show">+</span>
80     <span id="hideshow_language_hide" onclick="hideshow_hide('language');" class="hideshow_hide">-</span>
81     <span class="hideshow_title">Language</span>
82    
83     <!-- Note for translations: Only this HTML file needs to be translated, the Javascript has
84     no language specific information in it. Only the body text and title attributes should
85     be changed, the values passed to the JavaScript and the element names must not be changed.
86     The selection below changes the language option passed to the router and selects the
87     output language not the web page language, the links are for that. The router itself uses
88     the translations.xml file for the translated versions of the output. -->
89    
90     <div id="hideshow_language_div" style="display: none;">
91     <table>
92     <tr>
93     <td><a id="lang_en_url" onmouseover="updateURL(this);" onfocus="updateURL(this);" onclick="updateURL(this);" href="visualiser.html.en" title="English language web page">English</a>
94     <td>(EN)
95     </table>
96     </div>
97     </div>
98    
99     <div class="hideshow_box">
100 amb 577 <span class="hideshow_title">Instructions</span>
101     Zoom in and then use the buttons below to download the data. The
102     server will only return data if the selected area is small enough.
103     </div>
104 amb 569
105 amb 577 <div class="hideshow_box">
106     <span class="hideshow_title">Status</span>
107 amb 936 <div id="result_status">
108     <div id="result_status_no_data">
109     <b><i>No data displayed</i></b>
110     </div>
111 amb 1321 <div id="result_status_data" style="display: none;">
112 amb 936 </div>
113 amb 1321 <div id="result_status_failed" style="display: none;">
114 amb 936 <b>Failed to get visualiser data!</b>
115     </div>
116     <div id="result_status_junctions" style="display: none;">
117     <b>Processed # junctions</b>
118     </div>
119     <div id="result_status_super" style="display: none;">
120     <b>Processed # super-nodes/segments</b>
121     </div>
122     <div id="result_status_oneway" style="display: none;">
123     <b>Processed # oneway segments</b>
124     </div>
125 amb 1003 <div id="result_status_highway" style="display: none;">
126     <b>Processed # segments</b>
127     </div>
128 amb 1002 <div id="result_status_transport" style="display: none;">
129     <b>Processed # segments</b>
130     </div>
131 amb 1077 <div id="result_status_barrier" style="display: none;">
132     <b>Processed # nodes</b>
133     </div>
134 amb 936 <div id="result_status_turns" style="display: none;">
135     <b>Processed # turn restrictions</b>
136     </div>
137     <div id="result_status_limit" style="display: none;">
138 amb 1248 <b>Processed # limit changes</b>
139 amb 936 </div>
140 amb 1248 <div id="result_status_property" style="display: none;">
141     <b>Processed # property segments</b>
142     </div>
143 amb 1321 <div id="result_status_errorlogs" style="display: none;">
144     <b>Processed # error logs</b>
145     </div>
146 amb 569 </div>
147 amb 577 </div>
148 amb 569
149 amb 577 <div class="hideshow_box">
150 amb 932 <span id="hideshow_junctions_show" onclick="hideshow_show('junctions');" class="hideshow_show">+</span>
151     <span id="hideshow_junctions_hide" onclick="hideshow_hide('junctions');" class="hideshow_hide">-</span>
152 amb 577 <input type="button" id="junctions" onclick="displayData('junctions');" value="Display Junctions">
153     <div id="hideshow_junctions_div" style="display: none;">
154     Each node that is a dead-end, a junction of two highways of different
155     types (or different properties) or a junction where more than two segments
156     join are shown colour-coded:
157     <br>
158     <table>
159 amb 936 <tr><td><img src="icons/ball-1.png" alt="Red" ><td>only one highway - a dead-end.
160     <tr><td><img src="icons/ball-2.png" alt="Yellow"><td>two highways of different types meet.
161     <tr><td><img src="icons/ball-3.png" alt="Green" ><td>three highways meet.
162     <tr><td><img src="icons/ball-4.png" alt="Brown" ><td>four highways meet.
163     <tr><td><img src="icons/ball-5.png" alt="Blue" ><td>five highways meet.
164     <tr><td><img src="icons/ball-6.png" alt="Pink" ><td>six highways meet.
165     <tr><td><img src="icons/ball-7.png" alt="Black" ><td>seven (or more) highways meet.
166 amb 577 </table>
167 amb 569 </div>
168 amb 577 </div>
169 amb 569
170 amb 577 <div class="hideshow_box">
171 amb 932 <span id="hideshow_super_show" onclick="hideshow_show('super');" class="hideshow_show">+</span>
172     <span id="hideshow_super_hide" onclick="hideshow_hide('super');" class="hideshow_hide">-</span>
173 amb 577 <input type="button" id="super" onclick="displayData('super');" value="Display Super Segments">
174     <div id="hideshow_super_div" style="display: none;">
175 amb 623 Each super-node and the associated super-segments are shown (see
176     algorithm page for description).
177 amb 569 </div>
178 amb 577 </div>
179 amb 569
180 amb 577 <div class="hideshow_box">
181 amb 932 <span id="hideshow_oneway_show" onclick="hideshow_show('oneway');" class="hideshow_show">+</span>
182     <span id="hideshow_oneway_hide" onclick="hideshow_hide('oneway');" class="hideshow_hide">-</span>
183 amb 577 <input type="button" id="oneway" onclick="displayData('oneway');" value="Display One-way Segments">
184     <div id="hideshow_oneway_div" style="display: none;">
185 amb 623 Each one-way segment is shown with a coloured triangle indicating the
186     allowed direction. The colours of the triangles depend on the bearing
187     of the highway segment.
188 amb 569 </div>
189 amb 577 </div>
190 amb 569
191 amb 577 <div class="hideshow_box">
192 amb 1003 <span id="hideshow_highway_show" onclick="hideshow_show('highway');" class="hideshow_show">+</span>
193     <span id="hideshow_highway_hide" onclick="hideshow_hide('highway');" class="hideshow_hide">-</span>
194     <input type="button" id="highway" onclick="displayData('highway');" value="Display Highway Segments">
195     <div id="hideshow_highway_div" style="display: none;">
196     Each segment of the chosen type of highway is drawn.
197 amb 1010 <form name="highways" id="highways" action="" method="get" onsubmit="return false;">
198 amb 1003 <table>
199     <tr><td>Motorway: <td><input name="highway" type="radio" value="motorway" >
200     <tr><td>Trunk: <td><input name="highway" type="radio" value="trunk" >
201     <tr><td>Primary: <td><input name="highway" type="radio" value="primary" checked>
202     <tr><td>Secondary: <td><input name="highway" type="radio" value="secondary" >
203     <tr><td>Tertiary: <td><input name="highway" type="radio" value="tertiary" >
204     <tr><td>Unclassified:<td><input name="highway" type="radio" value="unclassified">
205     <tr><td>Residential: <td><input name="highway" type="radio" value="residential" >
206     <tr><td>Service: <td><input name="highway" type="radio" value="service" >
207     <tr><td>Track: <td><input name="highway" type="radio" value="track" >
208     <tr><td>Cycleway: <td><input name="highway" type="radio" value="cycleway" >
209     <tr><td>Path: <td><input name="highway" type="radio" value="path" >
210     <tr><td>Steps: <td><input name="highway" type="radio" value="steps" >
211     <tr><td>Ferry: <td><input name="highway" type="radio" value="ferry" >
212     </table>
213     </form>
214     </div>
215     </div>
216    
217     <div class="hideshow_box">
218 amb 1002 <span id="hideshow_transport_show" onclick="hideshow_show('transport');" class="hideshow_show">+</span>
219     <span id="hideshow_transport_hide" onclick="hideshow_hide('transport');" class="hideshow_hide">-</span>
220     <input type="button" id="transport" onclick="displayData('transport');" value="Display Transport Segments">
221     <div id="hideshow_transport_div" style="display: none;">
222     Each segment allowed for the chosen type of transport is drawn.
223 amb 1010 <form name="transports" id="transports" action="" method="get" onsubmit="return false;">
224 amb 1002 <table>
225     <tr><td>Foot <td><input name="transport" type="radio" value="foot" >
226     <tr><td>Horse <td><input name="transport" type="radio" value="horse" >
227     <tr><td>Wheelchair<td><input name="transport" type="radio" value="wheelchair">
228     <tr><td>Bicycle <td><input name="transport" type="radio" value="bicycle" >
229     <tr><td>Moped <td><input name="transport" type="radio" value="moped" >
230 amb 1243 <tr><td>Motorcycle<td><input name="transport" type="radio" value="motorcycle">
231 amb 1002 <tr><td>Motorcar <td><input name="transport" type="radio" value="motorcar" checked>
232     <tr><td>Goods <td><input name="transport" type="radio" value="goods" >
233     <tr><td>HGV <td><input name="transport" type="radio" value="hgv" >
234     <tr><td>PSV <td><input name="transport" type="radio" value="psv" >
235     </table>
236     </form>
237     </div>
238     </div>
239    
240     <div class="hideshow_box">
241 amb 1077 <span id="hideshow_barrier_show" onclick="hideshow_show('barrier');" class="hideshow_show">+</span>
242     <span id="hideshow_barrier_hide" onclick="hideshow_hide('barrier');" class="hideshow_hide">-</span>
243     <input type="button" id="barrier" onclick="displayData('barrier');" value="Display Barrier Nodes">
244     <div id="hideshow_barrier_div" style="display: none;">
245     Each barrier blocking the chosen type of transport is drawn.
246     <form name="barriers" id="barriers" action="" method="get" onsubmit="return false;">
247     <table>
248     <tr><td>Foot <td><input name="barrier" type="radio" value="foot" >
249     <tr><td>Horse <td><input name="barrier" type="radio" value="horse" >
250     <tr><td>Wheelchair<td><input name="barrier" type="radio" value="wheelchair">
251     <tr><td>Bicycle <td><input name="barrier" type="radio" value="bicycle" >
252     <tr><td>Moped <td><input name="barrier" type="radio" value="moped" >
253 amb 1243 <tr><td>Motorcycle<td><input name="barrier" type="radio" value="motorcycle">
254 amb 1077 <tr><td>Motorcar <td><input name="barrier" type="radio" value="motorcar" checked>
255     <tr><td>Goods <td><input name="barrier" type="radio" value="goods" >
256     <tr><td>HGV <td><input name="barrier" type="radio" value="hgv" >
257     <tr><td>PSV <td><input name="barrier" type="radio" value="psv" >
258     </table>
259     </form>
260     </div>
261     </div>
262    
263     <div class="hideshow_box">
264 amb 932 <span id="hideshow_turns_show" onclick="hideshow_show('turns');" class="hideshow_show">+</span>
265     <span id="hideshow_turns_hide" onclick="hideshow_hide('turns');" class="hideshow_hide">-</span>
266 amb 623 <input type="button" id="turns" onclick="displayData('turns');" value="Display Turn Restrictions">
267     <div id="hideshow_turns_div" style="display: none;">
268     Each turn restrictions is shown with a line indicating the disallowed
269     turn.
270     </div>
271     </div>
272    
273     <div class="hideshow_box">
274 amb 932 <span id="hideshow_speed_show" onclick="hideshow_show('speed');" class="hideshow_show">+</span>
275     <span id="hideshow_speed_hide" onclick="hideshow_hide('speed');" class="hideshow_hide">-</span>
276 amb 577 <input type="button" id="speed" onclick="displayData('speed');" value="Display Speed Limits">
277     <div id="hideshow_speed_div" style="display: none;">
278     Each node that joins segments with different speed limits is shown
279     along with the speed limit on relevant segments.
280     <br>
281     <table>
282     <tr><td><img src="icons/ball-1.png" alt="Red dot"><td>Change of limit
283     <tr><td><img src="icons/limit-no.png" alt="(no)" ><td>No specified speed limit
284     <tr><td><img src="icons/limit-80.png" alt="(80)" ><td>80 km/hour speed limit
285     </table>
286 amb 569 </div>
287 amb 577 </div>
288 amb 569
289 amb 577 <div class="hideshow_box">
290 amb 932 <span id="hideshow_weight_show" onclick="hideshow_show('weight');" class="hideshow_show">+</span>
291     <span id="hideshow_weight_hide" onclick="hideshow_hide('weight');" class="hideshow_hide">-</span>
292 amb 577 <input type="button" id="weight" onclick="displayData('weight');" value="Display Weight Limits">
293     <div id="hideshow_weight_div" style="display: none;">
294     Each node that joins segments with different weight limits is shown
295     along with the weight limit on relevant segments. For example:
296     <br>
297     <table>
298     <tr><td><img src="icons/ball-1.png" alt="Red dot"><td>Change of limit
299     <tr><td><img src="icons/limit-no.png" alt="(no)" ><td>No specified weight limit
300     <tr><td><img src="icons/limit-8.0.png" alt="(8.0)" ><td>8.0 tonnes weight limit
301     </table>
302 amb 569 </div>
303 amb 577 </div>
304 amb 569
305 amb 577 <div class="hideshow_box">
306 amb 932 <span id="hideshow_height_show" onclick="hideshow_show('height');" class="hideshow_show">+</span>
307     <span id="hideshow_height_hide" onclick="hideshow_hide('height');" class="hideshow_hide">-</span>
308 amb 577 <input type="button" id="height" onclick="displayData('height');" value="Display Height Limits">
309     <div id="hideshow_height_div" style="display: none;">
310     Each node that joins segments with different height limits is shown
311     along with the height limit on relevant segments. For example:
312     <br>
313     <table>
314     <tr><td><img src="icons/ball-1.png" alt="Red dot"><td>Change of limit
315     <tr><td><img src="icons/limit-no.png" alt="(no)" ><td>No specified height limit
316     <tr><td><img src="icons/limit-4.0.png" alt="(4.0)" ><td>4.0 m height limit
317     </table>
318 amb 569 </div>
319 amb 577 </div>
320 amb 569
321 amb 577 <div class="hideshow_box">
322 amb 932 <span id="hideshow_width_show" onclick="hideshow_show('width');" class="hideshow_show">+</span>
323     <span id="hideshow_width_hide" onclick="hideshow_hide('width');" class="hideshow_hide">-</span>
324 amb 577 <input type="button" id="width" onclick="displayData('width');" value="Display Width Limits">
325     <div id="hideshow_width_div" style="display: none;">
326     Each node that joins segments with different width limits is shown
327     along with the width limit on relevant segments. For example:
328     <br>
329     <table>
330     <tr><td><img src="icons/ball-1.png" alt="Red dot"><td>Change of limit
331     <tr><td><img src="icons/limit-no.png" alt="(no)" ><td>No specified width limit
332     <tr><td><img src="icons/limit-3.0.png" alt="(3.0)" ><td>3.0 m width limit
333     </table>
334 amb 569 </div>
335 amb 577 </div>
336 amb 569
337 amb 577 <div class="hideshow_box">
338 amb 932 <span id="hideshow_length_show" onclick="hideshow_show('length');" class="hideshow_show">+</span>
339     <span id="hideshow_length_hide" onclick="hideshow_hide('length');" class="hideshow_hide">-</span>
340 amb 577 <input type="button" id="length" onclick="displayData('length');" value="Display Length Limits">
341     <div id="hideshow_length_div" style="display: none;">
342     Each node that joins segments with different length limits is shown
343     along with the length limit on relevant segments. For example:
344     <br>
345     <table>
346     <tr><td><img src="icons/ball-1.png" alt="Red dot"><td>Change of limit
347     <tr><td><img src="icons/limit-no.png" alt="(no)" ><td>No specified length limit
348     <tr><td><img src="icons/limit-9.0.png" alt="(9.0)" ><td>9.0 m length limit
349     </table>
350 amb 569 </div>
351 amb 577 </div>
352 amb 569
353 amb 577 <div class="hideshow_box">
354 amb 1248 <span id="hideshow_property_show" onclick="hideshow_show('property');" class="hideshow_show">+</span>
355     <span id="hideshow_property_hide" onclick="hideshow_hide('property');" class="hideshow_hide">-</span>
356     <input type="button" id="property" onclick="displayData('property');" value="Display Highway Properties">
357     <div id="hideshow_property_div" style="display: none;">
358     Each segment of the highways with a particular property is drawn.
359     <form name="properties" id="properties" action="" method="get" onsubmit="return false;">
360     <table>
361     <tr><td>Paved: <td><input name="property" type="radio" value="paved" checked>
362     <tr><td>Multiple Lanes:<td><input name="property" type="radio" value="multilane" >
363     <tr><td>Bridge: <td><input name="property" type="radio" value="bridge" >
364     <tr><td>Tunnel: <td><input name="property" type="radio" value="tunnel" >
365     <tr><td>Walking Route: <td><input name="property" type="radio" value="footroute" >
366     <tr><td>Bicycle Route: <td><input name="property" type="radio" value="bicycleroute">
367     </table>
368     </form>
369     </div>
370     </div>
371    
372     <div class="hideshow_box">
373 amb 1321 <span id="hideshow_errorlogs_show" onclick="hideshow_show('errorlogs');" class="hideshow_show">+</span>
374     <span id="hideshow_errorlogs_hide" onclick="hideshow_hide('errorlogs');" class="hideshow_hide">-</span>
375     <input type="button" id="errorlogs" onclick="displayData('errorlogs');" value="Display Error Logs">
376     <div id="hideshow_errorlogs_div" style="display: none;">
377     Potential problems found by Routino when processing the input data.
378     </div>
379     </div>
380    
381     <div class="hideshow_box">
382 amb 577 <input type="button" id="clear" onclick="displayData('');" value="Clear data">
383     </div>
384 amb 569
385 amb 577 <div class="hideshow_box">
386     <span class="hideshow_title">Links</span>
387 amb 986 <a id="permalink_url" onmouseover="updateURL(this);" onfocus="updateURL(this);" onclick="updateURL(this);" href="visualiser.html">Permanent link to this view</a>
388 amb 577 <br>
389 amb 986 <a id="edit_url" onmouseover="updateURL(this);" onfocus="updateURL(this);" onclick="updateURL(this);" href="http://www.openstreetmap.org/" target="edit">Edit OSM data in Potlatch</a>
390 amb 577 </div>
391     </div>
392 amb 569
393 amb 577 <div class="tab_content" id="tab_router_div" style="display: none;">
394     <div class="hideshow_box">
395     <span class="hideshow_title">Router</span>
396     To perform routing on the map use the link below.
397     <br>
398 amb 986 <a id="router_url" onmouseover="updateURL(this);" onfocus="updateURL(this);" onclick="updateURL(this);" href="router.html" target="router">Custom link to this map view</a>
399 amb 577 </div>
400     </div>
401 amb 569
402 amb 577 <div class="tab_content" id="tab_data_div" style="display: none;">
403     <div class="hideshow_box">
404     <span class="hideshow_title">Statistics</span>
405     <div id="statistics_data"></div>
406     <a id="statistics_link" href="statistics.cgi" onclick="displayStatistics();return(false);">Display data statistics</a>
407     </div>
408     </div>
409    
410 amb 569 </div>
411    
412     <!-- Right hand side of window - map -->
413    
414     <div class="right_panel">
415 amb 577 <div class="map" id="map">
416     <noscript>
417     Javascript is <em>required</em> to use this web page because of the
418     interactive map.
419     </noscript>
420     </div>
421     <div class="attribution">
422 amb 1239 Router: <a href="http://www.routino.org/" target="routino">Routino</a>
423 amb 577 |
424 amb 1239 Geo Data: <span id="attribution_data"></span>
425     |
426     Tiles: <span id="attribution_tile"></span>
427 amb 577 </div>
428 amb 569 </div>
429    
430     </BODY>
431 amb 1257
432 amb 569 </HTML>