Mercurial Mercurial > periplus / file revision
summary | shortlog | changelog | graph | tags | bookmarks | branches | files | changeset | file | latest | revisions | annotate | diff | comparison | raw | help
Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
toolkit/javascript/d3/examples/hello-world/hello-transform.html
author Nicolas Sauret <nicolas.sauret@iri.centrepompidou.fr>
Fri, 18 Apr 2014 14:31:58 +0200
changeset 51 79833eaa394a
parent 47 c0b4a8b5a012
permissions -rw-r--r--
set up second level for navigation

<!DOCTYPE html>
<html>
  <head>
    <title>Hello, world!</title>
    <script type="text/javascript" src="../../d3.js"></script>
  </head>
  <body>
    Your lucky numbers are:<br>
    <span></span>
    <span></span>
    <span></span>
    <span></span>
    <span></span>
    <script type="text/javascript">

d3.selectAll("span")
  .append("svg:svg")
    .attr("width", 100)
    .attr("height", 100)
  .append("svg:text")
    .attr("x", "50%")
    .attr("y", "50%")
    .attr("dy", ".35em")
    .attr("text-anchor", "middle")
    .attr("fill", "white")
    .attr("stroke", "black")
    .attr("stroke-width", 1.5)
    .style("font", "36pt Comic Sans MS")
    .style("text-shadow", "3px 3px 3px rgba(0,0,0,.4)")
    .text(function() { return ~~(Math.random() * 100); });

function transform() {
  d3.selectAll("text")
      .text(function() { return ~~(Math.random() * 100); });
}

window.addEventListener("keypress", transform, false);

    </script>
  </body>
</html>
periplus