drawAllHistograms()

in src/distribution/plot.tsx [132:190]

• 40 lines of code
• 4 McCabe index (conditional complexity)

    drawAllHistograms(animate: boolean) {
        const histogram = this.createHistogram();
        var allHist: {selected: BinsDrawData, all: BinsDrawData} = {
            selected: {
                bins: histogram(this.props.histData.selected),
                g: this.histAll.current,
                draw_fn: this.drawHistogramRects.bind(this),
            },
            all: {
                bins: histogram(this.props.histData.all),
                g: this.histSelected.current,
                draw_fn: this.drawHistogramLines.bind(this),
            }
        };

        // Density axis: set max based on maximum in histogram
        const maxDensityHistogram = d3.max(Object.values(allHist), function(hist) {
            const total = d3.sum(hist.bins, (d) => d.length);
            if (!total) {
                return 0;
            }
            return d3.max(hist.bins, (d) => d.length / total);
        });
        var densityScale = d3.scaleLinear()
            .domain([0, maxDensityHistogram]);
        var binsOrdering = allHist.all.bins.map((_, i) => i);
        if (this.isVertical()) {
            densityScale = densityScale.range([this.figureHeight(), 0])
            d3.select(this.axisLeft.current)
                .transition()
                .duration(animate ? this.props.animateMs : 0)
                .call(d3.axisLeft(densityScale)
                    .ticks(1 + this.props.height/50)
                    .tickSizeInner(-(this.props.width - margin.left - margin.right))
                );
        } else {
            densityScale = densityScale.range([0, this.figureWidth()])
            d3.select(this.axisBottom.current)
                .transition()
                .duration(animate ? this.props.animateMs : 0)
                .call(d3.axisBottom(densityScale).ticks(1 + this.props.width/50));
            // Compute reordering of the bins - we want to display higher densities first.
            var ordered1 = Array.from(binsOrdering).sort((a, b) => allHist.selected.bins[a].length - allHist.selected.bins[b].length);
            ordered1.forEach(function(value, idx) {
                binsOrdering[value] = idx;
            });
            // Update ticks/axis as well
            var domain: string[] = this.dataScale.domain();
            var domainsOrdered = domain.map(function(v, idx) {
                return domain[ordered1[idx]];
            });
            this.createDataAxis(d3.scalePoint().domain(domainsOrdered).range(this.dataScale.range()), true);
        }

        // Draw all the histograms
        Object.values(allHist).forEach(function(v) {
            v.draw_fn(v, densityScale, animate, binsOrdering);
        }.bind(this))
    }