← Back to branch summary

~bac/juju-gui/trunkcopy

« back to all changes in this revision

Viewing changes to lib/d3/examples/hello-world/hello-data.html

  • Committer: kapil.foss at gmail
  • Date: 2012-07-13 18:45:59 UTC
  • Revision ID: kapil.foss@gmail.com-20120713184559-2xl7be17egsrz0c9
reshape

Show diffs side-by-side

added added

removed removed

Lines of Context:
lib/d3/examples/hello-world/hello-data.html
1
 
<!DOCTYPE html>
2
 
<html>
3
 
  <head>
4
 
    <title>Hello, data!</title>
5
 
    <script type="text/javascript" src="../../d3.v2.js"></script>
6
 
  </head>
7
 
  <body>
8
 
    Your lucky numbers are:<br>
9
 
    <span></span>
10
 
    <span></span>
11
 
    <span></span>
12
 
    <span></span>
13
 
    <span></span>
14
 
    <script type="text/javascript">
15
 
 
16
 
var data = [4, 8, 15, 16, 23, 42];
17
 
 
18
 
d3.selectAll("span")
19
 
    .data(data)
20
 
  .append("svg")
21
 
    .attr("width", 100)
22
 
    .attr("height", 100)
23
 
  .append("text")
24
 
    .attr("x", "50%")
25
 
    .attr("y", "50%")
26
 
    .attr("dy", ".35em")
27
 
    .attr("text-anchor", "middle")
28
 
    .attr("fill", "white")
29
 
    .attr("stroke", "black")
30
 
    .attr("stroke-width", 1.5)
31
 
    .style("font", "36pt Comic Sans MS")
32
 
    .style("text-shadow", "3px 3px 3px rgba(0,0,0,.4)")
33
 
    .text(function(d) { return d; });
34
 
 
35
 
function refresh() {
36
 
  for (var i = 0; i < data.length; i++) data[i] = (data[i] + 1) % 100;
37
 
  d3.selectAll("text")
38
 
      .data(data)
39
 
      .text(function(d) { return d; });
40
 
}
41
 
 
42
 
window.addEventListener("keypress", refresh, false);
43
 
 
44
 
    </script>
45
 
  </body>
46
 
</html>