private renderLegend()

in packages/timebrush/src/TimeBrush.ts [506:547]

• 35 lines of code
• 11 McCabe index (conditional complexity)

    private renderLegend() {
        // clear the previous legend
        this.legend.selectAll(".legendItem").remove();

        if (this._legendItems && this._legendItems.length > 0) {
            const maxLength = 25;

            // create a g element for each legend item
            const legendElements = this.legend.selectAll(".legendItem")
                .data(this._legendItems)
                .enter().append("g")
                .attr("class", "legendItem");

            // draw a circle with a color for each lengend item
            legendElements.append("circle")
                .attr("cx", this._legendFontSize / 3 )
                .attr("cy", 0.6 * this._legendFontSize)
                .attr("r", this._legendFontSize / 3 )
                .style("fill", d => d.color);

                  // add the text for each item
            legendElements.append("text")
                .attr("x", this._legendFontSize + 2)
                .attr("y", this._legendFontSize )
                .text(function(d, i) { // tslint:disable-line
                    return (maxLength > 0 && d.name && d.name.length > maxLength) ? d.name.slice(0, maxLength) + "..." : d.name;
                })
                .style("font-size", this._legendFontSize);

            // add a transform for each item to spread them out horizontally based on the width of each item
            let xoffset = 0;
            const padding = 10;
            legendElements
                .attr("transform", function(d, i) {
                    const translate = (i === 0) ?  "translate(0,0)" : "translate(" + (xoffset) + ",0)";
                    xoffset +=  this.getBBox().width + padding;
                    return translate;
                });


        }
    }