private renderComponent()

in src/visualComponent/mainChart/axisComponent.ts [77:122]


    private renderComponent(options: IAxisComponentRenderOptions) {
        const {
            y,
            series,
            settings,
            viewport,
        } = options;

        const xScale: DataRepresentationScale = options.series.x.scale
            .copy()
            .range([0, viewport.width]);

        const yScale: DataRepresentationScale = y.scale
            .copy()
            .range([viewport.height, 0]);

        const domain: number[] = <number[]>(yScale.getDomain());

        const axisValueFormatter: valueFormatter.IValueFormatter = valueFormatter.create({
            displayUnitSystemType: 2,
            format: settings.getFormat(),
            precision: detectPrecision(domain[1] || domain[0], settings),
            value: settings.displayUnits || domain[1] || domain[0],
        });

        const yAxis = axisRight(<ScaleLinear<number, number>>(yScale.getScale()))
            .tickValues(domain)
            .tickFormat((value: number) => {
                return axisValueFormatter.format(value);
            });

        this.element.call(yAxis);

        this.element
            .selectAll(".tick text")
            .each(function enumerateEachTextTick(_, elementIndex: number) {
                d3Select(this)
                    .attr("x", settings.axisLabelX)
                    .attr("y", elementIndex
                        ? settings.axisLabelY
                        : -settings.axisLabelY)
                    .style("fill", settings.color);
            });

        this.updateFormatting(this.element, settings);
    }