← Back to branch summary

~smagoun/whoopsie/whoopsie-lp1017637

« back to all changes in this revision

Viewing changes to backend/stats/static/js/nvd3/examples/lineChart.html

  • Committer: Evan Dandrea
  • Date: 2012-05-09 05:53:45 UTC
  • Revision ID: evan.dandrea@canonical.com-20120509055345-z2j41tmcbf4as5uf
The backend now lives in lp:daisy and the website (errors.ubuntu.com) now lives in lp:errors.

Show diffs side-by-side

added added

removed removed

Lines of Context:
backend/stats/static/js/nvd3/examples/lineChart.html
1
 
<!DOCTYPE html>
2
 
<meta charset="utf-8">
3
 
 
4
 
<link href="../src/d3.css" rel="stylesheet" type="text/css">
5
 
 
6
 
<style>
7
 
 
8
 
body {
9
 
  overflow-y:scroll;
10
 
}
11
 
 
12
 
text {
13
 
  font: 12px sans-serif;
14
 
}
15
 
 
16
 
#chart1 {
17
 
  height: 500px;
18
 
  margin: 10px;
19
 
  min-width: 100px;
20
 
  min-height: 100px;
21
 
/*
22
 
  Minimum height and width is a good idea to prevent negative SVG dimensions...
23
 
  For example width should be =< margin.left + margin.right + 1,
24
 
  of course 1 pixel for the entire chart would not be very useful, BUT should not have errors
25
 
*/
26
 
}
27
 
 
28
 
</style>
29
 
<body>
30
 
 
31
 
  <div id="chart1">
32
 
  </div>
33
 
 
34
 
<script src="../lib/d3.v2.js"></script>
35
 
<script src="../lib/jquery.min.js"></script>
36
 
<script src="../nv.d3.js"></script>
37
 
<!-- including all the components so I don't have to minify every time I test in development -->
38
 
<script src="../src/nvtooltip.js"></script>
39
 
<script src="../src/models/legend.js"></script>
40
 
<script src="../src/models/xaxis.js"></script>
41
 
<script src="../src/models/yaxis.js"></script>
42
 
<script src="../src/models/line.js"></script>
43
 
<script src="../src/models/lineWithLegend.js"></script>
44
 
<script src="../src/charts/lineChart.js"></script>
45
 
<script>
46
 
 
47
 
 
48
 
 
49
 
nv.charts.line()
50
 
    .selector('#chart1')
51
 
    .data(sinAndCos())
52
 
    .y(function(d) { return d.voltage })
53
 
    .yAxisLabel('Voltage (v)')
54
 
    .build();
55
 
 
56
 
 
57
 
 
58
 
 
59
 
function sinAndCos() {
60
 
  var sin = [],
61
 
      cos = [],
62
 
      r1 = Math.random(),
63
 
      r2 = Math.random();
64
 
 
65
 
  for (var i = 0; i < 100; i++) {
66
 
    sin.push({x: i, voltage: r2 * Math.sin(i/10)});
67
 
    cos.push({x: i, voltage: r1 * Math.cos(i/10)});
68
 
  }
69
 
 
70
 
  return [
71
 
    {
72
 
      values: sin,
73
 
      key: "Sine Wave",
74
 
      color: "#ff7f0e"
75
 
    },
76
 
    {
77
 
      values: cos,
78
 
      key: "Cosine Wave",
79
 
      color: "#2ca02c"
80
 
    }
81
 
  ];
82
 
}
83
 
 
84
 
 
85
 
</script>