better handling of dates in charting as to avoid timezone issues & th…

…e ability to toggle between any axis in bar charts

.circleci/config.yml

@@ -5,7 +5,7 @@ defaults: &defaults
       CIRCLE_ARTIFACTS: /tmp/circleci-artifacts
       CIRCLE_TEST_REPORTS: /tmp/circleci-test-results
       CODECOV_TOKEN: b0d35139-0a75-427a-907b-2c78a762f8f0
-      VERSION: 1.6.9
+      VERSION: 1.6.10
       PANDOC_RELEASES_URL: https://github.com/jgm/pandoc/releases
     steps:
     - checkout

CHANGES.md

@@ -1,5 +1,9 @@
 ## Changelog
 
+### 1.6.10 (2020-1-12)
+ * better front-end handling of dates for charting as to avoid timezone issues
+ * the ability to switch between sorting any axis in bar charts
+
 ### 1.6.9 (2020-1-9)
  * bugfix for timezone issue around passing date filters to server for scatter charts in correlations popup
 

docker/2_7/Dockerfile

@@ -44,4 +44,4 @@ WORKDIR /app
 
 RUN set -eux \
   ; . /root/.bashrc \
-  ; easy_install dtale-1.6.9-py2.7.egg
+  ; easy_install dtale-1.6.10-py2.7.egg

docker/3_6/Dockerfile

@@ -44,4 +44,4 @@ WORKDIR /app
 
 RUN set -eux \
   ; . /root/.bashrc \
-  ; easy_install dtale-1.6.9-py3.7.egg
+  ; easy_install dtale-1.6.10-py3.7.egg

docs/source/conf.py

@@ -63,9 +63,9 @@
 # built documents.
 #
 # The short X.Y version.
-version = u'1.6.9'
+version = u'1.6.10'
 # The full version, including alpha/beta/rc tags.
-release = u'1.6.9'
+release = u'1.6.10'
 
 # The language for content autogenerated by Sphinx. Refer to documentation
 # for a list of supported languages.

dtale/views.py

@@ -885,16 +885,15 @@ def build_chart(data, x, y, group_col=None, agg=None, allow_duplicates=False, **
 
     def build_formatters(df):
         cols = grid_columns(df)
-        overrides = {'D': lambda f, i, c: f.add_timestamp(i, c)}
-        data_f = grid_formatter(cols, overrides=overrides, nan_display=None)
-        overrides['F'] = lambda f, i, c: f.add_float(i, c, precision=2)
+        data_f = grid_formatter(cols, nan_display=None)
+        overrides = {'F': lambda f, i, c: f.add_float(i, c, precision=2)}
         range_f = grid_formatter(cols, overrides=overrides, nan_display=None)
         return data_f, range_f
 
     def check_all_nan(df, cols):
         for col in cols:
             if df[col].isnull().all():
-                raise Exception('All data for column "b" is NaN!'.format(col))
+                raise Exception('All data for column "{}" is NaN!'.format(col))
 
     x_col = str('x')
     y_cols = make_list(y)
@@ -1062,6 +1061,7 @@ def get_scatter(data_id):
     :param date: string from flask.request.args['date'] date value in dateCol to filter dataframe to
     :returns: JSON {
         data: [{col1: 0.123, col2: 0.123, index: 1},...,{col1: 0.123, col2: 0.123, index: N}],
+        stats: {
         stats: {
             correlated: 50,
             only_in_s0: 1,
@@ -1088,7 +1088,7 @@ def get_scatter(data_id):
         if rolling:
             window = get_int_arg(request, 'window')
             idx = min(data[data[date_col] == date].index) + 1
-            data = data.iloc[(idx - window):idx]
+            data = data.iloc[max(idx - window, 0):idx]
             data = data[list(set(cols)) + [date_col]].dropna(how='any')
             y_cols.append(date_col)
         else:

package.json

@@ -1,6 +1,6 @@
 {
   "name": "dtale",
-  "version": "1.6.9",
+  "version": "1.6.10",
   "description": "Visualizer for Pandas Data Structures",
   "main": "main.js",
   "directories": {

setup.py

@@ -50,7 +50,7 @@ def run_tests(self):
 
 setup(
     name="dtale",
-    version="1.6.9",
+    version="1.6.10",
     author="MAN Alpha Technology",
     author_email="ManAlphaTech@man.com",
     description="Web Client for Visualizing Pandas Objects",

static/__tests__/chartUtils-test.jsx

@@ -12,12 +12,6 @@ const GRADIENT_FUNCS = [
   "pointHoverBorderColor",
 ];
 
-function updateDataCfg(prop, data, cfg) {
-  cfg.data.all[prop] = data;
-  cfg.min[prop] = data[0];
-  cfg.max[prop] = data[data.length - 1];
-}
-
 describe("chartUtils tests", () => {
   beforeAll(() => {
     const mockChartUtils = withGlobalJquery(() => (ctx, cfg) => {
@@ -132,169 +126,6 @@ describe("chartUtils tests", () => {
     done();
   });
 
-  test("chartUtils: testing timestampLabel", done => {
-    const { timestampLabel } = require("../chartUtils").default;
-
-    t.equal(timestampLabel(1514782800000), "2018-01-01", "should return date string");
-    const tsLabel = timestampLabel(1514786400000);
-    t.ok(tsLabel === "2018-01-01 1:00:00 am", "should return timestamp string");
-    done();
-  });
-
-  test("chartUtils: testing createLineCfg with date axes", done => {
-    const { createLineCfg } = require("../chartUtils").default;
-
-    const data = {
-      data: {
-        all: {
-          y: [0.1, 0.2, 0.3, 0.4, 0.5, 0.6],
-          x: [1514782800000, 1514786400000, 1514790000000, 1514793600000, 1514797200000, 1514800800000],
-        },
-      },
-      min: { x: 1514782800000, y: 0.1 },
-      max: { x: 1514800800000, y: 0.6 },
-      x: "x",
-      y: "y",
-    };
-    const columns = [
-      { name: "x", dtype: "datetime64[ns]" },
-      { name: "y", dtype: "float64" },
-    ];
-    let cfg = createLineCfg(data, {
-      columns,
-      x: "x",
-      y: "y",
-      configHandler: cfg => cfg,
-    });
-    t.deepEqual(
-      cfg.options.scales.xAxes[0].time,
-      { unit: "hour", stepSize: 4, displayFormats: { hour: "YYYYMMDD hA" } },
-      "should build hourly config"
-    );
-    t.equal(cfg.options.tooltips.callbacks.label({ yLabel: 0.1, datasetIndex: 0 }, cfg.data), "0.1");
-    updateDataCfg(
-      "x",
-      [1578200400000, 1578805200000, 1579410000000, 1580014800000, 1580619600000, 1581224400000],
-      data
-    );
-    cfg = createLineCfg(data, {
-      columns,
-      x: "x",
-      y: "y",
-      configHandler: cfg => cfg,
-    });
-    t.deepEqual(
-      cfg.options.scales.xAxes[0].time,
-      { unit: "day", stepSize: 1, displayFormats: { day: "YYYYMMDD" } },
-      "should build daily config"
-    );
-    updateDataCfg(
-      "x",
-      [1578200400000, 1578805200000, 1579410000000, 1592107200000, 1592712000000, 1593316800000],
-      data
-    );
-    cfg = createLineCfg(data, {
-      columns,
-      x: "x",
-      y: "y",
-      configHandler: cfg => cfg,
-    });
-    t.deepEqual(
-      cfg.options.scales.xAxes[0].time,
-      { unit: "week", stepSize: 1, displayFormats: { week: "YYYYMMDD" } },
-      "should build weekly config"
-    );
-    updateDataCfg(
-      "x",
-      [1580446800000, 1582952400000, 1585627200000, 1635652800000, 1638248400000, 1640926800000],
-      data
-    );
-    cfg = createLineCfg(data, {
-      columns,
-      x: "x",
-      y: "y",
-      configHandler: cfg => cfg,
-    });
-    t.deepEqual(
-      cfg.options.scales.xAxes[0].time,
-      { unit: "month", stepSize: 1, displayFormats: { month: "YYYYMMDD" } },
-      "should build monthly config"
-    );
-    updateDataCfg(
-      "x",
-      [1585627200000, 1593489600000, 1601438400000, 1719720000000, 1727668800000, 1735621200000],
-      data
-    );
-    cfg = createLineCfg(data, {
-      columns,
-      x: "x",
-      y: "y",
-      configHandler: cfg => cfg,
-    });
-    t.deepEqual(
-      cfg.options.scales.xAxes[0].time,
-      { unit: "quarter", stepSize: 1, displayFormats: { quarter: "YYYYMMDD" } },
-      "should build quarterly config"
-    );
-    updateDataCfg(
-      "x",
-      [1609390800000, 1640926800000, 1672462800000, 1988082000000, 2019618000000, 2051154000000],
-      data
-    );
-    cfg = createLineCfg(data, {
-      columns,
-      x: "x",
-      y: "y",
-      configHandler: cfg => cfg,
-    });
-    t.deepEqual(
-      cfg.options.scales.xAxes[0].time,
-      { unit: "year", stepSize: 1, displayFormats: { year: "YYYYMMDD" } },
-      "should build yearly config"
-    );
-    done();
-  });
-
-  test("chartUtils: testing createLineCfg with date y-axis", done => {
-    const { createLineCfg, createScatterCfg } = require("../chartUtils").default;
-
-    const data = {
-      data: {
-        all: {
-          x: [0.1, 0.2, 0.3, 0.4, 0.5, 0.6],
-          y: [1514782800000, 1514786400000, 1514790000000, 1514793600000, 1514797200000, 1514800800000],
-        },
-      },
-      min: { y: 1514782800000, x: 0.1 },
-      max: { y: 1514800800000, x: 0.6 },
-      x: "x",
-      y: "y",
-    };
-    const columns = [
-      { name: "y", dtype: "datetime64[ns]" },
-      { name: "x", dtype: "float64" },
-    ];
-    let cfg = createLineCfg(data, {
-      columns,
-      x: "x",
-      y: "y",
-      configHandler: cfg => cfg,
-    });
-    t.deepEqual(
-      cfg.options.scales.yAxes[0].time,
-      { unit: "hour", stepSize: 4, displayFormats: { hour: "YYYYMMDD hA" } },
-      "should build hourly config for y-axis"
-    );
-    cfg = createScatterCfg(data, {
-      columns,
-      x: "x",
-      y: "y",
-      configHandler: cfg => cfg,
-    });
-    t.ok(cfg.data.datasets[0].data[0].y == 1514782800000);
-    done();
-  });
-
   test("chartUtils: testing buildTicks", done => {
     const { buildTicks } = require("../chartUtils").default;
     const range = { min: { y: 0.1 }, max: { y: 0.6 } };

static/__tests__/data/charts-grouped.json

@@ -2,16 +2,16 @@
   "data": {
     "val1": {
       "x": [
-        1545109200000,
-        1545195600000,
-        1545282000000,
-        1545368400000,
-        1545454800000,
-        1545541200000,
-        1545627600000,
-        1545714000000,
-        1545800400000,
-        1545886800000
+        "2018-12-18",
+        "2018-12-19",
+        "2018-12-20",
+        "2018-12-21",
+        "2018-12-22",
+        "2018-12-23",
+        "2018-12-24",
+        "2018-12-25",
+        "2018-12-26",
+        "2018-12-27"
       ],
       "col1": [
         41,
@@ -28,16 +28,16 @@
     },
     "val2": {
       "x": [
-        1545109200000,
-        1545195600000,
-        1545282000000,
-        1545368400000,
-        1545454800000,
-        1545541200000,
-        1545627600000,
-        1545714000000,
-        1545800400000,
-        1545886800000
+        "2018-12-18",
+        "2018-12-19",
+        "2018-12-20",
+        "2018-12-21",
+        "2018-12-22",
+        "2018-12-23",
+        "2018-12-24",
+        "2018-12-25",
+        "2018-12-26",
+        "2018-12-27"
       ],
       "col1": [
         41,
@@ -53,8 +53,8 @@
       ]
     }
   },
-  "max": {"col1": 41, "col4": 1545109200000},
-  "min": {"col1": 41, "col4": 1545800400000},
+  "max": {"col1": 41, "x": "2018-12-18"},
+  "min": {"col1": 41, "x": "2018-12-27"},
   "x": "col4",
   "y": "col1"
 }

static/__tests__/data/charts.json

@@ -2,15 +2,15 @@
   "data": {
     "all": {
       "x": [
-        1545109200000,
-        1545195600000,
-        1545282000000,
-        1545368400000,
-        1545454800000,
-        1545541200000,
-        1545627600000,
-        1545714000000,
-        1545800400000
+        "2018-12-18",
+        "2018-12-19",
+        "2018-12-20",
+        "2018-12-21",
+        "2018-12-22",
+        "2018-12-23",
+        "2018-12-24",
+        "2018-12-25",
+        "2018-12-26"
       ],
       "col1": [
         41,
@@ -26,8 +26,8 @@
       ]
     }
   },
-  "max": {"col1": 41, "col4": 1545109200000},
-  "min": {"col1": 41, "col4": 1545800400000},
+  "max": {"col1": 41, "x": "2018-12-26"},
+  "min": {"col1": 41, "x": "2018-12-18"},
   "x": "col4",
   "y": "col1"
 }