constructor()

in src/Sunburst.ts [183:248]


    constructor(options: VisualConstructorOptions) {

        this.visualHost = options.host;

        this.events = options.host.eventService;

        this.tooltipService = createTooltipServiceWrapper(
            options.host.tooltipService,
            options.element
        );

        this.percentageFormatter = valueFormatter.create({ format: "0.00%;-0.00%;0.00%" });

        this.colorPalette = this.visualHost.colorPalette;
        this.colorHelper = new ColorHelper(this.colorPalette);
        this.arc = d3Arc<HierarchyRectangularNode<SunburstDataPoint>>()
                .startAngle(d => d.x0)
                .endAngle(d => d.x1)
                .innerRadius((d) => Math.sqrt(d.y0))
                .outerRadius((d) => Math.sqrt(d.y1));

        this.colorPalette = options.host.colorPalette;

        this.interactivityService = createInteractivitySelectionService(options.host);

        this.chartWrapper = d3Select(options.element)
            .append("div")
            .classed(this.appCssConstants.main.className, true);

        this.svg = this.chartWrapper
            .append("svg")
            .attr("viewBox", `0 0 ${Sunburst.ViewBoxSize} ${Sunburst.ViewBoxSize}`)
            .attr("width", "100%")
            .attr("height", "100%")
            .attr("preserveAspectRatio", "xMidYMid meet");

        this.selectionManager = options.host.createSelectionManager();

        this.main = this.svg.append("g");
        this.main.attr(CssConstants.transformProperty, translate(Sunburst.CentralPoint, Sunburst.CentralPoint));

        this.selectedCategoryLabel = this.svg
            .append("text")
            .classed(this.appCssConstants.label.className, true)
            .classed(this.appCssConstants.categoryLabel.className, true);

        this.selectedCategoryLabel.attr("x", Sunburst.CentralPoint);
        this.selectedCategoryLabel.attr("y", Sunburst.CentralPoint);

        this.percentageLabel = this.svg
            .append("text")
            .classed(this.appCssConstants.label.className, true)
            .classed(this.appCssConstants.percentageLabel.className, true);
        this.percentageLabel.attr("x", Sunburst.CentralPoint);
        this.percentageLabel.attr("y", Sunburst.CentralPoint);

        // create legend container
        this.legend = createLegend(options.element,
            false,
            null,
            true,
            LegendPosition.Top
        );

        this.renderContextMenu();
    }