plottable 3.12.0 → 4.0.0

package/build/src/plots/linePlot.d.ts

@@ -3,7 +3,6 @@
  * @license MIT
  */
 import * as d3 from "d3";
-import * as d3Shape from "d3-shape";
 import { Dataset } from "../core/dataset";
 import { AttributeToProjector, IAccessor, IRangeProjector, Point, Projector } from "../core/interfaces";
 import * as Drawers from "../drawers";
@@ -30,7 +29,7 @@ export declare const CurveName: {
     cardinalClosed: "cardinalClosed";
     monotone: "monotone";
 };
-export declare type CurveName = keyof typeof CurveName;
+export type CurveName = keyof typeof CurveName;
 export declare class Line<X> extends XYPlot<X, number> {
     private _curve;
     private _autorangeSmooth;
@@ -141,7 +140,7 @@ export declare class Line<X> extends XYPlot<X, number> {
      * @returns {Line<[number,number]>}
      * @private
      */
-    protected _d3LineFactory(dataset: Dataset, xProjector?: IAccessor<any>, yProjector?: IAccessor<any>): d3Shape.Line<any>;
+    protected _d3LineFactory(dataset: Dataset, xProjector?: IAccessor<any>, yProjector?: IAccessor<any>): d3.Line<any>;
     protected _getCurveFactory(): d3.CurveFactory | d3.CurveFactoryLineOnly;
     /**
      * Line plots represent each dataset with a single <path> element, so we wrap the dataset data in a single element array.

package/build/src/plots/linePlot.js

@@ -14,6 +14,7 @@ var lineDrawer_1 = require("../drawers/lineDrawer");
 var Scales = require("../scales");
 var quantitativeScale_1 = require("../scales/quantitativeScale");
 var Utils = require("../utils");
+var d3ShapeUtils_1 = require("../utils/d3ShapeUtils");
 var makeEnum_1 = require("../utils/makeEnum");
 var Plots = require("./");
 var plot_1 = require("./plot");
@@ -52,7 +53,7 @@ exports.CurveName = (0, makeEnum_1.makeEnum)([
     "monotone",
 ]);
 var Line = /** @class */ (function (_super) {
-    (0, tslib_1.__extends)(Line, _super);
+    tslib_1.__extends(Line, _super);
     /**
      * A Line Plot draws line segments starting from the first data point to the next.
      *
@@ -356,7 +357,7 @@ var Line = /** @class */ (function (_super) {
             var positionY = yProjector(d, i, dataset);
             return Utils.Math.isValidNumber(positionX) && Utils.Math.isValidNumber(positionY);
         };
-        return d3.line()
+        return (0, d3ShapeUtils_1.withFullPrecision)(d3.line())
             .x(function (innerDatum, innerIndex) { return xProjector(innerDatum, innerIndex, dataset); })
             .y(function (innerDatum, innerIndex) { return yProjector(innerDatum, innerIndex, dataset); })
             .curve(this._getCurveFactory())

package/build/src/plots/piePlot.js

@@ -15,10 +15,11 @@ var Utils = require("../utils");
 var arcDrawer_1 = require("../drawers/arcDrawer");
 var arcOutlineDrawer_1 = require("../drawers/arcOutlineDrawer");
 var drawer_1 = require("../drawers/drawer");
+var d3ShapeUtils_1 = require("../utils/d3ShapeUtils");
 var windowUtils_1 = require("../utils/windowUtils");
 var plot_1 = require("./plot");
 var Pie = /** @class */ (function (_super) {
-    (0, tslib_1.__extends)(Pie, _super);
+    tslib_1.__extends(Pie, _super);
     /**
      * @constructor
      */
@@ -211,7 +212,7 @@ var Pie = /** @class */ (function (_super) {
         var innerRadiusAccessor = plot_1.Plot._scaledAccessor(this.innerRadius());
         var outerRadiusAccessor = plot_1.Plot._scaledAccessor(this.outerRadius());
         attrToProjector["d"] = function (datum, index, ds) {
-            return d3.arc().innerRadius(innerRadiusAccessor(datum, index, ds))
+            return (0, d3ShapeUtils_1.withFullPrecision)(d3.arc()).innerRadius(innerRadiusAccessor(datum, index, ds))
                 .outerRadius(outerRadiusAccessor(datum, index, ds))
                 .startAngle(_this._startAngles[index])
                 .endAngle(_this._endAngles[index])(datum, index);

package/build/src/plots/plot.d.ts

@@ -17,7 +17,7 @@ export declare const Renderer: {
     canvas: "canvas";
     svg: "svg";
 };
-export declare type Renderer = keyof typeof Renderer;
+export type Renderer = keyof typeof Renderer;
 export declare class Plot extends Component {
     static OPTIMIZE_MEMOIZE_PROJECTORS: boolean;
     static getTotalDrawTime(data: any[], drawSteps: Drawers.DrawStep[]): number;
@@ -93,7 +93,7 @@ export declare class Plot extends Component {
      * registered by the user. By default, only attrs are passed to the
      * _generateDrawStep's attrToProjector; properties are not.
      */
-    protected _propertyBindings: d3.Map<Plots.IAccessorScaleBinding<any, any>>;
+    protected _propertyBindings: Map<string, Plots.IAccessorScaleBinding<any, any>>;
     /**
      * Mapping from property names to the extents ([min, max]) values that that
      * property takes on.

package/build/src/plots/plot.js

@@ -20,7 +20,7 @@ var makeEnum_1 = require("../utils/makeEnum");
 var deferredRenderer_1 = require("./deferredRenderer");
 exports.Renderer = (0, makeEnum_1.makeEnum)(["svg", "canvas"]);
 var Plot = /** @class */ (function (_super) {
-    (0, tslib_1.__extends)(Plot, _super);
+    tslib_1.__extends(Plot, _super);
     /**
      * A Plot draws some visualization of the inputted Datasets.
      *
@@ -60,13 +60,13 @@ var Plot = /** @class */ (function (_super) {
         _this._overflowHidden = true;
         _this.addClass("plot");
         _this._datasetToDrawer = new Utils.Map();
-        _this._attrBindings = d3.map();
+        _this._attrBindings = new Map();
         _this._includedValuesProvider = function (scale, ignoreAnchorState) {
             return _this._includedValuesForScale(scale, ignoreAnchorState);
         };
         _this._renderCallback = function () { return _this.render(); };
         _this._onDatasetUpdateCallback = function () { return _this._onDatasetUpdate(); };
-        _this._propertyBindings = d3.map();
+        _this._propertyBindings = new Map();
         var mainAnimator = new Animators.Easing().maxTotalDuration(Plot._ANIMATION_MAX_DURATION);
         _this.animator(Plots.Animator.MAIN, mainAnimator);
         _this.animator(Plots.Animator.RESET, new Animators.Null());
@@ -274,7 +274,7 @@ var Plot = /** @class */ (function (_super) {
     };
     Plot.prototype._generateAttrToProjector = function () {
         var h = {};
-        this._attrBindings.each(function (binding, attr) {
+        this._attrBindings.forEach(function (binding, attr) {
             h[attr] = Plot._scaledAccessor(binding);
         });
         var propertyProjectors = this._propertyProjectors();
@@ -315,13 +315,13 @@ var Plot = /** @class */ (function (_super) {
      */
     Plot.prototype._scales = function () {
         var scales = [];
-        this._attrBindings.each(function (binding, attr) {
+        this._attrBindings.forEach(function (binding, attr) {
             var scale = binding.scale;
             if (scale != null && scales.indexOf(scale) === -1) {
                 scales.push(scale);
             }
         });
-        this._propertyBindings.each(function (binding, property) {
+        this._propertyBindings.forEach(function (binding, property) {
             var scale = binding.scale;
             if (scale != null && scales.indexOf(scale) === -1) {
                 scales.push(scale);
@@ -375,7 +375,7 @@ var Plot = /** @class */ (function (_super) {
             return [];
         }
         var includedValues = [];
-        this._attrBindings.each(function (binding, attr) {
+        this._attrBindings.forEach(function (binding, attr) {
             if (binding.scale === scale) {
                 var extents = _this.getExtentsForAttr(attr);
                 if (extents != null) {
@@ -383,7 +383,7 @@ var Plot = /** @class */ (function (_super) {
                 }
             }
         });
-        this._propertyBindings.each(function (binding, property) {
+        this._propertyBindings.forEach(function (binding, property) {
             if (binding.scale === scale) {
                 var extents = _this.getExtentsForProperty(property);
                 if (extents != null) {
@@ -511,7 +511,7 @@ var Plot = /** @class */ (function (_super) {
             var _loop_1 = function (datumIndex) {
                 var datum = data[datumIndex];
                 var position = _this._pixelPoint(datum, datumIndex, dataset);
-                if (Utils.Math.isNaN(position.x) || Utils.Math.isNaN(position.y)) {
+                if (!Utils.Math.isValidNumber(position.x) || !Utils.Math.isValidNumber(position.y)) {
                     return "continue";
                 }
                 var plot = _this;

package/build/src/plots/rectanglePlot.js

@@ -6,7 +6,6 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Rectangle = void 0;
 var tslib_1 = require("tslib");
-var d3 = require("d3");
 var Typesettable = require("typesettable");
 var Animators = require("../animators");
 var Drawers = require("../drawers");
@@ -17,7 +16,7 @@ var Utils = require("../utils");
 var plot_1 = require("./plot");
 var xyPlot_1 = require("./xyPlot");
 var Rectangle = /** @class */ (function (_super) {
-    (0, tslib_1.__extends)(Rectangle, _super);
+    tslib_1.__extends(Rectangle, _super);
     /**
      * A Rectangle Plot displays rectangles based on the data.
      * The left and right edges of each rectangle can be set with x() and x2().
@@ -227,9 +226,9 @@ var Rectangle = /** @class */ (function (_super) {
         }
         else {
             var accessor_1 = scale === this.x().scale ? this.x().accessor : this.y().accessor;
-            var accessorData = d3.set(Utils.Array.flatten(this.datasets().map(function (dataset) {
+            var accessorData = Utils.Array.uniq(Utils.Array.flatten(this.datasets().map(function (dataset) {
                 return dataset.data().map(function (d, i) { return accessor_1(d, i, dataset).valueOf(); });
-            }))).values().map(function (value) { return +value; });
+            }))).map(function (value) { return +value; });
             // Get the absolute difference between min and max
             var min = Utils.Math.min(accessorData, 0);
             var max = Utils.Math.max(accessorData, 0);

package/build/src/plots/scatterPlot.js

@@ -20,7 +20,7 @@ var Plots = require("./");
 var plot_1 = require("./plot");
 var xyPlot_1 = require("./xyPlot");
 var Scatter = /** @class */ (function (_super) {
-    (0, tslib_1.__extends)(Scatter, _super);
+    tslib_1.__extends(Scatter, _super);
     /**
      * A Scatter Plot draws a symbol at each data point.
      *
@@ -166,7 +166,7 @@ var Scatter = /** @class */ (function (_super) {
                 var labelArea = _a.labelArea;
                 labelArea.attr("class", null)
                     .classed(Scatter._LABEL_AREA_CLASS, true)
-                    .classed("label-" + _this._labelFontSize, true);
+                    .classed("label-".concat(_this._labelFontSize), true);
             });
             return this.render();
         }
@@ -185,7 +185,7 @@ var Scatter = /** @class */ (function (_super) {
         var drawer = _super.prototype._createNodesForDataset.call(this, dataset);
         var labelArea = this._renderArea.append("g")
             .classed(Scatter._LABEL_AREA_CLASS, true)
-            .classed("label-" + this._labelFontSize, true);
+            .classed("label-".concat(this._labelFontSize), true);
         var context = new Typesettable.SvgContext(labelArea.node());
         var measurer = new Typesettable.CacheMeasurer(context);
         var writer = new Typesettable.Writer(measurer, context);
@@ -262,7 +262,7 @@ var Scatter = /** @class */ (function (_super) {
     };
     Scatter.prototype._createLabelContainer = function (labelArea, labelContainerOrigin, labelOrigin, measurement) {
         var labelContainer = labelArea.append("g")
-            .attr("transform", "translate(" + labelContainerOrigin.x + ", " + labelContainerOrigin.y + ")");
+            .attr("transform", "translate(".concat(labelContainerOrigin.x, ", ").concat(labelContainerOrigin.y, ")"));
         labelContainer.classed("on-bar-label", true);
         return labelContainer;
     };

package/build/src/plots/segmentPlot.js

@@ -14,7 +14,7 @@ var windowUtils_1 = require("../utils/windowUtils");
 var plot_1 = require("./plot");
 var xyPlot_1 = require("./xyPlot");
 var Segment = /** @class */ (function (_super) {
-    (0, tslib_1.__extends)(Segment, _super);
+    tslib_1.__extends(Segment, _super);
     /**
      * A Segment Plot displays line segments based on the data.
      *

package/build/src/plots/stackedAreaPlot.js

@@ -6,14 +6,13 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.StackedArea = void 0;
 var tslib_1 = require("tslib");
-var d3 = require("d3");
 var Animators = require("../animators");
 var index_1 = require("../memoize/index");
 var Utils = require("../utils");
 var areaPlot_1 = require("./areaPlot");
 var plot_1 = require("./plot");
 var StackedArea = /** @class */ (function (_super) {
-    (0, tslib_1.__extends)(StackedArea, _super);
+    tslib_1.__extends(StackedArea, _super);
     /**
      * @constructor
      */
@@ -152,7 +151,7 @@ var StackedArea = /** @class */ (function (_super) {
         var datasets = this.datasets();
         var keyAccessor = this.x().accessor;
         var keySets = datasets.map(function (dataset) {
-            return d3.set(dataset.data().map(function (datum, i) { return Utils.Stacking.normalizeKey(keyAccessor(datum, i, dataset)); })).values();
+            return Utils.Array.uniq(dataset.data().map(function (datum, i) { return Utils.Stacking.normalizeKey(keyAccessor(datum, i, dataset)); }));
         });
         var domainKeys = StackedArea._domainKeys(datasets, keyAccessor);
         if (keySets.some(function (keySet) { return keySet.length !== domainKeys.length; })) {
@@ -169,16 +168,16 @@ var StackedArea = /** @class */ (function (_super) {
      * @return {string[]} An array of stringified keys
      */
     StackedArea._domainKeys = function (datasets, keyAccessor) {
-        var domainKeys = d3.set();
+        var domainKeys = new Set();
         datasets.forEach(function (dataset) {
             var data = dataset.data();
             var dataLen = data.length;
             for (var index = 0; index < dataLen; index++) {
                 var datum = data[index];
-                domainKeys.add(keyAccessor(datum, index, dataset));
+                domainKeys.add(String(keyAccessor(datum, index, dataset)));
             }
         });
-        return domainKeys.values();
+        return Array.from(domainKeys);
     };
     StackedArea.prototype._coordinateProjectors = function () {
         var _this = this;

package/build/src/plots/stackedBarPlot.js

@@ -13,7 +13,7 @@ var Utils = require("../utils");
 var barPlot_1 = require("./barPlot");
 var plot_1 = require("./plot");
 var StackedBar = /** @class */ (function (_super) {
-    (0, tslib_1.__extends)(StackedBar, _super);
+    tslib_1.__extends(StackedBar, _super);
     /**
      * A StackedBar Plot stacks bars across Datasets based on the primary value of the bars.
      *   On a vertical StackedBar Plot, the bars with the same X value are stacked.
@@ -65,7 +65,7 @@ var StackedBar = /** @class */ (function (_super) {
                 // clearing to remove outdated font-size classes
                 this._labelArea.attr("class", null)
                     .classed(barPlot_1.Bar._LABEL_AREA_CLASS, true)
-                    .classed("label-" + this._labelFontSize, true);
+                    .classed("label-".concat(this._labelFontSize), true);
             }
             _super.prototype.labelFontSize.call(this, fontSize);
             return this;
@@ -76,7 +76,7 @@ var StackedBar = /** @class */ (function (_super) {
         this._labelArea = this._renderArea
             .append("g")
             .classed(barPlot_1.Bar._LABEL_AREA_CLASS, true)
-            .classed("label-" + this._labelFontSize, true);
+            .classed("label-".concat(this._labelFontSize), true);
         var context = new Typesettable.SvgContext(this._labelArea.node());
         this._measurer = new Typesettable.CacheMeasurer(context);
         this._writer = new Typesettable.Writer(this._measurer, context);
@@ -107,7 +107,7 @@ var StackedBar = /** @class */ (function (_super) {
                 ? width > barThickness
                 : height > barThickness;
             if (!textTooLong) {
-                var labelContainer = _this._labelArea.append("g").attr("transform", "translate(" + x + ", " + y + ")");
+                var labelContainer = _this._labelArea.append("g").attr("transform", "translate(".concat(x, ", ").concat(y, ")"));
                 labelContainer.classed("stacked-bar-label", true);
                 var writeOptions = {
                     xAlign: "center",

package/build/src/plots/waterfallPlot.js

@@ -10,7 +10,7 @@ var Utils = require("../utils");
 var barPlot_1 = require("./barPlot");
 var plot_1 = require("./plot");
 var Waterfall = /** @class */ (function (_super) {
-    (0, tslib_1.__extends)(Waterfall, _super);
+    tslib_1.__extends(Waterfall, _super);
     function Waterfall() {
         var _this = _super.call(this) || this;
         _this._connectorsEnabled = false;

package/build/src/plots/xyPlot.js

@@ -11,7 +11,7 @@ var Utils = require("../utils");
 var deferredRenderer_1 = require("./deferredRenderer");
 var plot_1 = require("./plot");
 var XYPlot = /** @class */ (function (_super) {
-    (0, tslib_1.__extends)(XYPlot, _super);
+    tslib_1.__extends(XYPlot, _super);
     /**
      * An XYPlot is a Plot that displays data along two primary directions, X and Y.
      *
@@ -29,10 +29,10 @@ var XYPlot = /** @class */ (function (_super) {
                 return;
             }
             if (_this._renderArea != null) {
-                _this._renderArea.attr("transform", "translate(" + tx + ", " + ty + ") scale(" + sx + ", " + sy + ")");
+                _this._renderArea.attr("transform", "translate(".concat(tx, ", ").concat(ty, ") scale(").concat(sx, ", ").concat(sy, ")"));
             }
             if (_this._canvas != null) {
-                _this._canvas.style("transform", "translate(" + tx + "px, " + ty + "px) scale(" + sx + ", " + sy + ")");
+                _this._canvas.style("transform", "translate(".concat(tx, "px, ").concat(ty, "px) scale(").concat(sx, ", ").concat(sy, ")"));
             }
         };
         _this.addClass("xy-plot");

package/build/src/scales/categoryScale.js

@@ -12,7 +12,7 @@ var Utils = require("../utils");
 var scale_1 = require("./scale");
 var TRANSFORMATION_SPACE = [0, 1];
 var Category = /** @class */ (function (_super) {
-    (0, tslib_1.__extends)(Category, _super);
+    tslib_1.__extends(Category, _super);
     /**
      * A Category Scale maps strings to numbers.
      *
@@ -23,7 +23,7 @@ var Category = /** @class */ (function (_super) {
         _this._range = [0, 1];
         _this._d3Scale = d3.scaleBand();
         _this._d3Scale.range(TRANSFORMATION_SPACE);
-        _this._d3TransformationScale = d3.scaleLinear();
+        _this._d3TransformationScale = d3.scaleLinear().unknown(NaN);
         _this._d3TransformationScale.domain(TRANSFORMATION_SPACE);
         var d3InnerPadding = 0.3;
         _this._innerPadding = Category._convertToPlottableInnerPadding(d3InnerPadding);

package/build/src/scales/colorScale.js

@@ -44,8 +44,27 @@ var ImplicitSeriesTracker = /** @class */ (function () {
     };
     return ImplicitSeriesTracker;
 }());
+// Preserve the public D3 4 palette names removed in D3 5.
+var CATEGORY20 = [
+    "#1f77b4", "#aec7e8", "#ff7f0e", "#ffbb78", "#2ca02c",
+    "#98df8a", "#d62728", "#ff9896", "#9467bd", "#c5b0d5",
+    "#8c564b", "#c49c94", "#e377c2", "#f7b6d2", "#7f7f7f",
+    "#c7c7c7", "#bcbd22", "#dbdb8d", "#17becf", "#9edae5",
+];
+var CATEGORY20B = [
+    "#393b79", "#5254a3", "#6b6ecf", "#9c9ede", "#637939",
+    "#8ca252", "#b5cf6b", "#cedb9c", "#8c6d31", "#bd9e39",
+    "#e7ba52", "#e7cb94", "#843c39", "#ad494a", "#d6616b",
+    "#e7969c", "#7b4173", "#a55194", "#ce6dbd", "#de9ed6",
+];
+var CATEGORY20C = [
+    "#3182bd", "#6baed6", "#9ecae1", "#c6dbef", "#e6550d",
+    "#fd8d3c", "#fdae6b", "#fdd0a2", "#31a354", "#74c476",
+    "#a1d99b", "#c7e9c0", "#756bb1", "#9e9ac8", "#bcbddc",
+    "#dadaeb", "#636363", "#969696", "#bdbdbd", "#d9d9d9",
+];
 var Color = /** @class */ (function (_super) {
-    (0, tslib_1.__extends)(Color, _super);
+    tslib_1.__extends(Color, _super);
     /**
      * A Color Scale maps string values to color hex values expressed as a string.
      *
@@ -76,17 +95,17 @@ var Color = /** @class */ (function (_super) {
             case "Category20":
             case "category20":
             case "20":
-                scale = d3.scaleOrdinal(d3.schemeCategory20);
+                scale = d3.scaleOrdinal(CATEGORY20);
                 break;
             case "Category20b":
             case "category20b":
             case "20b":
-                scale = d3.scaleOrdinal(d3.schemeCategory20b);
+                scale = d3.scaleOrdinal(CATEGORY20B);
                 break;
             case "Category20c":
             case "category20c":
             case "20c":
-                scale = d3.scaleOrdinal(d3.schemeCategory20c);
+                scale = d3.scaleOrdinal(CATEGORY20C);
                 break;
             default:
                 throw new Error("Unsupported ColorScale type");
@@ -117,7 +136,7 @@ var Color = /** @class */ (function (_super) {
             }
             plottableDefaultColors.push(colorHex);
             i++;
-            colorHex = Utils.Color.colorTest(colorTester, "plottable-colors-" + i);
+            colorHex = Utils.Color.colorTest(colorTester, "plottable-colors-".concat(i));
         }
         colorTester.remove();
         return plottableDefaultColors;

package/build/src/scales/index.js

@@ -4,17 +4,18 @@
  * @license MIT
  */
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.isTransformable = exports.TickGenerators = void 0;
+exports.TickGenerators = void 0;
+exports.isTransformable = isTransformable;
 var tslib_1 = require("tslib");
 var TickGenerators = require("./tickGenerators");
 exports.TickGenerators = TickGenerators;
-(0, tslib_1.__exportStar)(require("./categoryScale"), exports);
-(0, tslib_1.__exportStar)(require("./colorScale"), exports);
-(0, tslib_1.__exportStar)(require("./interpolatedColorScale"), exports);
-(0, tslib_1.__exportStar)(require("./linearScale"), exports);
-(0, tslib_1.__exportStar)(require("./logScale"), exports);
-(0, tslib_1.__exportStar)(require("./modifiedLogScale"), exports);
-(0, tslib_1.__exportStar)(require("./timeScale"), exports);
+tslib_1.__exportStar(require("./categoryScale"), exports);
+tslib_1.__exportStar(require("./colorScale"), exports);
+tslib_1.__exportStar(require("./interpolatedColorScale"), exports);
+tslib_1.__exportStar(require("./linearScale"), exports);
+tslib_1.__exportStar(require("./logScale"), exports);
+tslib_1.__exportStar(require("./modifiedLogScale"), exports);
+tslib_1.__exportStar(require("./timeScale"), exports);
 // ---------------------------------------------------------
 var categoryScale_1 = require("./categoryScale");
 var quantitativeScale_1 = require("./quantitativeScale");
@@ -28,4 +29,3 @@ function isTransformable(scale) {
     return (scale instanceof quantitativeScale_1.QuantitativeScale ||
         scale instanceof categoryScale_1.Category);
 }
-exports.isTransformable = isTransformable;

package/build/src/scales/interpolatedColorScale.js

@@ -10,7 +10,7 @@ var d3 = require("d3");
 var Utils = require("../utils");
 var scale_1 = require("./scale");
 var InterpolatedColor = /** @class */ (function (_super) {
-    (0, tslib_1.__extends)(InterpolatedColor, _super);
+    tslib_1.__extends(InterpolatedColor, _super);
     /**
      * An InterpolatedColor Scale maps numbers to color hex values, expressed as strings.
      *
@@ -90,7 +90,7 @@ var InterpolatedColor = /** @class */ (function (_super) {
         return this;
     };
     InterpolatedColor.prototype.scale = function (value) {
-        return this._d3Scale(value);
+        return this._d3Scale(+value);
     };
     InterpolatedColor.prototype._getDomain = function () {
         return this._backingScaleDomain();
@@ -112,7 +112,7 @@ var InterpolatedColor = /** @class */ (function (_super) {
         this._resetScale();
     };
     InterpolatedColor.REDS = [
-        "#FFFFFF",
+        "#FFFFFF", // white
         "#FFF6E1",
         "#FEF4C0",
         "#FED976",
@@ -123,7 +123,7 @@ var InterpolatedColor = /** @class */ (function (_super) {
         "#B10026", // red
     ];
     InterpolatedColor.BLUES = [
-        "#FFFFFF",
+        "#FFFFFF", // white
         "#CCFFFF",
         "#A5FFFD",
         "#85F7FB",
@@ -134,7 +134,7 @@ var InterpolatedColor = /** @class */ (function (_super) {
         "#0B02E1", // blue
     ];
     InterpolatedColor.POSNEG = [
-        "#0B02E1",
+        "#0B02E1", // blue
         "#2545D3",
         "#417FD0",
         "#55A7E0",
@@ -142,7 +142,7 @@ var InterpolatedColor = /** @class */ (function (_super) {
         "#85F7FB",
         "#A5FFFD",
         "#CCFFFF",
-        "#FFFFFF",
+        "#FFFFFF", // white
         "#FFF6E1",
         "#FEF4C0",
         "#FED976",

package/build/src/scales/linearScale.js

@@ -9,13 +9,13 @@ var tslib_1 = require("tslib");
 var d3 = require("d3");
 var quantitativeScale_1 = require("./quantitativeScale");
 var Linear = /** @class */ (function (_super) {
-    (0, tslib_1.__extends)(Linear, _super);
+    tslib_1.__extends(Linear, _super);
     /**
      * @constructor
      */
     function Linear() {
         var _this = _super.call(this) || this;
-        _this._d3Scale = d3.scaleLinear();
+        _this._d3Scale = d3.scaleLinear().unknown(NaN);
         return _this;
     }
     Linear.prototype._defaultExtent = function () {
@@ -28,7 +28,7 @@ var Linear = /** @class */ (function (_super) {
         return singleValueDomain;
     };
     Linear.prototype.scale = function (value) {
-        return this._d3Scale(value);
+        return this._d3Scale(+value);
     };
     Linear.prototype.scaleTransformation = function (value) {
         return this.scale(value);

package/build/src/scales/logScale.js

@@ -9,14 +9,14 @@ var tslib_1 = require("tslib");
 var d3 = require("d3");
 var quantitativeScale_1 = require("./quantitativeScale");
 var Log = /** @class */ (function (_super) {
-    (0, tslib_1.__extends)(Log, _super);
+    tslib_1.__extends(Log, _super);
     /**
      * @constructor
      */
     function Log(base) {
         if (base === void 0) { base = 10; }
         var _this = _super.call(this) || this;
-        _this._d3Scale = d3.scaleLog().base(base);
+        _this._d3Scale = d3.scaleLog().base(base).unknown(NaN);
         _this._setDomain(_this._defaultExtent());
         return _this;
     }
@@ -31,7 +31,7 @@ var Log = /** @class */ (function (_super) {
         return singleValueDomain;
     };
     Log.prototype.scale = function (value) {
-        return this._d3Scale(value);
+        return this._d3Scale(+value);
     };
     Log.prototype.scaleTransformation = function (value) {
         return this.scale(value);

package/build/src/scales/modifiedLogScale.js

@@ -11,7 +11,7 @@ var Utils = require("../utils");
 var Scales = require("./");
 var quantitativeScale_1 = require("./quantitativeScale");
 var ModifiedLog = /** @class */ (function (_super) {
-    (0, tslib_1.__extends)(ModifiedLog, _super);
+    tslib_1.__extends(ModifiedLog, _super);
     /**
      * A ModifiedLog Scale acts as a regular log scale for large numbers.
      * As it approaches 0, it gradually becomes linear.
@@ -66,7 +66,7 @@ var ModifiedLog = /** @class */ (function (_super) {
             }
             return ticks;
         };
-        _this._d3Scale = d3.scaleLinear();
+        _this._d3Scale = d3.scaleLinear().unknown(NaN);
         _this._base = base;
         _this._pivot = _this._base;
         _this._setDomain(_this._defaultExtent());

package/build/src/scales/quantitativeScale.js

@@ -11,7 +11,7 @@ var panZoomConstraints_1 = require("../interactions/panZoomConstraints");
 var Utils = require("../utils");
 var scale_1 = require("./scale");
 var QuantitativeScale = /** @class */ (function (_super) {
-    (0, tslib_1.__extends)(QuantitativeScale, _super);
+    tslib_1.__extends(QuantitativeScale, _super);
     /**
      * A QuantitativeScale is a Scale that maps number-like values to numbers.
      * It is invertible and continuous.

package/build/src/scales/scale.d.ts

@@ -3,7 +3,7 @@
  * @license MIT
  */
 import * as Scales from "./";
-export declare type TransformableScale<D, R> = Scale<D, R> & Scales.ITransformableScale;
+export type TransformableScale<D, R> = Scale<D, R> & Scales.ITransformableScale;
 export interface IScaleCallback<S extends Scale<any, any>> {
     (scale: S): any;
 }

package/build/src/scales/tickGenerators.js

@@ -4,7 +4,8 @@
  * @license MIT
  */
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.integerTickGenerator = exports.intervalTickGenerator = void 0;
+exports.intervalTickGenerator = intervalTickGenerator;
+exports.integerTickGenerator = integerTickGenerator;
 var Utils = require("../utils");
 /**
  * Creates a TickGenerator using the specified interval.
@@ -30,7 +31,6 @@ function intervalTickGenerator(interval) {
         return lowTicks.concat(middleTicks).concat(highTicks);
     };
 }
-exports.intervalTickGenerator = intervalTickGenerator;
 /**
  * Creates a TickGenerator returns only integer tick values.
  *
@@ -42,4 +42,3 @@ function integerTickGenerator() {
         return defaultTicks.filter(function (tick, i) { return (tick % 1 === 0) || (i === 0) || (i === defaultTicks.length - 1); });
     };
 }
-exports.integerTickGenerator = integerTickGenerator;