in packages/sanddance-explorer/src/explorer.tsx [230:346]
public updateViewerOptions(viewerOptions: Partial<SandDance.types.ViewerOptions>) {
this.viewerOptions = {
...SandDance.VegaDeckGl.util.deepMerge(
defaultViewerOptions,
this.viewerOptions,
viewerOptions
),
tooltipOptions: {
exclude: columnName => this.state.tooltipExclusions.indexOf(columnName) >= 0
},
onColorContextChange: () => this.manageColorToolbar(),
onDataFilter: (filter, filteredData) => {
const selectedItemIndex = { ...this.state.selectedItemIndex };
selectedItemIndex[DataScopeId.FilteredData] = 0;
this.changeInsight(
{ filter },
{ label: this.historicFilterChange, omit: !this.historicFilterChange }
);
this.historicFilterChange = null;
this.setState({ filteredData, selectedItemIndex });
if (this.state.sideTabId === SideTabId.Data && this.state.dataScopeId === DataScopeId.FilteredData) {
//make sure item is active
requestAnimationFrame(() => filteredData && this.silentActivation(filteredData[0]));
}
viewerOptions && viewerOptions.onDataFilter && viewerOptions.onDataFilter(filter, filteredData);
},
onSelectionChanged: (newSearch, index, selectedData) => {
if (this.ignoreSelectionChange) return;
const selectedItemIndex = { ...this.state.selectedItemIndex };
selectedItemIndex[DataScopeId.SelectedData] = index || 0;
let { search } = this.state;
const { sideTabId } = this.state;
if (newSearch) {
search = createInputSearch(newSearch);
//} else {
//sideTabId = SideTabId.ChartType;
}
this.setState({ search, selectedItemIndex, sideTabId });
viewerOptions && viewerOptions.onSelectionChanged && viewerOptions.onSelectionChanged(newSearch, index, selectedData);
},
onAxisClick: (e, search) => {
this.toggleableSearch(e, search);
viewerOptions && viewerOptions.onAxisClick && viewerOptions.onAxisClick(e, search);
},
onLegendHeaderClick: e => {
const pos = getPosition(e);
const specRole = this.state.specCapabilities && this.state.specCapabilities.roles.filter(r => r.role === 'color')[0];
const positionedColumnMapProps: PositionedColumnMapProps = {
...this.getColumnMapBaseProps(),
collapseLabel: true,
container: this.div,
selectedColumnName: this.state.columns['color'],
onDismiss: () => { this.setState({ positionedColumnMapProps: null }); },
specRole,
left: pos.left - this.div.clientLeft,
top: pos.top - this.div.clientTop
};
this.setState({ positionedColumnMapProps });
},
onLegendRowClick: (e, legendRow) => {
this.toggleableSearch(e, legendRow.search);
viewerOptions && viewerOptions.onLegendRowClick && viewerOptions.onLegendRowClick(e, legendRow);
},
onError: (errors) => {
this.setState({ errors });
viewerOptions && viewerOptions.onError && viewerOptions.onError(errors);
},
onBeforeCreateLayers,
getTextColor: o => {
if ((o as TextWithSpecRole).specRole) {
return SandDance.VegaDeckGl.util.colorFromString((this.viewerOptions.colors as ColorSettings).clickableText);
} else if (o.metaData && o.metaData.search) {
return SandDance.VegaDeckGl.util.colorFromString((this.viewerOptions.colors as ColorSettings).searchText);
} else {
return o.color;
}
},
getTextHighlightAlphaCutoff: () => (this.viewerOptions.colors as ColorSettings).clickableTextHighlightAlphaCutoff,
getTextHighlightColor: o => {
if ((o as TextWithSpecRole).specRole) {
return SandDance.VegaDeckGl.util.colorFromString((this.viewerOptions.colors as ColorSettings).clickableTextHighlight);
} else if (o.metaData && o.metaData.search) {
return SandDance.VegaDeckGl.util.colorFromString((this.viewerOptions.colors as ColorSettings).searchTextHighlight);
} else {
return [0, 0, 0, 0];
}
},
onTextClick: (e, text) => {
if (e && text) {
const pos = getPosition(e);
const { specRole } = text as TextWithSpecRole;
if (pos && specRole) {
const positionedColumnMapProps: PositionedColumnMapProps = {
...this.getColumnMapBaseProps(),
collapseLabel: true,
container: this.div,
selectedColumnName: this.state.columns[specRole.role],
onDismiss: () => { this.setState({ positionedColumnMapProps: null }); },
specRole,
left: pos.left - this.div.clientLeft,
top: pos.top - this.div.clientTop
};
this.setState({ positionedColumnMapProps });
} else {
this.setState({ positionedColumnMapProps: null });
}
}
},
onNewViewStateTarget: () => this.newViewStateTarget
};
if (this.viewer && this.viewer.presenter) {
const newPresenterStyle = SandDance.util.getPresenterStyle(this.viewerOptions as SandDance.types.ViewerOptions);
const mergePrenterStyle = { ...this.viewer.presenter.style, ...newPresenterStyle };
this.viewer.presenter.style = mergePrenterStyle;
this.viewer.options = SandDance.VegaDeckGl.util.deepMerge(this.viewer.options, this.props.viewerOptions, this.viewerOptions) as SandDance.types.ViewerOptions;
}
}