www/routino/visualiser.html.en

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<HTML>

<!--
 Routino data visualiser web page.

 Part of the Routino routing software.

 This file Copyright 2008-2011 Andrew M. Bishop

 This program is free software: you can redistribute it and/or modify
 it under the terms of the GNU Affero General Public License as published by
 the Free Software Foundation, either version 3 of the License, or
 (at your option) any later version.

 This program is distributed in the hope that it will be useful,
 but WITHOUT ANY WARRANTY; without even the implied warranty of
 MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 GNU Affero General Public License for more details.

 You should have received a copy of the GNU Affero General Public License
 along with this program.  If not, see http://www.gnu.org/licenses/.
-->

<HEAD>
<TITLE>Routino : Data Visualiser for Routino OpenStreetMap Data</TITLE>
<META name="keywords" content="openstreetmap routino verifier">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<!-- OpenLayers Javascript library -->
<script src="../openlayers/OpenLayers.js" type="text/javascript"></script>

<!-- Page elements -->
<script src="page-elements.js" type="text/javascript"></script>
<link href="page-elements.css" type="text/css" rel="stylesheet">

<!-- Router and visualiser shared features -->
<link href="maplayout.css" type="text/css" rel="stylesheet">
<!--[if IE 6]>
  <link href="maplayout-ie6-bugfixes.css" type="text/css" rel="stylesheet">
<![endif]-->
<!--[if IE 7]>
  <link href="maplayout-ie7-bugfixes.css" type="text/css" rel="stylesheet">
<![endif]-->

<!-- Visualiser specific features -->
<script src="mapprops.js" type="text/javascript"></script>
<script src="visualiser.js" type="text/javascript"></script>
<link href="visualiser.css" type="text/css" rel="stylesheet">

</HEAD>
<BODY onload="map_init('lat','lon','zoom');">

<!-- Left hand side of window - data panel -->

