Pārlūkot izejas kodu

HUE-9013 [editor] Remove snippet references from the resultChart component

Johan Ahlen 6 gadi atpakaļ
vecāks
revīzija
4fc80f8cf4

+ 218 - 216
desktop/core/src/desktop/js/apps/notebook2/components/resultChart/chartTransformers.js

@@ -17,136 +17,139 @@
 import $ from 'jquery';
 
 import HueColors from 'utils/hueColors';
-import hueUtils from 'utils/hueUtils';
+import { html2text } from 'utils/hueUtils';
+
+// The leaflet map can freeze the browser with numbers outside the map
+const MIN_LAT = -90;
+const MAX_LAT = 90;
+const MIN_LNG = -180;
+const MAX_LNG = 180;
 
 const isNotNullForCharts = val => val !== 'NULL' && val !== null;
 
 export const pieChartTransformer = function(rawDatum) {
-  let _data = [];
-
-  if (rawDatum.snippet.chartX() != null && rawDatum.snippet.chartYSingle() != null) {
-    let _idxValue = -1;
-    let _idxLabel = -1;
-    rawDatum.snippet.result.meta().forEach((col, idx) => {
-      if (col.name === rawDatum.snippet.chartX()) {
-        _idxLabel = idx;
+  let data = [];
+
+  if (rawDatum.chartX() != null && rawDatum.chartYSingle() != null) {
+    let valueIndex = -1;
+    let labelIndex = -1;
+    rawDatum.meta().some((col, index) => {
+      if (col.name === rawDatum.chartX()) {
+        labelIndex = index;
       }
-      if (col.name === rawDatum.snippet.chartYSingle()) {
-        _idxValue = idx;
+      if (col.name === rawDatum.chartYSingle()) {
+        valueIndex = index;
       }
+      return valueIndex !== -1 && labelIndex !== -1;
     });
     const colors = HueColors.cuiD3Scale();
-    $(rawDatum.counts()).each((cnt, item) => {
-      if (isNotNullForCharts(item[_idxValue])) {
-        let val = item[_idxValue] * 1;
+    rawDatum.data().forEach((item, index) => {
+      if (isNotNullForCharts(item[valueIndex])) {
+        let val = item[valueIndex] * 1;
         if (isNaN(val)) {
           val = 0;
         }
-        _data.push({
-          label: hueUtils.html2text(item[_idxLabel]),
+        data.push({
+          label: html2text(item[labelIndex]),
           value: val,
-          color: colors[cnt % colors.length],
+          color: colors[index % colors.length],
           obj: item
         });
       }
     });
   }
 
-  if (rawDatum.sorting === 'asc') {
-    _data.sort((a, b) => a.value - b.value);
-  } else if (rawDatum.sorting === 'desc') {
-    _data.sort((a, b) => b.value - a.value);
+  if (rawDatum.chartSorting() === 'asc') {
+    data.sort((a, b) => a.value - b.value);
+  } else if (rawDatum.chartSorting() === 'desc') {
+    data.sort((a, b) => b.value - a.value);
   }
 
-  if (rawDatum.snippet.chartLimit()) {
-    _data = _data.slice(0, rawDatum.snippet.chartLimit());
+  if (rawDatum.chartLimit()) {
+    data = data.slice(0, rawDatum.chartLimit());
   }
 
-  return _data;
+  return data;
 };
 
 export const mapChartTransformer = function(rawDatum) {
-  let _data = [];
-  if (rawDatum.snippet.chartX() != null && rawDatum.snippet.chartYSingle() != null) {
-    let _idxRegion = -1;
-    let _idxValue = -1;
-    rawDatum.snippet.result.meta().forEach((col, idx) => {
-      if (col.name === rawDatum.snippet.chartX()) {
-        _idxRegion = idx;
+  let datum = [];
+  if (rawDatum.chartX() != null && rawDatum.chartYSingle() != null) {
+    let regionIndex = -1;
+    let valueIndex = -1;
+    rawDatum.meta().some((col, idx) => {
+      if (col.name === rawDatum.chartX()) {
+        regionIndex = idx;
       }
-      if (col.name === rawDatum.snippet.chartYSingle()) {
-        _idxValue = idx;
+      if (col.name === rawDatum.chartYSingle()) {
+        valueIndex = idx;
       }
+      return regionIndex !== -1 && valueIndex !== -1;
     });
 
-    $(rawDatum.counts()).each((cnt, item) => {
-      if (isNotNullForCharts(item[_idxValue]) && isNotNullForCharts(item[_idxRegion])) {
-        _data.push({
-          label: item[_idxRegion],
-          value: item[_idxValue],
+    rawDatum.data().forEach(item => {
+      if (isNotNullForCharts(item[valueIndex]) && isNotNullForCharts(item[regionIndex])) {
+        datum.push({
+          label: item[regionIndex],
+          value: item[valueIndex],
           obj: item
         });
       }
     });
   }
 
-  if (rawDatum.snippet.chartLimit()) {
-    _data = _data.slice(0, rawDatum.snippet.chartLimit());
+  if (rawDatum.chartLimit()) {
+    datum = datum.slice(0, rawDatum.chartLimit());
   }
 
-  return _data;
+  return datum;
 };
 
-// The leaflet map can freeze the browser with numbers outside the map
-const MIN_LAT = -90;
-const MAX_LAT = 90;
-const MIN_LNG = -180;
-const MAX_LNG = 180;
-
 export const leafletMapChartTransformer = function(rawDatum) {
-  let _data = [];
-  if (rawDatum.snippet.chartX() != null && rawDatum.snippet.chartYSingle() != null) {
-    let _idxLat = -1;
-    let _idxLng = -1;
-    let _idxLabel = -1;
-    let _idxHeat = -1;
-    rawDatum.snippet.result.meta().forEach((col, idx) => {
-      if (col.name === rawDatum.snippet.chartX()) {
-        _idxLat = idx;
+  let datum = [];
+  if (rawDatum.chartX() != null && rawDatum.chartYSingle() != null) {
+    let latIndex = -1;
+    let lngIndex = -1;
+    let labelIndex = -1;
+    let heatIndex = -1;
+    rawDatum.meta().some((col, idx) => {
+      if (col.name === rawDatum.chartX()) {
+        latIndex = idx;
       }
-      if (col.name === rawDatum.snippet.chartYSingle()) {
-        _idxLng = idx;
+      if (col.name === rawDatum.chartYSingle()) {
+        lngIndex = idx;
       }
-      if (col.name === rawDatum.snippet.chartMapLabel()) {
-        _idxLabel = idx;
+      if (col.name === rawDatum.chartMapLabel()) {
+        labelIndex = idx;
       }
-      if (col.name === rawDatum.snippet.chartMapHeat()) {
-        _idxHeat = idx;
+      if (col.name === rawDatum.chartMapHeat()) {
+        heatIndex = idx;
       }
+      return latIndex !== -1 && lngIndex !== -1 && labelIndex !== -1 && heatIndex !== -1;
     });
-    if (rawDatum.snippet.chartMapLabel() != null) {
-      $(rawDatum.counts()).each((cnt, item) => {
-        if (isNotNullForCharts(item[_idxLat]) && isNotNullForCharts(item[_idxLng])) {
-          _data.push({
-            lat: Math.min(Math.max(MIN_LAT, item[_idxLat]), MAX_LAT),
-            lng: Math.min(Math.max(MIN_LNG, item[_idxLng]), MAX_LNG),
-            label: hueUtils.html2text(item[_idxLabel]),
-            isHeat: rawDatum.snippet.chartMapType() === 'heat',
+    if (rawDatum.chartMapLabel() != null) {
+      rawDatum.data().forEach(item => {
+        if (isNotNullForCharts(item[latIndex]) && isNotNullForCharts(item[lngIndex])) {
+          datum.push({
+            lat: Math.min(Math.max(MIN_LAT, item[latIndex]), MAX_LAT),
+            lng: Math.min(Math.max(MIN_LNG, item[lngIndex]), MAX_LNG),
+            label: html2text(item[labelIndex]),
+            isHeat: rawDatum.chartMapType() === 'heat',
             intensity:
-              _idxHeat > -1 ? (item[_idxHeat] * 1 != NaN ? item[_idxHeat] * 1 : null) : null,
+              heatIndex > -1 ? (!isNaN(item[heatIndex] * 1) ? item[heatIndex] * 1 : null) : null,
             obj: item
           });
         }
       });
     } else {
-      $(rawDatum.counts()).each((cnt, item) => {
-        if (isNotNullForCharts(item[_idxLat]) && isNotNullForCharts(item[_idxLng])) {
-          _data.push({
-            lat: Math.min(Math.max(MIN_LAT, item[_idxLat]), MAX_LAT),
-            lng: Math.min(Math.max(MIN_LNG, item[_idxLng]), MAX_LNG),
-            isHeat: rawDatum.snippet.chartMapType() === 'heat',
+      rawDatum.data().forEach(item => {
+        if (isNotNullForCharts(item[latIndex]) && isNotNullForCharts(item[lngIndex])) {
+          datum.push({
+            lat: Math.min(Math.max(MIN_LAT, item[latIndex]), MAX_LAT),
+            lng: Math.min(Math.max(MIN_LNG, item[lngIndex]), MAX_LNG),
+            isHeat: rawDatum.chartMapType() === 'heat',
             intensity:
-              _idxHeat > -1 ? (item[_idxHeat] * 1 != NaN ? item[_idxHeat] * 1 : null) : null,
+              heatIndex > -1 ? (!isNaN(item[heatIndex] * 1) ? item[heatIndex] * 1 : null) : null,
             obj: item
           });
         }
@@ -154,119 +157,117 @@ export const leafletMapChartTransformer = function(rawDatum) {
     }
   }
 
-  if (rawDatum.snippet.chartLimit()) {
-    _data = _data.slice(0, rawDatum.snippet.chartLimit());
+  if (rawDatum.chartLimit()) {
+    datum = datum.slice(0, rawDatum.chartLimit());
   }
 
-  return _data;
+  return datum;
 };
 
 export const timelineChartTransformer = function(rawDatum) {
-  const _datum = [];
-  let _plottedSerie = 0;
+  const datum = [];
+  let plottedSeries = 0;
 
-  rawDatum.snippet.result.meta().forEach(meta => {
-    if (rawDatum.snippet.chartYMulti().indexOf(meta.name) > -1) {
+  rawDatum.meta().forEach(meta => {
+    if (rawDatum.chartYMulti().indexOf(meta.name) > -1) {
       const col = meta.name;
-      let _idxValue = -1;
-      let _idxLabel = -1;
-      rawDatum.snippet.result.meta().forEach((icol, idx) => {
-        if (icol.name === rawDatum.snippet.chartX()) {
-          _idxLabel = idx;
+      let valueIndex = -1;
+      let labelIndex = -1;
+      rawDatum.meta().some((icol, idx) => {
+        if (icol.name === rawDatum.chartX()) {
+          labelIndex = idx;
         }
         if (icol.name === col) {
-          _idxValue = idx;
+          valueIndex = idx;
         }
+        return labelIndex !== -1 && valueIndex !== -1;
       });
 
-      if (_idxValue > -1) {
-        let _data = [];
+      if (valueIndex > -1) {
+        let values = [];
         const colors = HueColors.cuiD3Scale();
-        $(rawDatum.counts()).each((cnt, item) => {
-          if (isNotNullForCharts(item[_idxLabel]) && isNotNullForCharts(item[_idxValue])) {
-            _data.push({
-              series: _plottedSerie,
-              x: new Date(moment(hueUtils.html2text(item[_idxLabel])).valueOf()),
-              y: item[_idxValue] * 1,
-              color: colors[_plottedSerie % colors.length],
+        rawDatum.data().forEach(item => {
+          if (isNotNullForCharts(item[labelIndex]) && isNotNullForCharts(item[valueIndex])) {
+            values.push({
+              series: plottedSeries,
+              x: new Date(moment(html2text(item[labelIndex])).valueOf()),
+              y: item[valueIndex] * 1,
+              color: colors[plottedSeries % colors.length],
               obj: item
             });
           }
         });
-        if (rawDatum.sorting === 'asc') {
-          _data.sort((a, b) => {
+        if (rawDatum.chartSorting() === 'asc') {
+          values.sort((a, b) => {
             return a.y - b.y;
           });
-        }
-        if (rawDatum.sorting === 'desc') {
-          _data.sort((a, b) => {
+        } else if (rawDatum.chartSorting() === 'desc') {
+          values.sort((a, b) => {
             return b.y - a.y;
           });
         }
-        if (rawDatum.snippet.chartLimit()) {
-          _data = _data.slice(0, rawDatum.snippet.chartLimit());
+        if (rawDatum.chartLimit()) {
+          values = values.slice(0, rawDatum.chartLimit());
         }
-        _datum.push({
+        datum.push({
           key: col,
-          values: _data
+          values: values
         });
-        _plottedSerie++;
+        plottedSeries++;
       }
     }
   });
 
-  return _datum;
+  return datum;
 };
 
 export const multiSerieChartTransformer = function(rawDatum) {
-  let _datum = [];
+  let datum = [];
 
-  console.log(rawDatum.snippet);
-  if (rawDatum.snippet.chartX() != null && rawDatum.snippet.chartYMulti().length > 0) {
-    let _plottedSerie = 0;
+  if (rawDatum.chartX() != null && rawDatum.chartYMulti().length > 0) {
+    let plottedSerie = 0;
 
-    if (typeof rawDatum.snippet.chartXPivot() !== 'undefined') {
-      let _idxValue = -1;
-      let _idxLabel = -1;
-      let _isXDate = false;
+    if (typeof rawDatum.chartXPivot() !== 'undefined') {
+      let valueIndex = -1;
+      let labelIndex = -1;
+      let isDate = false;
 
-      rawDatum.snippet.result.meta().forEach((icol, idx) => {
-        if (icol.name === rawDatum.snippet.chartX()) {
-          _isXDate = icol.type.toUpperCase().indexOf('DATE') > -1;
-          _idxLabel = idx;
+      rawDatum.meta().some((col, idx) => {
+        if (col.name === rawDatum.chartX()) {
+          isDate = col.type.toUpperCase().indexOf('DATE') > -1;
+          labelIndex = idx;
         }
-        if (icol.name === rawDatum.snippet.chartYSingle()) {
-          _idxValue = idx;
+        if (col.name === rawDatum.chartYSingle()) {
+          valueIndex = idx;
         }
+        return labelIndex !== -1 && valueIndex !== -1;
       });
 
-      rawDatum.snippet.result.meta().forEach((meta, cnt) => {
-        if (rawDatum.snippet.chartXPivot() === meta.name) {
-          const _idxPivot = cnt;
+      rawDatum.meta().forEach((meta, cnt) => {
+        if (rawDatum.chartXPivot() === meta.name) {
+          const pivotIndex = cnt;
           const colors = HueColors.cuiD3Scale();
-          let pivotValues = $.map(rawDatum.counts(), p => {
-            return p[_idxPivot];
-          });
+          let pivotValues = rawDatum.data().map(p => p[pivotIndex]);
           pivotValues = pivotValues.filter((item, pos) => {
             return pivotValues.indexOf(item) === pos;
           });
           pivotValues.forEach((val, pivotCnt) => {
-            const _data = [];
-            $(rawDatum.counts()).each((cnt, item) => {
-              if (item[_idxPivot] === val) {
-                if (isNotNullForCharts(item[_idxValue]) && isNotNullForCharts(item[_idxLabel])) {
-                  _data.push({
-                    x: _isXDate ? moment(item[_idxLabel]) : hueUtils.html2text(item[_idxLabel]),
-                    y: item[_idxValue] * 1,
+            const values = [];
+            rawDatum.data().forEach(item => {
+              if (item[pivotIndex] === val) {
+                if (isNotNullForCharts(item[valueIndex]) && isNotNullForCharts(item[labelIndex])) {
+                  values.push({
+                    x: isDate ? moment(item[labelIndex]) : html2text(item[labelIndex]),
+                    y: item[valueIndex] * 1,
                     color: colors[pivotCnt % colors.length],
                     obj: item
                   });
                 }
               }
             });
-            _datum.push({
-              key: hueUtils.html2text(val),
-              values: _data
+            datum.push({
+              key: html2text(val),
+              values: values
             });
           });
         }
@@ -275,7 +276,7 @@ export const multiSerieChartTransformer = function(rawDatum) {
       // fills in missing values
       let longest = 0;
       const allXValues = [];
-      _datum.forEach(d => {
+      datum.forEach(d => {
         d.values.forEach(val => {
           if (allXValues.indexOf(val.x) === -1) {
             allXValues.push(val.x);
@@ -283,14 +284,14 @@ export const multiSerieChartTransformer = function(rawDatum) {
         });
       });
 
-      _datum.forEach(d => {
+      datum.forEach(d => {
         allXValues.forEach(val => {
           if (
             !d.values.some(item => {
               return item.x === val;
             })
           ) {
-            const zeroObj = jQuery.extend({}, d.values[0]);
+            const zeroObj = $.extend({}, d.values[0]);
             zeroObj.y = 0;
             zeroObj.x = val;
             d.values.push(zeroObj);
@@ -303,9 +304,9 @@ export const multiSerieChartTransformer = function(rawDatum) {
 
       // this is to avoid D3 js errors when the data the user is trying to display is bogus
       if (allXValues.length < longest) {
-        _datum.forEach(d => {
+        datum.forEach(d => {
           for (let i = d.values.length; i < longest; i++) {
-            const zeroObj = jQuery.extend({}, d.values[0]);
+            const zeroObj = $.extend({}, d.values[0]);
             zeroObj.y = 0;
             zeroObj.x = '';
             d.values.push(zeroObj);
@@ -313,12 +314,12 @@ export const multiSerieChartTransformer = function(rawDatum) {
         });
       }
 
-      if (rawDatum.snippet.chartLimit()) {
-        _datum = _datum.slice(0, rawDatum.snippet.chartLimit());
+      if (rawDatum.chartLimit()) {
+        datum = datum.slice(0, rawDatum.chartLimit());
       }
 
-      if (rawDatum.sorting === 'desc') {
-        _datum.forEach(d => {
+      if (rawDatum.chartSorting() === 'desc') {
+        datum.forEach(d => {
           d.values.sort((a, b) => {
             if (a.x > b.x) {
               return -1;
@@ -330,7 +331,7 @@ export const multiSerieChartTransformer = function(rawDatum) {
           });
         });
       } else {
-        _datum.forEach(d => {
+        datum.forEach(d => {
           d.values.sort((a, b) => {
             if (a.x > b.x) {
               return 1;
@@ -343,123 +344,124 @@ export const multiSerieChartTransformer = function(rawDatum) {
         });
       }
     } else {
-      rawDatum.snippet.result.meta().forEach(meta => {
-        if (rawDatum.snippet.chartYMulti().indexOf(meta.name) > -1) {
+      rawDatum.meta().forEach(meta => {
+        if (rawDatum.chartYMulti().indexOf(meta.name) > -1) {
           const col = meta.name;
-          let _idxValue = -1;
-          let _idxLabel = -1;
-          let _isXDate = false;
-          rawDatum.snippet.result.meta().forEach((icol, idx) => {
-            if (icol.name === rawDatum.snippet.chartX()) {
-              _isXDate = icol.type.toUpperCase().indexOf('DATE') > -1;
-              _idxLabel = idx;
+          let valueIndex = -1;
+          let labelIndex = -1;
+          let isDate = false;
+          rawDatum.meta().some((icol, idx) => {
+            if (icol.name === rawDatum.chartX()) {
+              isDate = icol.type.toUpperCase().indexOf('DATE') > -1;
+              labelIndex = idx;
             }
             if (icol.name === col) {
-              _idxValue = idx;
+              valueIndex = idx;
             }
+            return labelIndex !== -1 && valueIndex !== -1;
           });
 
-          if (_idxValue > -1) {
-            let _data = [];
+          if (valueIndex > -1) {
+            let values = [];
             const colors = HueColors.cuiD3Scale();
-            $(rawDatum.counts()).each((cnt, item) => {
-              if (isNotNullForCharts(item[_idxValue]) && isNotNullForCharts(item[_idxLabel])) {
-                _data.push({
-                  series: _plottedSerie,
-                  x: _isXDate ? moment(item[_idxLabel]) : hueUtils.html2text(item[_idxLabel]),
-                  y: item[_idxValue] * 1,
-                  color: colors[cnt % colors.length],
+            rawDatum.data().forEach((item, index) => {
+              if (isNotNullForCharts(item[valueIndex]) && isNotNullForCharts(item[labelIndex])) {
+                values.push({
+                  series: plottedSerie,
+                  x: isDate ? moment(item[labelIndex]) : html2text(item[labelIndex]),
+                  y: item[valueIndex] * 1,
+                  color: colors[index % colors.length],
                   obj: item
                 });
               }
             });
-            if (rawDatum.sorting === 'asc') {
-              _data.sort((a, b) => {
+            if (rawDatum.chartSorting() === 'asc') {
+              values.sort((a, b) => {
                 return a.y - b.y;
               });
-            }
-            if (rawDatum.sorting === 'desc') {
-              _data.sort((a, b) => {
+            } else if (rawDatum.chartSorting() === 'desc') {
+              values.sort((a, b) => {
                 return b.y - a.y;
               });
             }
-            if (rawDatum.snippet.chartLimit()) {
-              _data = _data.slice(0, rawDatum.snippet.chartLimit());
+            if (rawDatum.chartLimit()) {
+              values = values.slice(0, rawDatum.chartLimit());
             }
-            _datum.push({
+            datum.push({
               key: col,
-              values: _data
+              values: values
             });
-            _plottedSerie++;
+            plottedSerie++;
           }
         }
       });
     }
   }
-  return _datum;
+  return datum;
 };
 
 export const scatterChartTransformer = function(rawDatum) {
-  const datum = {};
-
-  if (rawDatum.snippet.chartX() != null && rawDatum.snippet.chartYSingle() != null) {
-    let idxX = -1;
-    let idxY = -1;
-    let idxSize = -1;
-    let idxGroup = -1;
-    rawDatum.snippet.result.meta().forEach((icol, idx) => {
-      if (icol.name === rawDatum.snippet.chartX()) {
-        idxX = idx;
+  const datumIndex = {};
+
+  if (rawDatum.chartX() != null && rawDatum.chartYSingle() != null) {
+    let xIndex = -1;
+    let yIndex = -1;
+    let sizeIndex = -1;
+    let groupIndex = -1;
+    rawDatum.meta().some((col, idx) => {
+      if (col.name === rawDatum.chartX()) {
+        xIndex = idx;
       }
-      if (icol.name === rawDatum.snippet.chartYSingle()) {
-        idxY = idx;
+      if (col.name === rawDatum.chartYSingle()) {
+        yIndex = idx;
       }
-      if (icol.name === rawDatum.snippet.chartScatterSize()) {
-        idxSize = idx;
+      if (col.name === rawDatum.chartScatterSize()) {
+        sizeIndex = idx;
       }
-      if (icol.name === rawDatum.snippet.chartScatterGroup()) {
-        idxGroup = idx;
+      if (col.name === rawDatum.chartScatterGroup()) {
+        groupIndex = idx;
       }
+      return xIndex !== -1 && yIndex !== -1 && sizeIndex !== -1 && groupIndex !== -1;
     });
 
-    if (idxX > -1 && idxY > -1) {
+    if (xIndex > -1 && yIndex > -1) {
       const createAndAddToArray = function(key, item) {
-        if (!datum[key]) {
-          datum[key] = [];
+        if (!datumIndex[key]) {
+          datumIndex[key] = [];
         }
-        if (isNotNullForCharts(item[idxX]) && isNotNullForCharts(item[idxY])) {
-          datum[key].push({
-            x: item[idxX],
-            y: item[idxY],
+        if (isNotNullForCharts(item[xIndex]) && isNotNullForCharts(item[yIndex])) {
+          datumIndex[key].push({
+            x: item[xIndex],
+            y: item[yIndex],
             shape: 'circle',
-            size: idxSize > -1 ? item[idxSize] : 100,
+            size: sizeIndex > -1 ? item[sizeIndex] : 100,
             obj: item
           });
         }
       };
 
-      if (idxGroup > -1) {
-        $(rawDatum.counts()).each((cnt, item) => {
-          createAndAddToArray(item[idxGroup], item);
+      if (groupIndex > -1) {
+        rawDatum.data().forEach(item => {
+          createAndAddToArray(item[groupIndex], item);
         });
       } else {
-        $(rawDatum.counts()).each((cnt, item) => {
+        rawDatum.data().forEach(item => {
           createAndAddToArray('distro', item);
         });
       }
     }
   }
 
-  const returndDatum = [];
+  const datum = [];
 
-  Object.keys(datum).forEach(key => {
-    returndDatum.push({
+  Object.keys(datumIndex).forEach(key => {
+    datum.push({
       key: key,
-      values: rawDatum.snippet.chartLimit()
-        ? datum[key].slice(0, rawDatum.snippet.chartLimit())
-        : datum[key]
+      values: rawDatum.chartLimit()
+        ? datumIndex[key].slice(0, rawDatum.chartLimit())
+        : datumIndex[key]
     });
   });
 
-  return returndDatum;
+  return datum;
 };

+ 8 - 46
desktop/core/src/desktop/js/apps/notebook2/components/resultChart/ko.resultChart.js

@@ -389,7 +389,6 @@ class ResultChart extends DisposableComponent {
     super();
 
     this.data = params.data;
-    this.snippet = params.snippet;
     this.id = params.id;
     this.isResultSettingsVisible = params.isResultSettingsVisible;
     this.chartLimit = params.chartLimit;
@@ -407,6 +406,7 @@ class ResultChart extends DisposableComponent {
     this.chartYMulti = params.chartYMulti;
     this.chartYSingle = params.chartYSingle;
 
+    this.meta = params.meta;
     this.cleanedMeta = params.cleanedMeta;
     this.cleanedDateTimeMeta = params.cleanedDateTimeMeta;
     this.cleanedNumericMeta = params.cleanedNumericMeta;
@@ -456,13 +456,7 @@ class ResultChart extends DisposableComponent {
     });
 
     this.pieChartParams = ko.pureComputed(() => ({
-      data: {
-        counts: this.data,
-        sorting: this.chartSorting(),
-        snippet: this.snippet,
-        limit: this.chartLimit()
-      },
-      fqs: ko.observableArray(),
+      data: this,
       transformer: pieChartTransformer,
       maxWidth: 350,
       parentSelector: '.chart-container'
@@ -470,13 +464,7 @@ class ResultChart extends DisposableComponent {
 
     this.barChartParams = ko.pureComputed(() => ({
       skipWindowResize: true,
-      datum: {
-        counts: this.data,
-        sorting: this.chartSorting(),
-        snippet: this.snippet,
-        limit: this.chartLimit()
-      },
-      fqs: ko.observableArray(),
+      datum: this,
       hideSelection: true,
       enableSelection: false,
       hideStacked: this.hideStacked,
@@ -488,12 +476,7 @@ class ResultChart extends DisposableComponent {
     }));
 
     this.lineChartParams = ko.pureComputed(() => ({
-      datum: {
-        counts: this.data,
-        sorting: this.chartSorting(),
-        snippet: this.snippet,
-        limit: this.chartLimit()
-      },
+      datum: this,
       transformer: multiSerieChartTransformer,
       showControls: false,
       enableSelection: false
@@ -502,13 +485,7 @@ class ResultChart extends DisposableComponent {
     this.timeLineChartParams = ko.pureComputed(() => ({
       type: this.chartTimelineType,
       skipWindowResize: true,
-      datum: {
-        counts: this.data,
-        sorting: this.chartSorting(),
-        snippet: this.snippet,
-        limit: this.chartLimit()
-      },
-      fqs: ko.observableArray(),
+      datum: this,
       hideSelection: true,
       enableSelection: false,
       hideStacked: this.hideStacked,
@@ -518,12 +495,7 @@ class ResultChart extends DisposableComponent {
     }));
 
     this.leafletMapChartParams = ko.pureComputed(() => ({
-      datum: {
-        counts: this.data,
-        sorting: this.chartSorting(),
-        snippet: this.snippet,
-        limit: this.chartLimit()
-      },
+      datum: this,
       transformer: leafletMapChartTransformer,
       showControls: false,
       height: 380,
@@ -531,13 +503,7 @@ class ResultChart extends DisposableComponent {
     }));
 
     this.mapChartParams = ko.pureComputed(() => ({
-      data: {
-        counts: this.data,
-        sorting: this.chartSorting(),
-        snippet: this.snippet,
-        scope: this.chartScope(),
-        limit: this.chartLimit()
-      },
+      data: this,
       transformer: mapChartTransformer,
       isScale: true,
       showControls: false,
@@ -547,11 +513,7 @@ class ResultChart extends DisposableComponent {
     }));
 
     this.scatterChartParams = ko.pureComputed(() => ({
-      datum: {
-        counts: this.data,
-        snippet: this.snippet,
-        limit: this.chartLimit()
-      },
+      datum: this,
       transformer: scatterChartTransformer,
       maxWidth: 350,
       y: this.chartYSingle(),

+ 0 - 2
desktop/core/src/desktop/js/apps/notebook2/components/resultGrid/ko.resultGrid.js

@@ -14,8 +14,6 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 
-import ko from 'knockout';
-
 import componentUtils from 'ko/components/componentUtils';
 import DisposableComponent from 'ko/components/DisposableComponent';
 import I18n from 'utils/i18n';

+ 0 - 26
desktop/core/src/desktop/js/apps/notebook2/snippet.js

@@ -839,32 +839,6 @@ export default class Snippet {
     this.chartMapType = ko.observable(snippet.chartMapType || 'marker');
     this.chartMapLabel = ko.observable(snippet.chartMapLabel);
     this.chartMapHeat = ko.observable(snippet.chartMapHeat);
-    this.hideStacked = ko.pureComputed(() => this.chartYMulti().length <= 1); // To delete
-
-    this.hasDataForChart = ko.pureComputed(() => { // To delete
-      if (
-        this.chartType() === window.HUE_CHARTS.TYPES.BARCHART ||
-        this.chartType() === window.HUE_CHARTS.TYPES.LINECHART ||
-        this.chartType() === window.HUE_CHARTS.TYPES.TIMELINECHART
-      ) {
-        return (
-          typeof this.chartX() !== 'undefined' &&
-          this.chartX() !== null &&
-          this.chartYMulti().length > 0
-        );
-      }
-      return (
-        typeof this.chartX() !== 'undefined' &&
-        this.chartX() !== null &&
-        typeof this.chartYSingle() !== 'undefined' &&
-        this.chartYSingle() !== null
-      );
-    });
-
-    this.hasDataForChart.subscribe(() => { // To delete
-      this.chartX.notifySubscribers();
-      this.chartX.valueHasMutated();
-    });
 
     this.chartType.subscribe(() => {
       $(document).trigger('forceChartDraw', this);

+ 30 - 27
desktop/core/src/desktop/js/utils/hueUtils.js

@@ -16,7 +16,7 @@
 
 import $ from 'jquery';
 
-const bootstrapRatios = {
+export const bootstrapRatios = {
   span3() {
     const windowWidth = $(window).width();
     if (windowWidth >= 1200) {
@@ -49,7 +49,7 @@ const bootstrapRatios = {
  * @param selectors
  * @return {default}
  */
-const text2Url = selectors => {
+export const text2Url = selectors => {
   let i = 0;
   const len = selectors.length;
 
@@ -83,20 +83,20 @@ const text2Url = selectors => {
  * @param value
  * @return {*|jQuery}
  */
-const htmlEncode = value => {
+export const htmlEncode = value => {
   return $('<div/>')
     .text(value)
     .html();
 };
 
-const html2text = value => {
+export const html2text = value => {
   return $('<div/>')
     .html(value)
     .text()
     .replace(/\u00A0/g, ' ');
 };
 
-const goFullScreen = () => {
+export const goFullScreen = () => {
   if (
     !document.fullscreenElement &&
     !document.mozFullScreenElement &&
@@ -115,7 +115,7 @@ const goFullScreen = () => {
   }
 };
 
-const exitFullScreen = () => {
+export const exitFullScreen = () => {
   if (
     document.fullscreenElement ||
     document.mozFullScreenElement ||
@@ -134,7 +134,7 @@ const exitFullScreen = () => {
   }
 };
 
-const changeURL = (newURL, params) => {
+export const changeURL = (newURL, params) => {
   let extraSearch = '';
   if (params) {
     const newSearchKeys = Object.keys(params);
@@ -166,11 +166,11 @@ const changeURL = (newURL, params) => {
   window.history.pushState(null, null, url);
 };
 
-const replaceURL = newURL => {
+export const replaceURL = newURL => {
   window.history.replaceState(null, null, newURL);
 };
 
-const changeURLParameter = (param, value) => {
+export const changeURLParameter = (param, value) => {
   let newSearch = '';
   if (window.location.getParameter(param, true) !== null) {
     newSearch += '?';
@@ -198,11 +198,11 @@ const changeURLParameter = (param, value) => {
   changeURL(window.location.pathname + newSearch);
 };
 
-const removeURLParameter = param => {
+export const removeURLParameter = param => {
   changeURLParameter(param, null);
 };
 
-const parseHivePseudoJson = pseudoJson => {
+export const parseHivePseudoJson = pseudoJson => {
   // Hive returns a pseudo-json with parameters, like
   // "{Lead Developer=John Foo, Lead Developer Email=jfoo@somewhere.com, date=2013-07-11 }"
   const parsedParams = {};
@@ -217,14 +217,14 @@ const parseHivePseudoJson = pseudoJson => {
   return parsedParams;
 };
 
-const isOverflowing = element => {
+export const isOverflowing = element => {
   if (element instanceof $) {
     element = element[0];
   }
   return element.scrollHeight > element.clientHeight || element.scrollWidth > element.clientWidth;
 };
 
-const waitForRendered = (selector, condition, callback, timeout) => {
+export const waitForRendered = (selector, condition, callback, timeout) => {
   const $el = selector instanceof $ ? selector : $(selector);
   if (condition($el)) {
     callback($el);
@@ -237,7 +237,7 @@ const waitForRendered = (selector, condition, callback, timeout) => {
   }
 };
 
-const waitForObservable = (observable, callback) => {
+export const waitForObservable = (observable, callback) => {
   if (observable()) {
     callback(observable);
   } else {
@@ -250,7 +250,7 @@ const waitForObservable = (observable, callback) => {
   }
 };
 
-const waitForVariable = (variable, callback, timeout) => {
+export const waitForVariable = (variable, callback, timeout) => {
   if (variable) {
     callback(variable);
   } else {
@@ -260,7 +260,7 @@ const waitForVariable = (variable, callback, timeout) => {
   }
 };
 
-const scrollbarWidth = () => {
+export const scrollbarWidth = () => {
   const $parent = $('<div style="width:50px;height:50px;overflow:auto"><div/></div>').appendTo(
     'body'
   );
@@ -270,7 +270,7 @@ const scrollbarWidth = () => {
   return width;
 };
 
-const getSearchParameter = (search, name, returnNull) => {
+export const getSearchParameter = (search, name, returnNull) => {
   name = name.replace(/[\[]/, '\\[').replace(/[\]]/, '\\]');
   const regex = new RegExp('[\\?&]' + name + '=([^&#]*)'),
     results = regex.exec(search);
@@ -286,7 +286,7 @@ if (!window.location.getParameter) {
   };
 }
 
-const logError = error => {
+export const logError = error => {
   if (typeof window.console !== 'undefined' && typeof window.console.error !== 'undefined') {
     if (typeof error !== 'undefined') {
       console.error(error);
@@ -295,7 +295,7 @@ const logError = error => {
   }
 };
 
-const equalIgnoreCase = (a, b) => a && b && a.toLowerCase() === b.toLowerCase();
+export const equalIgnoreCase = (a, b) => a && b && a.toLowerCase() === b.toLowerCase();
 
 const deXSS = str => {
   if (typeof str !== 'undefined' && str !== null && typeof str === 'string') {
@@ -304,7 +304,7 @@ const deXSS = str => {
   return str;
 };
 
-const getStyleFromCSSClass = cssClass => {
+export const getStyleFromCSSClass = cssClass => {
   for (let i = 0; i < document.styleSheets.length; i++) {
     const cssClasses = document.styleSheets[i].rules || document.styleSheets[i].cssRules;
     for (let x = 0; x < cssClasses.length; x++) {
@@ -315,7 +315,7 @@ const getStyleFromCSSClass = cssClass => {
   }
 };
 
-const highlight = (text, searchTerm) => {
+export const highlight = (text, searchTerm) => {
   if (searchTerm === '' || text === '') {
     return text;
   }
@@ -343,7 +343,7 @@ const highlight = (text, searchTerm) => {
   return highLightedText;
 };
 
-const dfs = (node, callback) => {
+export const dfs = (node, callback) => {
   if (!node || typeof node !== 'object') {
     return;
   }
@@ -353,7 +353,7 @@ const dfs = (node, callback) => {
   });
 };
 
-const deleteAllEmptyStringKey = node => {
+export const deleteAllEmptyStringKey = node => {
   const fDeleteEmptyStringKey = function(node, key) {
     if (node[key] || typeof node[key] !== 'string') {
       return;
@@ -368,15 +368,16 @@ const s4 = () =>
     .toString(16)
     .substring(1);
 
-const UUID = () => s4() + s4() + '-' + s4() + '-' + s4() + '-' + s4() + '-' + s4() + s4() + s4();
+export const UUID = () =>
+  s4() + s4() + '-' + s4() + '-' + s4() + '-' + s4() + '-' + s4() + s4() + s4();
 
-const escapeOutput = str =>
+export const escapeOutput = str =>
   $('<span>')
     .text(str)
     .html()
     .trim();
 
-const getFileBrowseButton = (
+export const getFileBrowseButton = (
   inputElement,
   selectFolder,
   valueAccessor,
@@ -562,7 +563,7 @@ const stripHtml = html => {
   return tmp.textContent || tmp.innerText;
 };
 
-const stripHtmlFromFunctions = template => {
+export const stripHtmlFromFunctions = template => {
   // strips HTML from inside the functions
   let _tmpl = template;
   const _mustacheFunctions = _tmpl.match(/{{#(.[\s\S]*?){{\//g);
@@ -579,6 +580,8 @@ const stripHtmlFromFunctions = template => {
   return _tmpl;
 };
 
+export const sleep = async timeout => new Promise(resolve => setTimeout(resolve, timeout));
+
 export default {
   bootstrapRatios: bootstrapRatios,
   getFileBrowseButton: getFileBrowseButton,

+ 1 - 1
desktop/libs/notebook/src/notebook/templates/editor_components2.mako

@@ -1353,7 +1353,7 @@
           <!-- ko if: showChart-->
             <!-- ko component: { name: 'result-chart', params: {
               data: result.data,
-              snippet: $data,
+              meta: result.meta,
               id: id,
               isResultSettingsVisible: isResultSettingsVisible,
               chartLimit: chartLimit,