private drawScatterMarkersWithoutShapes()

in src/EnhancedScatterChart.ts [2741:2798]


    private drawScatterMarkersWithoutShapes(
        markers: Selection<EnhancedScatterChartDataPoint>,
        markersMerged: Selection<EnhancedScatterChartDataPoint>,
        scatterData: EnhancedScatterChartDataPoint[],
        sizeRange: NumberRange,
        duration: number
    ): {
            markers: Selection<EnhancedScatterChartDataPoint>,
            markersMerged: Selection<EnhancedScatterChartDataPoint>
        } {
        this.mainGraphicsContext
            .selectAll(EnhancedScatterChart.ImageSelector.selectorName)
            .remove();

        markers = this.mainGraphicsContext
            .classed(EnhancedScatterChart.ScatterMarkersSelector.className, true)
            .selectAll(EnhancedScatterChart.DotSelector.selectorName)
            .data(scatterData, (dataPoint: EnhancedScatterChartDataPoint) => {
                return (<ISelectionId>dataPoint.identity).getKey();
            });

        markersMerged = markers
            .enter()
            .append("path")
            .merge(markers);

        markersMerged
            .classed(EnhancedScatterChart.DotSelector.className, true)
            .attr("id", EnhancedScatterChart.MarkerShapeSelector.className);

        markersMerged
            .style("stroke-width", (dataPoint: EnhancedScatterChartDataPoint) => PixelConverter.toString(dataPoint.strokeWidth))
            .style("stroke", (dataPoint: EnhancedScatterChartDataPoint) => dataPoint.stroke)
            .style("fill", (dataPoint: EnhancedScatterChartDataPoint) => dataPoint.fill)
            .attr("d", (dataPoint: EnhancedScatterChartDataPoint) => {
                const r: number = EnhancedScatterChart.getBubbleRadius(dataPoint.radius, sizeRange, this.viewport),
                    area: number = EnhancedScatterChart.RadiusMultiplexer * r * r;

                return dataPoint.shapeSymbolType(area);
            })
            .transition()
            .duration((dataPoint: EnhancedScatterChartDataPoint) => {
                if (this.keyArray.indexOf((<ISelectionId>dataPoint.identity).getKey()) >= 0) {
                    return duration;
                } else {
                    return EnhancedScatterChart.MinAnimationDuration;
                }
            })
            .attr("transform", (dataPoint: EnhancedScatterChartDataPoint) => {
                const x: number = EnhancedScatterChart.getDefinedNumberValue(this.xAxisProperties.scale(dataPoint.x)),
                    y: number = EnhancedScatterChart.getDefinedNumberValue(this.yAxisProperties.scale(dataPoint.y)),
                    rotation: number = dataPoint.rotation;

                return `translate(${x},${y}) rotate(${rotation})`;
            });

        return { markers, markersMerged };
    }