private drawGrid()

in src/services/dataRenderService.ts [230:289]


    private drawGrid(element: Selection<any>, settings: OuterLineSettings): void {
        let outerThickness: string = PixelConverter.toString(settings.thickness),
            color: string = settings.color,
            ticksCount: number = this.ticksRadiusArray.length;

        let circleAxes: Selection<any> = element
            .selectAll("g" + DataRenderService.CircleLine.selectorName)
            .data(this.ticksRadiusArray);

        circleAxes.exit().remove();

        circleAxes = circleAxes.merge(
            circleAxes.enter().append("g").classed(DataRenderService.CircleLine.className, true));

        let circle: any = circleAxes
            .selectAll("circle")
            .data((t) => { return [t]; });

        circle
            .exit()
            .remove();

        circle = circle.merge(circle
            .enter()
            .append("circle"));

        circle
            .attr("r", (d) => d)
            .style("opacity", (d: number, i: number, o: number) => {
                if (o === ticksCount - 1) {
                    return 0;
                } else {
                    return settings.showGrid ? 0.5 : 0;
                }
            })
            .style("stroke", color)
            .style("fill", "none");

        if (settings.showGridTicksValues) {
            let text: any = circleAxes.selectAll("text").data(this.tickValuesArray);
            let textProperties: TextProperties = {
                fontFamily: dataLabelUtils.StandardFontFamily,
                fontSize: PixelConverter.toString(this.settings.outerLine.fontSize)
            };
            text.exit().remove();
            text = text.merge(text.enter().append("text"));
            text.attrs({
                "dy": (d: number, i: number) => { return -this.ticksRadiusArray[i] + DataRenderService.PixelsBelowAxis + (parseInt(this.settings.outerLine.fontSize.toString())); },
                "dx": (d: number, i: number) => { return - textMeasurementService.measureSvgTextWidth(textProperties, this.tickValuesArray[i].toString()) / DataRenderService.AxisTextWidthCoefficient; },
                "text-anchor": "middle"
            })
                .style("font-size", this.settings.outerLine.fontSize)
                .style("fill", this.settings.outerLine.textColor)
                .classed(DataRenderService.CircleText.className, true)
                .text((d: number, i: number) => { return this.tickValuesArray[i]; });

        } else {
            element.selectAll(DataRenderService.CircleText.selectorName).remove();
        }
    }