private setUpBulletsHorizontally()

in src/visual.ts [757:855]


    private setUpBulletsHorizontally(bulletBody: BulletSelection<any>, model: BulletChartModel, reveresed: boolean): void {
        let bars: BarData[] = model.bars;
        let rects: BarRect[] = model.barRects;
        let valueRects: BarValueRect[] = model.valueRects;
        let targetValues: TargetValue[] = model.targetValues;
        let barSelection: BulletSelection<any> = this.labelGraphicsContext.selectAll("text").data(bars, (d: BarData) => d.key);
        let rectSelection: BulletSelection<any> = this.bulletGraphicsContext.selectAll("rect.range").data(rects, (d: BarRect) => d.key);
        // Draw bullets
        let bullets: BulletSelection<any> = rectSelection
            .enter()
            .append("rect")
            .merge(rectSelection);

        bullets
            .attr("x", ((d: BarRect) => Math.max(BulletChart.zeroValue, this.calculateLabelWidth(bars[d.barIndex], d, reveresed))))
            .attr("y", ((d: BarRect) => Math.max(BulletChart.zeroValue, bars[d.barIndex].y)))
            .attr("width", ((d: BarRect) => Math.max(BulletChart.zeroValue, d.end - d.start)))
            .attr("height", BulletChart.BulletSize)
            .classed("range", true)
            .style("fill", (d: BarRect) => d.fillColor)
            .style("stroke", (d: BarRect) => d.strokeColor)
            .style("stroke-width", (d: BarRect) => d.strokeWidth);

        rectSelection.exit();

        // Draw value rects
        let valueSelection: BulletSelection<any> = this.bulletGraphicsContext.selectAll("rect.value").data(valueRects, (d: BarValueRect) => d.key);
        let valueSelectionMerged = valueSelection
            .enter()
            .append("rect")
            .merge(valueSelection);

        valueSelectionMerged
            .attr("x", ((d: BarValueRect) => Math.max(BulletChart.zeroValue, this.calculateLabelWidth(bars[d.barIndex], d, reveresed))))
            .attr("y", ((d: BarValueRect) => Math.max(BulletChart.zeroValue, bars[d.barIndex].y + BulletChart.bulletMiddlePosition)))
            .attr("width", ((d: BarValueRect) => Math.max(BulletChart.zeroValue, d.end - d.start)))
            .attr("height", BulletChart.BulletSize * BulletChart.value1 / BulletChart.value4)
            .classed("value", true)
            .style("fill", (d: BarValueRect) => d.fillColor)
            .style("stroke", (d: BarValueRect) => d.strokeColor)
            .style("stroke-width", (d: BarValueRect) => d.strokeWidth);

        valueSelection.exit();
        // Draw markers
        this.drawFirstTargets(targetValues,
            (d: TargetValue) => this.calculateLabelWidth(bars[d.barIndex], null, reveresed) + d.value,
            (d: TargetValue) => this.calculateLabelWidth(bars[d.barIndex], null, reveresed) + d.value,
            (d: TargetValue) => bars[d.barIndex].y + BulletChart.MarkerMarginHorizontal,
            (d: TargetValue) => bars[d.barIndex].y + BulletChart.MarkerMarginHorizontalEnd);

        this.drawSecondTargets(
            targetValues,
            (d: TargetValue) => this.calculateLabelWidth(bars[d.barIndex], null, reveresed) + d.value2,
            (d: TargetValue) => bars[d.barIndex].y + BulletChart.BulletSize / BulletChart.value2);

        this.drawAxesLabels(model, reveresed);
        let measureUnitsText = TextMeasurementService.getTailoredTextOrDefault(
            BulletChart.getTextProperties(model.settings.axis.measureUnits, BulletChart.DefaultSubtitleFontSizeInPt),
            BulletChart.MaxMeasureUnitWidth);
        // Draw measure label
        if (model.settings.axis.measureUnits) {
            barSelection
                .enter()
                .append("text")
                .merge(barSelection)
                .attr("x", ((d: BarData) => {
                    if (reveresed)
                        return BulletChart.XMarginHorizontalLeft + BulletChart.XMarginHorizontalRight + model.viewportLength + BulletChart.SubtitleMargin;
                    return d.x - BulletChart.SubtitleMargin;
                }))
                .attr("y", ((d: BarData) => d.y + this.data.labelHeight / BulletChart.value2 + BulletChart.value12 + BulletChart.BulletSize / 2))
                .attr("fill", model.settings.axis.unitsColor)
                .attr("font-size", PixelConverter.fromPoint(BulletChart.DefaultSubtitleFontSizeInPt))
                .text(measureUnitsText);
        }
        if (this.interactivityService) {
            let targetCollection = this.data.barRects.concat(this.data.valueRects);
            let behaviorOptions: BulletBehaviorOptions = {
                rects: bullets,
                valueRects: valueSelectionMerged,
                clearCatcher: this.clearCatcher,
                interactivityService: this.interactivityService,
                bulletChartSettings: this.data.settings,
                hasHighlights: this.data.hasHighlights,
                behavior: this.behavior,
                dataPoints: targetCollection
            };

            this.interactivityService.bind(behaviorOptions);
        }
        barSelection.exit();
        this.tooltipServiceWrapper.addTooltip(
            valueSelectionMerged,
            (data: TooltipEnabledDataPoint) => data.tooltipInfo);
        this.tooltipServiceWrapper.addTooltip(
          bullets,
          (data: TooltipEnabledDataPoint) => data.tooltipInfo
        );
    }