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
|
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Charting combinations</title>
<link rel="stylesheet" type="text/css" href="../dist/dygraph.css" />
<link rel="stylesheet" type="text/css" href="../common/vextlnk.css" />
<script type="text/javascript" src="../dist/dygraph.js"></script>
<script type="text/javascript" src="data.js"></script>
<style type="text/css">
.chart {
width: 600px;
height: 300px;
}
#container {
display: table;
float: left;
}
#results {
display: table;
float: left;
padding-left: 20px;
}
</style>
</head>
<body>
<p>There are four options which fundamentally change the behaviour of the standard plotter:</p>
<ol>
<li>errorBars / customBars</li>
<li>stepPlot</li>
<li>fillGraph</li>
<li>strokePattern</li>
</ol>
<p>This page exhaustively checks all combinations of these parameters.</p>
<div id="container"> </div>
<div id="results"> <b>Valid combinations</b>
<ol id='results-ol'>
</ol>
</div>
<script type="text/javascript"><!--//--><![CDATA[//><!--
Dygraph.onDOMready(function onDOMready() {
// NOTE: this is an odd thing to do; dygraphs should really throw here.
console.warn = function(x) {
throw new Error(x);
}
var bools = [false, true];
var containerDiv = document.getElementById("container");
var resultsList = document.getElementById("results-ol");
bools.forEach(function(errorBars) {
var data_csv = errorBars ? NoisyData() : data();
bools.forEach(function(stepPlot) {
bools.forEach(function(fillGraph) {
bools.forEach(function(strokePattern) {
var title_parts = [];
if (errorBars) title_parts.push('errorBars');
if (stepPlot) title_parts.push('stepPlot');
if (fillGraph) title_parts.push('fillGraph');
if (strokePattern) title_parts.push('strokePattern');
var title = title_parts.join(', ');
if (!title) title = '(none)';
var title_h2 = document.createElement('h2');
title_h2.innerHTML = title;
containerDiv.appendChild(title_h2);
var div = document.createElement('div');
div.className = 'chart';
containerDiv.appendChild(div);
try {
var g = new Dygraph(div, data_csv, {
errorBars: errorBars,
stepPlot: stepPlot,
fillGraph: fillGraph,
strokePattern: strokePattern ? Dygraph.DASHED_LINE : null
});
resultsList.innerHTML += '<li> ' + title + '</li>';
} catch(e) {
div.className = '';
div.innerHTML = e;
}
});
});
});
});
});
//--><!]]></script>
</body>
</html>
|
