forked from predictionmachines/InteractiveDataDisplay
-
Notifications
You must be signed in to change notification settings - Fork 0
/
IDDSamples.html
136 lines (123 loc) · 7.42 KB
/
IDDSamples.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=10; IE=Edge" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>InteractiveDataDisplay Samples Gallery</title>
<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
<script type="application/javascript">
function onHoverA(target, ifr) {
var t = $(target);
if (t.hasClass("selected"))
return;
$(".selected").removeClass("selected");
t.addClass("selected");
document.getElementById("sampleHost").src = ifr;
$("#currenSample").text(t.text());
}
function pageLoad() {
document.getElementById("sampleHost").src = 'samples/Axes and navigation.html';
$("#currenSample").text('Axes and Navigation');
$("#axesNnav").addClass("selected");
}
</script>
<style type="text/css">
body
{
font-family: 'Segoe UI';
margin: 0px;
-moz-user-select: -moz-none;
-khtml-user-select: none;
-webkit-user-select: none;
-o-user-select: none;
-ms-user-select: none;
user-select: none;
}
.href
{
color: rgb(200, 200, 200);
cursor: pointer;
margin-left: 1em;
}
.href:hover
{
color: white;
}
.selected
{
color: white;
}
.category
{
color: white;
font-size: larger;
margin-top: 0.5em;
margin-bottom: 0.2em;
}
.menu
{
background-color: #365C95;
width: 320px;
padding: 10px;
}
.title
{
color: white;
font-size: xx-large;
margin-bottom: 0.5em;
font-family: 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', 'DejaVu Sans Condensed', sans-serif;
}
</style>
</head>
<body onload="pageLoad()">
<div class="menu">
<div class="category" style="margin-top: 0px;">Basic Plot Samples</div>
<div id="axesNnav" class="href" onclick="onHoverA(arguments[0].currentTarget, 'samples/Axes and navigation.html')">Axes and Navigation</div>
<div class="href" onclick="onHoverA(arguments[0].currentTarget, 'samples/Navigation Panel.html')">Navigation Panel</div>
<div class="href" onclick="onHoverA(arguments[0].currentTarget, 'samples/Titles.html')">Titles</div>
<div class="href" onclick="onHoverA(arguments[0].currentTarget, 'samples/Custom plot.html')">Custom Plot</div>
<div class="href" onclick="onHoverA(arguments[0].currentTarget, 'samples/Add and Remove plots using API.html')">Add/Remove Plot</div>
<div class="href" onclick="onHoverA(arguments[0].currentTarget, 'samples/AutoFitSample.html')">AutoFit modes and FitToView</div>
<div class="href" onclick="onHoverA(arguments[0].currentTarget, 'samples/Nested charts.html')">Nested Charts</div>
<div class="href" onclick="onHoverA(arguments[0].currentTarget, 'samples/DOM elements in a plot.html')">DOM elements in a Plot</div>
<div class="href" onclick="onHoverA(arguments[0].currentTarget, 'samples/NestedChartAsDOMPlot.html')">Nested chart as DOM Plot</div>
<div class="category">Polyline Plot Samples</div>
<div class="href" onclick="onHoverA(arguments[0].currentTarget, 'samples/Draw a polyline in HTML.html')">Simple Polyline</div>
<div class="href" onclick="onHoverA(arguments[0].currentTarget, 'samples/Dynamic polyline.html')">Dynamic Polyline</div>
<div class="href" onclick="onHoverA(arguments[0].currentTarget, 'samples/DynamicArea.html')">Dynamic Area</div>
<div class="category">Markers Plot Samples</div>
<div class="href" onclick="onHoverA(arguments[0].currentTarget, 'samples/Markers.html')">Simple Markers</div>
<div class="href" onclick="onHoverA(arguments[0].currentTarget, 'samples/Dynamic Markers.html')">Dynamic Markers</div>
<div class="href" onclick="onHoverA(arguments[0].currentTarget, 'samples/Markers with custom series.html')">Markers with custom Color and Size series</div>
<div class="href" onclick="onHoverA(arguments[0].currentTarget, 'samples/Bar chart.html')">Bar Chart</div>
<div class="href" onclick="onHoverA(arguments[0].currentTarget, 'samples/Error bars.html')">Error Bars</div>
<div class="href" onclick="onHoverA(arguments[0].currentTarget, 'samples/Markers with size uncertain data.html')">Show uncertain values using petals</div>
<div class="href" onclick="onHoverA(arguments[0].currentTarget, 'samples/Markers with color uncertain data.html')">Show uncertain values using bull-eyes</div>
<div class="href" onclick="onHoverA(arguments[0].currentTarget, 'samples/Boxplot sample.html')">Boxplot</div>
<div class="category">Heatmap Plot Samples</div>
<div class="href" onclick="onHoverA(arguments[0].currentTarget, 'samples/Heatmap.html')">Simple Heatmap Plot</div>
<div class="href" onclick="onHoverA(arguments[0].currentTarget, 'samples/Dynamic Matrix Heatmap.html')">Dynamic Matrix Heatmap</div>
<div class="href" onclick="onHoverA(arguments[0].currentTarget, 'samples/Dynamic Gradient Heatmap.html')">Dynamic Gradient Heatmap</div>
<div class="category">Bing Map Samples</div>
<div class="href" onclick="onHoverA(arguments[0].currentTarget, 'samples/StandaloneBingMaps.html')">Bing Maps Plot</div>
<div class="href" onclick="onHoverA(arguments[0].currentTarget, 'samples/Custom map layers.html')">Custom Map Layers</div>
<div class="href" onclick="onHoverA(arguments[0].currentTarget, 'samples/Markers on a map.html')">Markers on a map</div>
<div class="href" onclick="onHoverA(arguments[0].currentTarget, 'samples/BingMapsHeatmapSample.html')">Heatmap on a map</div>
<div class="category">Misc Samples</div>
<div class="href" onclick="onHoverA(arguments[0].currentTarget, 'samples/LabelledAxisSample.html')">Labels on Axis</div>
<div class="href" onclick="onHoverA(arguments[0].currentTarget, 'samples/DepthGraphSample.html')">Inverted Vertical Axis</div>
<div class="href" onclick="onHoverA(arguments[0].currentTarget, 'samples/Logarithmic transform.html')">Logarithmic transform</div>
<div class="href" onclick="onHoverA(arguments[0].currentTarget, 'samples/Color palettes.html')">Color Palettes</div>
<div class="href" onclick="onHoverA(arguments[0].currentTarget, 'samples/LegendSample.html')">Legend Samples</div>
<div class="href" onclick="onHoverA(arguments[0].currentTarget, 'samples/Bound plots.html')">Bound Plots</div>
<div class="href" onclick="onHoverA(arguments[0].currentTarget, 'samples/Data series titles.html')">Data series names</div>
<div class="href" onclick="window.open('samples/ResponsiveLayout.html')">Responsive layout (new window)</div>
<div class="href" onclick="window.open('samples/ResponsiveTabs.html')">Responsive tabs (new window)</div>
</div>
<div style="position: absolute; left: 350px; top: 0px; width: 70%">
<p id="currenSample" style="left: 50px">No Sample Selected</p>
<iframe id="sampleHost" width="100%" height="768" frameborder="0">No proper iframe support
</iframe>
</div>
</body>
</html>