Built with blockbuilder.org
forked from khailey's block: fresh block
Built with blockbuilder.org
forked from khailey's block: 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> |