Skip to content

Instantly share code, notes, and snippets.

@xemoe
Last active October 13, 2015 16:06
Show Gist options
  • Save xemoe/a3d825468ac07e332577 to your computer and use it in GitHub Desktop.
Save xemoe/a3d825468ac07e332577 to your computer and use it in GitHub Desktop.
D3JS Histogram settings
function histogram_settings(jQuery, d3, id, colors, data) {
var t = this;
var stack = d3.layout.stack();
stack(data);
t.getId = function() {
return id;
}
t.getDataset = function() {
return data;
}
t.getColors = function() {
return colors;
}
t.getWidth = function() {
return jQuery("#" + t.getId()).width();
}
t.getHeight = function() {
return jQuery("#" + t.getId()).height();
}
t.getPadding = function() {
return {
"top": 40,
"right": 40,
"bottom": 40,
"left": 40
};
}
t.x = {
getDomain: function() {
return [
new Date(data[0][0].time),
d3.time.day.offset(new Date(data[0][data[0].length - 1].time), 1)
];
},
getRange: function() {
return [
0,
t.getWidth() - t.getPadding().left - t.getPadding().right
];
},
getTicks: function() {
return Math.floor(data[0].length/7);
}
}
t.y = {
getDomain: function() {
return [
0,
d3.max(data, function(d) {
return d3.max(d, function(d) {
return d.y0 + d.y;
});
}),
];
},
getRange: function() {
return [
t.getHeight() - t.getPadding().bottom - t.getPadding().top,
0
];
},
getTicks: function() {
return 10;
}
}
t.groups = {
attr: {
getTransform: function() {
return "translate(" + t.getPadding().left + "," + (t.getHeight() - t.getPadding().bottom) + ")";
}
},
style: {
f_fill: function(d, i) {
return t.getColors()[data.indexOf(d)][1];
}
}
};
t.getRects = function(xScale, yScale) {
var q = this;
q.f_data = function(d) {
return d;
};
q.transition = {
f_duration: function(d,i) {
return 100;
},
attr: {
f_x: function(d) {
return xScale(new Date(d.time));
},
f_y: function(d) {
return -(-yScale(d.y0) - yScale(d.y) + (t.getHeight() - t.getPadding().top - t.getPadding().bottom) * 2);
},
f_height: function(d) {
return -yScale(d.y) + (t.getHeight() - t.getPadding().top - t.getPadding().bottom);
},
width: function() {
return (t.getWidth() - t.getPadding().left - t.getPadding().right) / data[0].length * (5/8)
}
}
};
return q;
};
t.svg = {
x: {
axis: {
transform: function() {
return "translate(40," + (t.getHeight() - t.getPadding().bottom) + ")";
}
}
},
y: {
axis: {
transform: function() {
return "translate(" + t.getPadding().left + "," + t.getPadding().top + ")";
}
}
}
}
return t;
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment