alfred-data
Nils Schneider 2012-06-15 20:33:47 +02:00
parent 93b60f4a49
commit cbe0d65a7a
2 changed files with 62 additions and 1 deletions

View File

@ -130,3 +130,32 @@
color: #fff;
text-shadow: none;
}
#legend {
position: absolute;
top: 1em;
right: 1.5em;
z-index: 0;
}
#legend ul {
list-style: none;
font-size: 9pt;
color: #888;
}
#legend li {
margin-bottom: 0.5em;
}
#legend li svg {
margin-right: 0.5em;
display: inline;
vertical-align: center;
}
#legend h2 {
margin-top: 0;
font-size: 9pt;
color: #888;
}

View File

@ -21,7 +21,39 @@
<li><a href="geomap.html">Knotenkarte</a></li>
</ul>
</header>
<div id="chart"></div>
<div id="chart">
<div id="legend">
<h2>Legende</h2>
<ul>
<li><svg width=30 height=20 class="node">
<ellipse cx=15 cy=10 ry=8 rx=8 />
</svg>
<label>Knoten</label>
</li>
<li><svg width=30 height=20 class="node">
<ellipse cx=15 cy=10 ry=8 rx=8 class="gateway"/>
</svg>
<label>Gateway</label>
</li>
<li><svg width=30 height=20 class="node">
<ellipse cx=15 cy=10 ry=4 rx=4 class="client"/>
</svg>
<label>Client</label>
</li>
<li><svg width=30 height=20 class="link">
<line x1="2" y1="10" x2="28" y2="10"/>
</svg>
<label>Link</label>
</li>
<li><svg width=30 height=20 class="link vpn">
<line x1="2" y1="10" x2="28" y2="10"/>
</svg>
<label>VPN-Link</label>
</li>
</ul>
</div>
</div>
<script src='force.js' type='text/javascript'></script>
</body>
</html>