diff --git a/client/app/visualizations/edit-visualization-dialog.css b/client/app/visualizations/edit-visualization-dialog.css
new file mode 100644
index 0000000000..3e84b755b2
--- /dev/null
+++ b/client/app/visualizations/edit-visualization-dialog.css
@@ -0,0 +1,5 @@
+/* Edit Visualization Dialog specific CSS */
+
+.slight-padding {
+ padding: 5px;
+}
\ No newline at end of file
diff --git a/client/app/visualizations/edit-visualization-dialog.html b/client/app/visualizations/edit-visualization-dialog.html
index ac2a32a405..187d6a5496 100644
--- a/client/app/visualizations/edit-visualization-dialog.html
+++ b/client/app/visualizations/edit-visualization-dialog.html
@@ -33,10 +33,18 @@
Visualization Editor
+
+
diff --git a/client/app/visualizations/edit-visualization-dialog.js b/client/app/visualizations/edit-visualization-dialog.js
index c021be54ca..fb19350cd1 100644
--- a/client/app/visualizations/edit-visualization-dialog.js
+++ b/client/app/visualizations/edit-visualization-dialog.js
@@ -1,6 +1,7 @@
import { pluck } from 'underscore';
import { copy } from 'angular';
import template from './edit-visualization-dialog.html';
+import './edit-visualization-dialog.css';
const EditVisualizationDialog = {
template,
@@ -19,6 +20,9 @@ const EditVisualizationDialog = {
this.visualization = copy(this.originalVisualization);
this.visTypes = Visualization.visualizationTypes;
+ this.warning_three_column_groupby = 'You have more than 2 columns in your result set. To ensure the chart is accurate, please do one of the following: - Change the SQL query to give 2 result columns. You can CONCAT() columns together if you wish.
- Select column(s) to group by.
';
+ this.warning_three_column_stacking = 'You have more than 2 columns in your result set. You may wish to make the Stacking option equal to `Enabled` or `Percent`.';
+
this.newVisualization = () =>
({
type: Visualization.defaultVisualization.type,
@@ -45,6 +49,24 @@ const EditVisualizationDialog = {
}
};
+ this.has3plusColumnsFunction = () => {
+ let has3plusColumns = false;
+ if ((JSON.stringify(this.visualization.options.columnMapping).match(/,/g) || []).length > 2) {
+ has3plusColumns = true;
+ }
+ return has3plusColumns;
+ };
+
+ this.disableSubmit = () => {
+ if (this.visualization.options.globalSeriesType === 'column'
+ && this.has3plusColumnsFunction()
+ && !JSON.stringify(this.visualization.options.columnMapping).includes('"":')
+ && JSON.stringify(this.visualization.options.columnMapping).includes('unused')) {
+ return true;
+ }
+ return false;
+ };
+
this.submit = () => {
if (this.visualization.id) {
Events.record('update', 'visualization', this.visualization.id, { type: this.visualization.type });