Skip to content

Instantly share code, notes, and snippets.

@khailey-zz
Created November 4, 2015 00:27
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save khailey-zz/8a712b8e3b29a4d86431 to your computer and use it in GitHub Desktop.
Save khailey-zz/8a712b8e3b29a4d86431 to your computer and use it in GitHub Desktop.
fresh block
<!DOCTYPE html>
<!--
see http://bost.ocks.org/mike/bar/
-->
<head>
<meta charset="utf-8">
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.5/d3.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<style>
.chart div {
font: 20px sans-serif;
background-color: steelblue;
text-align: right;
padding: 10px;
margin: 10px;
color: white;
}
</style>
</head>
<div id="comments"> </div>
<div id="log">Initial Content</div>
<div class="chart"></div>
<body>
<script type="text/javascript" src="http://mbostock.github.com/d3/d3.js?2.7.0"></script>
<script type="text/javascript">
<!--
var body = d3.select("body");
body.style("color", "black");
body.style("background-color", "white");
d3.select("body")
.style("color", "black")
.style("background-color", "white");
-->
var section = d3.selectAll("body");
var div = section.append("div");
div.html("Hello, world! x");
d3.selectAll("body")
.append("div")
.html("Hello, world! y");
document.getElementById('comments').innerHTML = "text";
$("#log").html($('#log').html() + " <br>New content!");
var data = [4, 8, 15, 16, 23, 42];
var x = d3.scale.linear()
.domain([0, d3.max(data)])
.range([0, 420]);
d3.select(".chart")
.selectAll("div")
.data(data)
.enter().append("div")
.style("width", function(d) { return x(d) + "px"; })
.text(function(d) { return d; });
</script>
</body>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment