apply latest d3-time-format in plotly.js

Author: archmoj

package-lock.json

@@ -71,6 +71,7 @@
     "d3-force": "^1.2.1",
     "d3-hierarchy": "^1.1.9",
     "d3-interpolate": "^1.4.0",
+    "d3-time-format": "^2.2.3",
     "delaunay-triangulate": "^1.1.6",
     "es6-promise": "^4.2.8",
     "fast-isnumeric": "^1.1.4",

package.json

@@ -25,7 +25,7 @@ var EPOCHJD = constants.EPOCHJD;
 
 var Registry = require('../registry');
 
-var utcFormat = d3.time.format.utc;
+var utcFormat = require('d3-time-format').utcFormat;
 
 var DATETIME_REGEXP = /^\s*(-?\d\d\d\d|\d\d)(-(\d?\d)(-(\d?\d)([ Tt]([01]?\d|2[0-3])(:([0-5]\d)(:([0-5]\d(\.\d+)?))?(Z|z|[+\-]\d\d(:?\d\d)?)?)?)?)?)?\s*$/m;
 // special regex for chinese calendars to support yyyy-mmi-dd etc for intercalary months

src/lib/dates.js

@@ -9,6 +9,7 @@
 'use strict';
 
 var d3 = require('d3');
+var utcFormat = require('d3-time-format').utcFormat;
 var isNumeric = require('fast-isnumeric');
 
 var numConstants = require('../constants/numerical');
@@ -1082,7 +1083,7 @@ function templateFormatString(string, labels, d3locale) {
             }
 
             if(format[0] === '|') {
-                fmt = d3locale ? d3locale.timeFormat.utc : d3.time.format.utc;
+                fmt = d3locale ? d3locale.utcFormat : utcFormat;
                 var ms = lib.dateTime2ms(value);
                 value = lib.formatDate(ms, format.replace(TEMPLATE_STRING_FORMAT_SEPARATOR, ''), false, fmt);
             }

src/lib/index.js

@@ -9,6 +9,7 @@
 'use strict';
 
 var d3 = require('d3');
+var utcFormat = require('d3-time-format').utcFormat;
 var isNumeric = require('fast-isnumeric');
 
 var Lib = require('../../lib');
@@ -954,7 +955,7 @@ module.exports = function setConvert(ax, fullLayout) {
     // Fall back on default format for dummy axes that don't care about formatting
     var locale = fullLayout._d3locale;
     if(ax.type === 'date') {
-        ax._dateFormat = locale ? locale.timeFormat.utc : d3.time.format.utc;
+        ax._dateFormat = locale ? locale.utcFormat : utcFormat;
         ax._extraFormat = fullLayout._extraFormat;
     }
     // occasionally we need _numFormat to pass through

src/plots/cartesian/set_convert.js

@@ -9,6 +9,7 @@
 'use strict';
 
 var d3 = require('d3');
+var timeFormatLocale = require('d3-time-format').timeFormatLocale;
 var isNumeric = require('fast-isnumeric');
 
 var Registry = require('../registry');
@@ -723,7 +724,7 @@ function getFormatter(formatObj, separators) {
     formatObj.decimal = separators.charAt(0);
     formatObj.thousands = separators.charAt(1);
 
-    return d3.locale(formatObj);
+    return timeFormatLocale(formatObj);
 }
 
 function fillMetaTextHelpers(newFullData, newFullLayout) {

src/plots/plots.js

@@ -1,5 +1,6 @@
 var Plotly = require('@lib/index');
 var d3 = require('d3');
+var utcFormat = require('d3-time-format').utcFormat;
 
 var Plots = require('@src/plots/plots');
 var Lib = require('@src/lib');
@@ -5206,7 +5207,7 @@ function getZoomOutButton(gd) {
 }
 
 function getFormatter(format) {
-    return d3.time.format.utc(format);
+    return utcFormat(format);
 }
 
 describe('Test Axes.getTickformat', function() {

test/jasmine/tests/axes_test.js

@@ -3,6 +3,7 @@ var _ = Lib._;
 var Registry = require('@src/registry');
 
 var d3 = require('d3');
+var utcFormat = require('d3-time-format').utcFormat;
 
 var Plotly = require('@lib');
 var createGraphDiv = require('../assets/create_graph_div');
@@ -236,7 +237,7 @@ describe('localization', function() {
             expect(firstYLabel()).toBe('0~5');
             var d0 = new Date(0); // thursday, Jan 1 1970 (UTC)
             // sanity check that d0 is what we think...
-            expect(d3.time.format.utc('%a %b %A %B')(d0)).toBe('Thu Jan Thursday January');
+            expect(utcFormat('%a %b %A %B')(d0)).toBe('Thu Jan Thursday January');
             // full names were not overridden, so fall back on english
             expect(gd._fullLayout.xaxis._dateFormat('%a %b %A %B')(d0)).toBe('t !1 Thursday January');
         })