Skip to content

Instantly share code, notes, and snippets.

@caev03
Last active December 12, 2016 15:00
Show Gist options
  • Save caev03/5f19014877069fcee7275fcbe7561da1 to your computer and use it in GitHub Desktop.
Save caev03/5f19014877069fcee7275fcbe7561da1 to your computer and use it in GitHub Desktop.
multilinear chart
license: mit
<!DOCTYPE html>
<head>
<meta charset="utf-8">
<script src="https://d3js.org/d3.v4.min.js"></script>
<style>
body { margin:0;position:fixed;top:0;right:0;bottom:0;left:0; }
</style>
</head>
<body>
<script>
var data = [{
"sale": "202",
"year": "2000"
}, {
"sale": "215",
"year": "2001"
}, {
"sale": "179",
"year": "2002"
}, {
"sale": "199",
"year": "2003"
}, {
"sale": "134",
"year": "2003"
}, {
"sale": "176",
"year": "2010"
}];
// Feel free to change or delete any of the code you see in this editor!
var svg = d3.select("body").append("svg")
.attr("width", 1000)
.attr("height", 500)
.attr("id", "visualization");
var vis = d3.select("#visualization"),
WIDTH = 1000,
HEIGHT = 500,
MARGINS = {
top: 20,
right: 20,
bottom: 20,
left: 50
},
xScale = d3.scale.linear().range([MARGINS.left, WIDTH - MARGINS.right]).domain([0,3]),
yScale = d3.scale.linear().range([HEIGHT - MARGINS.top, MARGINS.bottom]).domain([0,200]),
xAxis = d3.svg.axis()
.scale(xScale),
yAxis = d3.svg.axis()
.scale(yScale);
vis.append("svg:g")
.call(xAxis);
</script>
</body>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment