in src/distribution/plot.tsx [218:265]
drawHistogramRects(hist: BinsDrawData, densityScale: d3.ScaleLinear<number, number>, animate: boolean, binsOrdering: number[]) {
const total = d3.sum(hist.bins, (d) => d.length);
const densityScaleFromLength = (d) => densityScale(total ? d.length / total : 0);
const dataScale = d3.scaleLinear().range(this.dataScale.range());
var u = d3.select(hist.g).selectAll<SVGRectElement, any>("rect")
.data(hist.bins);
var ut = u
.enter()
.append("rect") // Add a new rect for each new elements
.merge(u) // get the already existing elements as well
.attr("data-value-sample", function(d, i) { return d.length ? d[0][this.props.axis] : "empty"}.bind(this))
.on('mouseover', function (d, i) {
d3.select(this).transition()
.duration(150)
.attr('opacity', '.5');
})
.on('mouseout', function (d, i) {
d3.select(this).transition()
.duration(150)
.attr('opacity', '1');
})
.transition() // and apply changes to all of them
.duration(animate ? this.props.animateMs : 0);
if (this.isVertical()) {
ut
.attr("x", 1)
.attr("transform", function(d) { return "translate(" + dataScale(d.x0) + "," + densityScaleFromLength(d) + ")"; })
.attr("width", function(d) { return dataScale(d.x1) - dataScale(d.x0) -1 ; })
.attr("height", function(d) {
return this.figureHeight() - densityScaleFromLength(d);
}.bind(this));
} else {
ut
//.attr("y", 1)
.attr("transform", function(d, i) { return "translate(0," + dataScale(hist.bins[binsOrdering[i]].x1) + ")"; })
.attr("width", function(d) { return densityScaleFromLength(d); })
.attr("height", function(d, i) {
const delta = Math.abs(dataScale(hist.bins[binsOrdering[i]].x1) - dataScale(hist.bins[binsOrdering[i]].x0));
return delta > 2 ? delta - 1 : delta;
}.bind(this));
}
u
.exit()
.remove();
}