<div class="left_panel">

  <div class="tab_box">
    <span id="tab_visualiser" onclick="tab_select('visualiser');" class="tab_selected"   title="Select data options">Visualiser</span>
    <span id="tab_router"     onclick="tab_select('router');"     class="tab_unselected" title="Plan a route">Router</span>
    <span id="tab_data"       onclick="tab_select('data');"       class="tab_unselected" title="View database information">Data</span>
  </div>

  <div class="tab_content" id="tab_visualiser_div">

    <div class="hideshow_box">
      <span class="hideshow_title">Routino Data Visualiser</span>
      This web page allows visualisation of the data that Routino uses for routing.
      Only data relevant for routing is displayed and some will therefore be excluded.
      <div align="center">
        <a target="other" href="http://www.routino.org/">Routino Website</a>
        |
        <a target="other" href="../documentation/">Documentation</a>
      </div>
    </div>

    <div class="hideshow_box">
      <span class="hideshow_title">Instructions</span>
      Zoom in and then use the buttons below to download the data.  The
      server will only return data if the selected area is small enough.
    </div>

    <div class="hideshow_box">
      <span class="hideshow_title">Status</span>
      <div id="result_status">
        <div id="result_status_no_data">
          <b><i>No data displayed</i></b>
        </div>
        <div id="result_status_data" style="display: none;">
        </div>
        <div id="result_status_error" style="display: none;">
          <b>Failed to get visualiser data!</b>
        </div>
        <div id="result_status_junctions" style="display: none;">
          <b>Processed # junctions</b>
        </div>
        <div id="result_status_super"     style="display: none;">
          <b>Processed # super-nodes/segments</b>
        </div>
        <div id="result_status_oneway"    style="display: none;">
          <b>Processed # oneway segments</b>
        </div>
        <div id="result_status_turns"     style="display: none;">
          <b>Processed # turn restrictions</b>
        </div>
        <div id="result_status_limit"     style="display: none;">
          <b>Processed # limits</b>
        </div>
      </div>
    </div>

    <div class="hideshow_box">
      <span id="hideshow_junctions_show" onclick="hideshow_show('junctions');" class="hideshow_show">+</span>
      <span id="hideshow_junctions_hide" onclick="hideshow_hide('junctions');" class="hideshow_hide">-</span>
      <input type="button" id="junctions" onclick="displayData('junctions');" value="Display Junctions">
      <div id="hideshow_junctions_div" style="display: none;">
        Each node that is a dead-end, a junction of two highways of different
        types (or different properties) or a junction where more than two segments
        join are shown colour-coded:
        <br>
        <table>
          <tr><td><img src="icons/ball-1.png" alt="Red"   ><td>only one highway - a dead-end.
          <tr><td><img src="icons/ball-2.png" alt="Yellow"><td>two highways of different types meet.
          <tr><td><img src="icons/ball-3.png" alt="Green" ><td>three highways meet.
          <tr><td><img src="icons/ball-4.png" alt="Brown" ><td>four highways meet.
          <tr><td><img src="icons/ball-5.png" alt="Blue"  ><td>five highways meet.
          <tr><td><img src="icons/ball-6.png" alt="Pink"  ><td>six highways meet.
          <tr><td><img src="icons/ball-7.png" alt="Black" ><td>seven (or more) highways meet.
        </table>
      </div>
    </div>

    <div class="hideshow_box">
      <span id="hideshow_super_show" onclick="hideshow_show('super');" class="hideshow_show">+</span>
      <span id="hideshow_super_hide" onclick="hideshow_hide('super');" class="hideshow_hide">-</span>
      <input type="button" id="super" onclick="displayData('super');" value="Display Super Segments">
      <div id="hideshow_super_div" style="display: none;">
        Each super-node and the associated super-segments are shown (see
        algorithm page for description).
      </div>
    </div>

    <div class="hideshow_box">
      <span id="hideshow_oneway_show" onclick="hideshow_show('oneway');" class="hideshow_show">+</span>
      <span id="hideshow_oneway_hide" onclick="hideshow_hide('oneway');" class="hideshow_hide">-</span>
      <input type="button" id="oneway" onclick="displayData('oneway');" value="Display One-way Segments">
      <div id="hideshow_oneway_div" style="display: none;">
        Each one-way segment is shown with a coloured triangle indicating the
        allowed direction.  The colours of the triangles depend on the bearing
        of the highway segment.
      </div>
    </div>

    <div class="hideshow_box">
      <span id="hideshow_turns_show" onclick="hideshow_show('turns');" class="hideshow_show">+</span>
      <span id="hideshow_turns_hide" onclick="hideshow_hide('turns');" class="hideshow_hide">-</span>
      <input type="button" id="turns" onclick="displayData('turns');" value="Display Turn Restrictions">
      <div id="hideshow_turns_div" style="display: none;">
        Each turn restrictions is shown with a line indicating the disallowed
        turn.
      </div>
    </div>

    <div class="hideshow_box">
      <span id="hideshow_speed_show" onclick="hideshow_show('speed');" class="hideshow_show">+</span>
      <span id="hideshow_speed_hide" onclick="hideshow_hide('speed');" class="hideshow_hide">-</span>
      <input type="button" id="speed" onclick="displayData('speed');" value="Display Speed Limits">
      <div id="hideshow_speed_div" style="display: none;">
        Each node that joins segments with different speed limits is shown
        along with the speed limit on relevant segments.
        <br>
        <table>
          <tr><td><img src="icons/ball-1.png"   alt="Red dot"><td>Change of limit
          <tr><td><img src="icons/limit-no.png" alt="(no)"   ><td>No specified speed limit
          <tr><td><img src="icons/limit-80.png" alt="(80)"   ><td>80 km/hour speed limit
        </table>
      </div>
    </div>

    <div class="hideshow_box">
      <span id="hideshow_weight_show" onclick="hideshow_show('weight');" class="hideshow_show">+</span>
      <span id="hideshow_weight_hide" onclick="hideshow_hide('weight');" class="hideshow_hide">-</span>
      <input type="button" id="weight" onclick="displayData('weight');" value="Display Weight Limits">
      <div id="hideshow_weight_div" style="display: none;">
        Each node that joins segments with different weight limits is shown
        along with the weight limit on relevant segments.  For example:
        <br>
        <table>
          <tr><td><img src="icons/ball-1.png"    alt="Red dot"><td>Change of limit
          <tr><td><img src="icons/limit-no.png"  alt="(no)"   ><td>No specified weight limit
          <tr><td><img src="icons/limit-8.0.png" alt="(8.0)"  ><td>8.0 tonnes weight limit
        </table>
      </div>
    </div>

    <div class="hideshow_box">
      <span id="hideshow_height_show" onclick="hideshow_show('height');" class="hideshow_show">+</span>
      <span id="hideshow_height_hide" onclick="hideshow_hide('height');" class="hideshow_hide">-</span>
      <input type="button" id="height" onclick="displayData('height');" value="Display Height Limits">
      <div id="hideshow_height_div" style="display: none;">
        Each node that joins segments with different height limits is shown
        along with the height limit on relevant segments.  For example:
        <br>
        <table>
          <tr><td><img src="icons/ball-1.png"    alt="Red dot"><td>Change of limit
          <tr><td><img src="icons/limit-no.png"  alt="(no)"   ><td>No specified height limit
          <tr><td><img src="icons/limit-4.0.png" alt="(4.0)"  ><td>4.0 m height limit
        </table>
      </div>
    </div>

    <div class="hideshow_box">
      <span id="hideshow_width_show" onclick="hideshow_show('width');" class="hideshow_show">+</span>
      <span id="hideshow_width_hide" onclick="hideshow_hide('width');" class="hideshow_hide">-</span>
      <input type="button" id="width" onclick="displayData('width');" value="Display Width Limits">
      <div id="hideshow_width_div" style="display: none;">
        Each node that joins segments with different width limits is shown
        along with the width limit on relevant segments.  For example:
        <br>
        <table>
          <tr><td><img src="icons/ball-1.png"    alt="Red dot"><td>Change of limit
          <tr><td><img src="icons/limit-no.png"  alt="(no)"   ><td>No specified width limit
          <tr><td><img src="icons/limit-3.0.png" alt="(3.0)"  ><td>3.0 m width limit
        </table>
      </div>
    </div>

    <div class="hideshow_box">
      <span id="hideshow_length_show" onclick="hideshow_show('length');" class="hideshow_show">+</span>
      <span id="hideshow_length_hide" onclick="hideshow_hide('length');" class="hideshow_hide">-</span>
      <input type="button" id="length" onclick="displayData('length');" value="Display Length Limits">
      <div id="hideshow_length_div" style="display: none;">
        Each node that joins segments with different length limits is shown
        along with the length limit on relevant segments.  For example:
        <br>
        <table>
          <tr><td><img src="icons/ball-1.png"    alt="Red dot"><td>Change of limit
          <tr><td><img src="icons/limit-no.png"  alt="(no)"   ><td>No specified length limit
          <tr><td><img src="icons/limit-9.0.png" alt="(9.0)"  ><td>9.0 m length limit
        </table>
      </div>
    </div>

    <div class="hideshow_box">
      <input type="button" id="clear" onclick="displayData('');" value="Clear data">
    </div>

    <div class="hideshow_box">
      <span class="hideshow_title">Links</span>
      <a id="link_url"                href="visualiser.html">Permanent link to this view</a>
      <br>
      <a id="edit_url" target="other" href="http://www.openstreetmap.org/">Edit OSM data in Potlatch</a>
    </div>
  </div>

  <div class="tab_content" id="tab_router_div" style="display: none;">
    <div class="hideshow_box">
      <span class="hideshow_title">Router</span>
      To perform routing on the map use the link below.
      <br>
      <a id="router_url" target="other" href="router.html">Custom link to this map view</a>
    </div>
  </div>

  <div class="tab_content" id="tab_data_div" style="display: none;">
    <div class="hideshow_box">
      <span class="hideshow_title">Statistics</span>
      <div id="statistics_data"></div>
      <a id="statistics_link" href="statistics.cgi" onclick="displayStatistics();return(false);">Display data statistics</a>
    </div>
  </div>

</div>

<!-- Right hand side of window - map -->

<div class="right_panel">
  <div class="map" id="map">
    <noscript>
      Javascript is <em>required</em> to use this web page because of the
      interactive map.
    </noscript>
  </div>
  <div class="attribution">
    <a target="other" href="http://www.routino.org/" title="Routino">Data Manipulation: Routino</a>
    |
    <a target="other" href="http://www.openstreetmap.org/" title="Copyright: OpenStreetMap.org; License: Creative Commons Attribution-Share Alike 2.0">Geo Data: OpenStreetMap</a>
  </div>
</div>

</BODY>
</HTML>
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			<!--
5			Routino data visualiser web page.
6
7			Part of the Routino routing software.
8
9	amb	623	This file Copyright 2008-2011 Andrew M. Bishop
10	amb	569
11			This program is free software: you can redistribute it and/or modify
12			it under the terms of the GNU Affero General Public License as published by
13			the Free Software Foundation, either version 3 of the License, or
14			(at your option) any later version.
15
16			This program is distributed in the hope that it will be useful,
17			but WITHOUT ANY WARRANTY; without even the implied warranty of
18			MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
19			GNU Affero General Public License for more details.
20
21			You should have received a copy of the GNU Affero General Public License
22			along with this program. If not, see http://www.gnu.org/licenses/.
23			-->
24
25			<HEAD>
26	amb	584	<TITLE>Routino : Data Visualiser for Routino OpenStreetMap Data</TITLE>
27	amb	569	<META name="keywords" content="openstreetmap routino verifier">
28			<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
29
30			<!-- OpenLayers Javascript library -->
31			<script src="../openlayers/OpenLayers.js" type="text/javascript"></script>
32
33			<!-- Page elements -->
34			<script src="page-elements.js" type="text/javascript"></script>
35			<link href="page-elements.css" type="text/css" rel="stylesheet">
36
37	amb	577	<!-- Router and visualiser shared features -->
38			<link href="maplayout.css" type="text/css" rel="stylesheet">
39			<!--[if IE 6]>
40			<link href="maplayout-ie6-bugfixes.css" type="text/css" rel="stylesheet">
41			<![endif]-->
42			<!--[if IE 7]>
43			<link href="maplayout-ie7-bugfixes.css" type="text/css" rel="stylesheet">
44			<![endif]-->
45
46	amb	569	<!-- Visualiser specific features -->
47	amb	933	<script src="mapprops.js" type="text/javascript"></script>
48	amb	569	<script src="visualiser.js" type="text/javascript"></script>
49			<link href="visualiser.css" type="text/css" rel="stylesheet">
50
51			</HEAD>
52			<BODY onload="map_init('lat','lon','zoom');">
53
54			<!-- Left hand side of window - data panel -->
55
56			<div class="left_panel">
57
58	amb	577	<div class="tab_box">
59			<span id="tab_visualiser" onclick="tab_select('visualiser');" class="tab_selected" title="Select data options">Visualiser</span>
60			<span id="tab_router" onclick="tab_select('router');" class="tab_unselected" title="Plan a route">Router</span>
61			<span id="tab_data" onclick="tab_select('data');" class="tab_unselected" title="View database information">Data</span>
62			</div>
63	amb	569
64	amb	577	<div class="tab_content" id="tab_visualiser_div">
65	amb	569
66	amb	577	<div class="hideshow_box">
67			<span class="hideshow_title">Routino Data Visualiser</span>
68			This web page allows visualisation of the data that Routino uses for routing.
69	amb	623	Only data relevant for routing is displayed and some will therefore be excluded.
70	amb	577	<div align="center">
71	amb	584	<a target="other" href="http://www.routino.org/">Routino Website</a>
72	amb	577	\|
73	amb	584	<a target="other" href="../documentation/">Documentation</a>
74	amb	569	</div>
75	amb	577	</div>
76	amb	569
77	amb	577	<div class="hideshow_box">
78			<span class="hideshow_title">Instructions</span>
79			Zoom in and then use the buttons below to download the data. The
80			server will only return data if the selected area is small enough.
81			</div>
82	amb	569
83	amb	577	<div class="hideshow_box">
84			<span class="hideshow_title">Status</span>
85	amb	936	<div id="result_status">
86			<div id="result_status_no_data">
87			<b><i>No data displayed</i></b>
88			</div>
89			<div id="result_status_data" style="display: none;">
90			</div>
91			<div id="result_status_error" style="display: none;">
92			<b>Failed to get visualiser data!</b>
93			</div>
94			<div id="result_status_junctions" style="display: none;">
95			<b>Processed # junctions</b>
96			</div>
97			<div id="result_status_super" style="display: none;">
98			<b>Processed # super-nodes/segments</b>
99			</div>
100			<div id="result_status_oneway" style="display: none;">
101			<b>Processed # oneway segments</b>
102			</div>
103			<div id="result_status_turns" style="display: none;">
104			<b>Processed # turn restrictions</b>
105			</div>
106			<div id="result_status_limit" style="display: none;">
107			<b>Processed # limits</b>
108			</div>
109	amb	569	</div>
110	amb	577	</div>
111	amb	569
112	amb	577	<div class="hideshow_box">
113	amb	932	<span id="hideshow_junctions_show" onclick="hideshow_show('junctions');" class="hideshow_show">+</span>
114			<span id="hideshow_junctions_hide" onclick="hideshow_hide('junctions');" class="hideshow_hide">-</span>
115	amb	577	<input type="button" id="junctions" onclick="displayData('junctions');" value="Display Junctions">
116			<div id="hideshow_junctions_div" style="display: none;">
117			Each node that is a dead-end, a junction of two highways of different
118			types (or different properties) or a junction where more than two segments
119			join are shown colour-coded:
120			<br>
121			<table>
122	amb	936	<tr><td><img src="icons/ball-1.png" alt="Red" ><td>only one highway - a dead-end.
123			<tr><td><img src="icons/ball-2.png" alt="Yellow"><td>two highways of different types meet.
124			<tr><td><img src="icons/ball-3.png" alt="Green" ><td>three highways meet.
125			<tr><td><img src="icons/ball-4.png" alt="Brown" ><td>four highways meet.
126			<tr><td><img src="icons/ball-5.png" alt="Blue" ><td>five highways meet.
127			<tr><td><img src="icons/ball-6.png" alt="Pink" ><td>six highways meet.
128			<tr><td><img src="icons/ball-7.png" alt="Black" ><td>seven (or more) highways meet.
129	amb	577	</table>
130	amb	569	</div>
131	amb	577	</div>
132	amb	569
133	amb	577	<div class="hideshow_box">
134	amb	932	<span id="hideshow_super_show" onclick="hideshow_show('super');" class="hideshow_show">+</span>
135			<span id="hideshow_super_hide" onclick="hideshow_hide('super');" class="hideshow_hide">-</span>
136	amb	577	<input type="button" id="super" onclick="displayData('super');" value="Display Super Segments">
137			<div id="hideshow_super_div" style="display: none;">
138	amb	623	Each super-node and the associated super-segments are shown (see
139			algorithm page for description).
140	amb	569	</div>
141	amb	577	</div>
142	amb	569
143	amb	577	<div class="hideshow_box">
144	amb	932	<span id="hideshow_oneway_show" onclick="hideshow_show('oneway');" class="hideshow_show">+</span>
145			<span id="hideshow_oneway_hide" onclick="hideshow_hide('oneway');" class="hideshow_hide">-</span>
146	amb	577	<input type="button" id="oneway" onclick="displayData('oneway');" value="Display One-way Segments">
147			<div id="hideshow_oneway_div" style="display: none;">
148	amb	623	Each one-way segment is shown with a coloured triangle indicating the
149			allowed direction. The colours of the triangles depend on the bearing
150			of the highway segment.
151	amb	569	</div>
152	amb	577	</div>
153	amb	569
154	amb	577	<div class="hideshow_box">
155	amb	932	<span id="hideshow_turns_show" onclick="hideshow_show('turns');" class="hideshow_show">+</span>
156			<span id="hideshow_turns_hide" onclick="hideshow_hide('turns');" class="hideshow_hide">-</span>
157	amb	623	<input type="button" id="turns" onclick="displayData('turns');" value="Display Turn Restrictions">
158			<div id="hideshow_turns_div" style="display: none;">
159			Each turn restrictions is shown with a line indicating the disallowed
160			turn.
161			</div>
162			</div>
163
164			<div class="hideshow_box">
165	amb	932	<span id="hideshow_speed_show" onclick="hideshow_show('speed');" class="hideshow_show">+</span>
166			<span id="hideshow_speed_hide" onclick="hideshow_hide('speed');" class="hideshow_hide">-</span>
167	amb	577	<input type="button" id="speed" onclick="displayData('speed');" value="Display Speed Limits">
168			<div id="hideshow_speed_div" style="display: none;">
169			Each node that joins segments with different speed limits is shown
170			along with the speed limit on relevant segments.
171			<br>
172			<table>
173			<tr><td><img src="icons/ball-1.png" alt="Red dot"><td>Change of limit
174			<tr><td><img src="icons/limit-no.png" alt="(no)" ><td>No specified speed limit
175			<tr><td><img src="icons/limit-80.png" alt="(80)" ><td>80 km/hour speed limit
176			</table>
177	amb	569	</div>
178	amb	577	</div>
179	amb	569
180	amb	577	<div class="hideshow_box">
181	amb	932	<span id="hideshow_weight_show" onclick="hideshow_show('weight');" class="hideshow_show">+</span>
182			<span id="hideshow_weight_hide" onclick="hideshow_hide('weight');" class="hideshow_hide">-</span>
183	amb	577	<input type="button" id="weight" onclick="displayData('weight');" value="Display Weight Limits">
184			<div id="hideshow_weight_div" style="display: none;">
185			Each node that joins segments with different weight limits is shown
186			along with the weight limit on relevant segments. For example:
187			<br>
188			<table>
189			<tr><td><img src="icons/ball-1.png" alt="Red dot"><td>Change of limit
190			<tr><td><img src="icons/limit-no.png" alt="(no)" ><td>No specified weight limit
191			<tr><td><img src="icons/limit-8.0.png" alt="(8.0)" ><td>8.0 tonnes weight limit
192			</table>
193	amb	569	</div>
194	amb	577	</div>
195	amb	569
196	amb	577	<div class="hideshow_box">
197	amb	932	<span id="hideshow_height_show" onclick="hideshow_show('height');" class="hideshow_show">+</span>
198			<span id="hideshow_height_hide" onclick="hideshow_hide('height');" class="hideshow_hide">-</span>
199	amb	577	<input type="button" id="height" onclick="displayData('height');" value="Display Height Limits">
200			<div id="hideshow_height_div" style="display: none;">
201			Each node that joins segments with different height limits is shown
202			along with the height limit on relevant segments. For example:
203			<br>
204			<table>
205			<tr><td><img src="icons/ball-1.png" alt="Red dot"><td>Change of limit
206			<tr><td><img src="icons/limit-no.png" alt="(no)" ><td>No specified height limit
207			<tr><td><img src="icons/limit-4.0.png" alt="(4.0)" ><td>4.0 m height limit
208			</table>
209	amb	569	</div>
210	amb	577	</div>
211	amb	569
212	amb	577	<div class="hideshow_box">
213	amb	932	<span id="hideshow_width_show" onclick="hideshow_show('width');" class="hideshow_show">+</span>
214			<span id="hideshow_width_hide" onclick="hideshow_hide('width');" class="hideshow_hide">-</span>
215	amb	577	<input type="button" id="width" onclick="displayData('width');" value="Display Width Limits">
216			<div id="hideshow_width_div" style="display: none;">
217			Each node that joins segments with different width limits is shown
218			along with the width limit on relevant segments. For example:
219			<br>
220			<table>
221			<tr><td><img src="icons/ball-1.png" alt="Red dot"><td>Change of limit
222			<tr><td><img src="icons/limit-no.png" alt="(no)" ><td>No specified width limit
223			<tr><td><img src="icons/limit-3.0.png" alt="(3.0)" ><td>3.0 m width limit
224			</table>
225	amb	569	</div>
226	amb	577	</div>
227	amb	569
228	amb	577	<div class="hideshow_box">
229	amb	932	<span id="hideshow_length_show" onclick="hideshow_show('length');" class="hideshow_show">+</span>
230			<span id="hideshow_length_hide" onclick="hideshow_hide('length');" class="hideshow_hide">-</span>
231	amb	577	<input type="button" id="length" onclick="displayData('length');" value="Display Length Limits">
232			<div id="hideshow_length_div" style="display: none;">
233			Each node that joins segments with different length limits is shown
234			along with the length limit on relevant segments. For example:
235			<br>
236			<table>
237			<tr><td><img src="icons/ball-1.png" alt="Red dot"><td>Change of limit
238			<tr><td><img src="icons/limit-no.png" alt="(no)" ><td>No specified length limit
239			<tr><td><img src="icons/limit-9.0.png" alt="(9.0)" ><td>9.0 m length limit
240			</table>
241	amb	569	</div>
242	amb	577	</div>
243	amb	569
244	amb	577	<div class="hideshow_box">
245			<input type="button" id="clear" onclick="displayData('');" value="Clear data">
246			</div>
247	amb	569
248	amb	577	<div class="hideshow_box">
249			<span class="hideshow_title">Links</span>
250			<a id="link_url" href="visualiser.html">Permanent link to this view</a>
251			<br>
252			<a id="edit_url" target="other" href="http://www.openstreetmap.org/">Edit OSM data in Potlatch</a>
253			</div>
254			</div>
255	amb	569
256	amb	577	<div class="tab_content" id="tab_router_div" style="display: none;">
257			<div class="hideshow_box">
258			<span class="hideshow_title">Router</span>
259			To perform routing on the map use the link below.
260			<br>
261			<a id="router_url" target="other" href="router.html">Custom link to this map view</a>
262			</div>
263			</div>
264	amb	569
265	amb	577	<div class="tab_content" id="tab_data_div" style="display: none;">
266			<div class="hideshow_box">
267			<span class="hideshow_title">Statistics</span>
268			<div id="statistics_data"></div>
269			<a id="statistics_link" href="statistics.cgi" onclick="displayStatistics();return(false);">Display data statistics</a>
270			</div>
271			</div>
272
273	amb	569	</div>
274
275			<!-- Right hand side of window - map -->
276
277			<div class="right_panel">
278	amb	577	<div class="map" id="map">
279			<noscript>
280			Javascript is <em>required</em> to use this web page because of the
281			interactive map.
282			</noscript>
283			</div>
284			<div class="attribution">
285	amb	584	<a target="other" href="http://www.routino.org/" title="Routino">Data Manipulation: Routino</a>
286	amb	577	\|
287			<a target="other" href="http://www.openstreetmap.org/" title="Copyright: OpenStreetMap.org; License: Creative Commons Attribution-Share Alike 2.0">Geo Data: OpenStreetMap</a>
288			</div>
289	amb	569	</div>
290
291			</BODY>
292			</HTML>