- {t('%s is not right as a column name, please alias it ' +
- '(as in SELECT count(*) ', colName)} {t('AS my_alias')}) {t('using only ' +
- 'alphanumeric characters and underscores')}
-
);
- }
- });
- if (this.state.chartType === null) {
- hints.push(VISUALIZE_VALIDATION_ERRORS.REQUIRE_CHART_TYPE);
- } else if (this.state.chartType.requiresTime) {
- let hasTime = false;
- for (const colName in cols) {
- const col = cols[colName];
- if (col.hasOwnProperty('is_date') && col.is_date) {
- hasTime = true;
- }
- }
- if (!hasTime) {
- hints.push(VISUALIZE_VALIDATION_ERRORS.REQUIRE_TIME);
- }
- }
- this.setState({ hints });
- }
- changeChartType(option) {
- this.setState({ chartType: option }, this.validate);
- }
- mergedColumns() {
- const columns = Object.assign({}, this.state.columns);
- if (this.props.query && this.props.query.results.columns) {
- this.props.query.results.columns.forEach((col) => {
- if (columns[col.name] === undefined) {
- columns[col.name] = col;
- }
- });
- }
- return columns;
- }
- buildVizOptions() {
- return {
- chartType: this.state.chartType.value,
- schema: this.state.schema,
- datasourceName: this.state.datasourceName,
- columns: this.state.columns,
- sql: this.props.query.sql,
- dbId: this.props.query.dbId,
- templateParams: this.props.query.templateParams,
- };
- }
- buildVisualizeAdvise() {
- let advise;
- const timeout = this.props.timeout;
- const queryDuration = moment.duration(this.props.query.endDttm - this.props.query.startDttm);
- if (Math.round(queryDuration.asMilliseconds()) > timeout * 1000) {
- advise = (
-
- This query took {Math.round(queryDuration.asSeconds())} seconds to run,
- and the explore view times out at {timeout} seconds,
- following this flow will most likely lead to your query timing out.
- We recommend your summarize your data further before following that flow.
- If activated you can use the CREATE TABLE AS feature
- to store a summarized data set that you can then explore.
- );
- }
- return advise;
- }
- visualize() {
- this.props.actions.createDatasource(this.buildVizOptions(), this)
- .done((resp) => {
- const columns = Object.keys(this.state.columns).map(k => this.state.columns[k]);
- const data = JSON.parse(resp);
- const mainGroupBy = columns.filter(d => d.is_dim)[0];
- const formData = {
- datasource: `${data.table_id}__table`,
- viz_type: this.state.chartType.value,
- since: '100 years ago',
- limit: '0',
- };
- if (mainGroupBy) {
- formData.groupby = [mainGroupBy.name];
- }
- this.props.actions.addInfoToast(t('Creating a data source and creating a new tab'));
-
- // open new window for data visualization
- exportChart(formData);
- })
- .fail(() => {
- this.props.actions.addDangerToast(this.props.errorMessage);
- });
- }
- changeDatasourceName(event) {
- this.setState({ datasourceName: event.target.value }, this.validate);
- }
- changeCheckbox(attr, columnName, event) {
- let columns = this.mergedColumns();
- const column = Object.assign({}, columns[columnName], { [attr]: event.target.checked });
- columns = Object.assign({}, columns, { [columnName]: column });
- this.setState({ columns }, this.validate);
- }
- changeAggFunction(columnName, option) {
- let columns = this.mergedColumns();
- const val = (option) ? option.value : null;
- const column = Object.assign({}, columns[columnName], { agg: val });
- columns = Object.assign({}, columns, { [columnName]: column });
- this.setState({ columns }, this.validate);
- }
- render() {
- if (!(this.props.query) || !(this.props.query.results) || !(this.props.query.results.columns)) {
- return (
-
-
-
- {t('No results available for this query')}
-
-
-