Method render

packages/sanddance-explorer/src/explorer.tsx:983–1501

()

        }

        render() {
            const { colorBin, columns, directColor, facetStyle, filter, hideAxes, hideLegend, scheme, signalValues, size, totalStyle, transform, chart, view } = this.state;
            const insight: SandDance.specs.Insight = {
                colorBin,
                columns,
                directColor,
                facetStyle,
                filter,
                hideAxes,
                hideLegend,
                scheme,
                signalValues,
                size,
                totalStyle,
                transform,
                chart,
                view,
            };

            const loaded = !!(this.state.columns && this.state.dataContent);

            const selectionState: SandDance.types.SelectionState = (this.viewer && this.viewer.getSelection()) || {};
            const selectionSearch = selectionState && selectionState.search;

            const columnMapProps = this.getColumnMapBaseProps();

            const datas: { [key: number]: object[] } = {};
            datas[DataScopeId.AllData] = this.state.dataContent && this.state.dataContent.data;
            datas[DataScopeId.FilteredData] = this.state.filteredData;
            datas[DataScopeId.SelectedData] = selectionState && selectionState.selectedData;

            if (this.state.calculating) {
                requestAnimationFrame(() => {
                    //allow render to complete
                    if (this.state.calculating) {
                        this.state.calculating();
                        this.setState({ calculating: null });
                    }
                });
            }

            const theme = this.props.theme || '';
            const themePalette = themePalettes[theme];

            return (
                <div
                    ref={div => { if (div) this.div = div; }}
                    className={util.classList('sanddance-explorer', this.props.theme)}
                >
                    <Topbar
                        collapseLabels={this.props.compactUI}
                        historyIndex={this.state.historyIndex}
                        historyItems={this.state.historyItems}
                        undo={() => this.undo()}
                        redo={() => this.redo()}
                        logoClickUrl={this.props.logoClickUrl}
                        logoClickTarget={this.props.logoClickTarget}
                        themePalette={themePalette}