public changeColumnMapping()

in packages/sanddance-explorer/src/explorer.tsx [685:788]


        public changeColumnMapping(role: SandDance.specs.InsightColumnRoles, column: SandDance.types.Column, options?: ChangeColumnMappingOptions) {
            const columns = { ...this.state.columns };
            const label = column ? strings.labelHistoryMapColumn(role) : strings.labelHistoryUnMapColumn(role);
            const final = () => {
                const partialInsight: Partial<SandDance.specs.Insight> = { columns, totalStyle: options ? options.totalStyle : this.state.totalStyle };
                const errors = ensureColumnsPopulated(this.state.chart, partialInsight.totalStyle, partialInsight.columns, this.state.dataContent.columns);

                columns[role] = column && column.name;
                this.changeInsight(
                    partialInsight,
                    { label },
                    errors ? { errors } : null
                );
            };
            const _changeInsight = (newInsight: Partial<HistoricInsight>, columnUpdate: SandDance.specs.InsightColumns, historyAction: HistoryAction) => {
                newInsight.columns = SandDance.VegaDeckGl.util.deepMerge(
                    {},
                    columns,
                    columnUpdate
                );
                savePref(this.prefs, this.state.chart, '*', '*', { columns: columnUpdate });
                this.changeInsight(newInsight, historyAction);
            };
            if (column) {
                let columnUpdate: SandDance.specs.InsightColumns;
                switch (role) {
                    case 'facet': {
                        copyPrefToNewState(this.prefs, this.state.chart, 'facet', column.name);
                        const historicInsight: Partial<HistoricInsight> = { columns, facetStyle: options ? options.facetStyle : this.state.facetStyle };
                        columnUpdate = { facet: column.name };
                        _changeInsight(historicInsight, columnUpdate, { label });
                        break;
                    }
                    case 'color': {
                        let calculating: () => void = null;
                        let historicInsight: Partial<HistoricInsight> = { scheme: options && options.scheme, columns, colorBin: this.state.colorBin };
                        if (!historicInsight.scheme) {
                            copyPrefToNewState(this.prefs, this.state.chart, 'color', column.name);
                        }
                        if (!historicInsight.scheme) {
                            historicInsight.scheme = bestColorScheme(column, null, this.state.scheme);
                        }
                        if (!column.stats.hasColorData) {
                            historicInsight.directColor = false;
                            if (this.state.directColor !== historicInsight.directColor) {
                                calculating = () => this._resize();
                            }
                        }
                        if (this.state.columns && this.state.columns.color && this.state.columns.color !== column.name) {
                            const currColorColumn = this.state.dataContent.columns.filter(c => c.name === this.state.columns.color)[0];
                            if (column.isColorData != currColorColumn.isColorData) {
                                calculating = () => this._resize();
                            }
                        }
                        this.ignoreSelectionChange = true;
                        this.viewer.deselect().then(() => {
                            this.ignoreSelectionChange = false;
                            //allow deselection to render
                            requestAnimationFrame(() => {
                                columnUpdate = { color: column.name };
                                this.getColorContext = null;
                                this.setState({ calculating });
                                _changeInsight(historicInsight, columnUpdate, { label });
                            });
                        });
                        break;
                    }
                    case 'x': {
                        copyPrefToNewState(this.prefs, this.state.chart, 'x', column.name);
                        const historicInsight: Partial<HistoricInsight> = { columns };
                        columnUpdate = { x: column.name };
                        _changeInsight(historicInsight, columnUpdate, { label });
                        break;
                    }
                    case 'size': {
                        copyPrefToNewState(this.prefs, this.state.chart, 'size', column.name);
                        const historicInsight: Partial<HistoricInsight> = { totalStyle: options ? options.totalStyle : this.state.totalStyle };
                        columnUpdate = { size: column.name };
                        _changeInsight(historicInsight, columnUpdate, { label });
                        break;
                    }
                    default: {
                        final();
                        break;
                    }
                }
            } else {
                switch (role) {
                    case 'facet': {
                        columns.facet = null;
                        columns.facetV = null;
                        this.changeInsight(
                            { columns, facetStyle: 'wrap' },
                            { label }
                        );
                        break;
                    }
                    default: {
                        final();
                        break;
                    }
                }
            }
        }