Generates a collection from multiple arrays
If you use NPM, npm install --save d3-czip
.
Otherwise, download the latest release.
<script src="https://d3js.org/d3.v4.min.js"></script>
<script src="https://unpkg.com/d3-czip@latest"></script>
<script>
var w = 960,
h = 500,
svg = d3.select("#chart")
.append("svg")
.attr("width",w)
.attr("height",h),
data = {
x: [100, 200, 300, 400, 500, 600, 700, 800],
y: [50, 150, 80, 200, 300, 120, 350, 210],
r: [50, 10, 30, 20, 60, 15, 40, 25],
c: ['red', 'blue', 'green', 'yellow', 'cyan', 'coral', 'black', 'grey']
};
svg.selectAll("circle")
.data(d3.czip(data))
.enter()
.append("circle")
.attr("cx", function(d) { return d.x; })
.attr("cy", function(d) { return d.y; })
.attr("r", function(d) { return d.r; })
.attr("fill", function(d) { return d.c; });
</script>
# d3.czip(objWithArrays);
Creates a collection of the arrays.