@feedzai/brushable-histogram - npm Package Compare versions

Comparing version 1.1.9 to 1.1.10

CHANGELOG.md

 # Brushable Histogram
 
+## 1.1.10 (2019/03/29)
+
+- Fix Histogram's `onIntervalChange` method not being called when the graph's histogram data changes (and the graph itself) but the domain min and max remains the same. This change will cause a little degradation in the brushing performance, since the `setState` method will be invoke many times, even when there was no changes in the brush range. We will try to address this side effect in the next version.
+
 ## 1.1.9 (2019/03/20)
@@ -4,0 +8,0 @@

lib/DensityChart/DensityChart.js

@@ -86,27 +86,27 @@ "use strict";
   componentDidUpdate(prevProps) {
-    let min = this.props.brushDomainMin;
-    let max = this.props.brushDomainMax;
-    const _this$props2 = this.props,
-          densityChartXScale = _this$props2.densityChartXScale,
-          width = _this$props2.width,
-          height = _this$props2.height;
+    // We only need to re-render the density chart if the data, the weight, the height or
+    // the chart x scale have changed.
+    if (this._shouldRedrawDensityChart(prevProps)) {
+      let min = this.props.brushDomainMin;
+      let max = this.props.brushDomainMax;
+      const _this$props2 = this.props,
+            densityChartXScale = _this$props2.densityChartXScale,
+            width = _this$props2.width,
+            height = _this$props2.height;
 
-    if (max >= this.props.overallTimeDomainMax) {
-      const delta = this.props.brushDomainMax - this.props.brushDomainMin;
-      min = this.props.overallTimeDomainMax - delta;
-      max = this.props.overallTimeDomainMax;
-    } // We need to resize the max value of the brush when the screen has resized
+      if (max >= this.props.overallTimeDomainMax) {
+        const delta = this.props.brushDomainMax - this.props.brushDomainMin;
+        min = this.props.overallTimeDomainMax - delta;
+        max = this.props.overallTimeDomainMax;
+      } // We need to resize the max value of the brush when the screen has resized
 
 
-    if (prevProps.width !== width || prevProps.height !== height) {
-      this.brush.extent([[0, 0], [width, height]]);
-    }
+      if (prevProps.width !== width || prevProps.height !== height) {
+        this.brush.extent([[0, 0], [width, height]]);
+      }
 
-    this._updateBrush();
+      this._updateBrush();
 
-    this._moveBrush([densityChartXScale(min), densityChartXScale(max)]); // We only need to re-render the density chart if the data, the weight, the height or
-    // the chart x scale have changed.
+      this._moveBrush([densityChartXScale(min), densityChartXScale(max)]);
 
-
-    if (this._shouldRedrawDensityChart(prevProps)) {
       this._drawDensityChart();
@@ -113,0 +113,0 @@ }

lib/Histogram/Histogram.js

@@ -206,15 +206,12 @@ "use strict";
     const brushedDomainMax = (0, _utils.dateToTimestamp)(brushedDomain[1]);
-
-    if (brushedDomainMin !== this.state.brushTimeDomain.min || brushedDomainMax !== this.state.brushTimeDomain.max) {
-      this.setState({
-        brushTimeDomain: {
-          min: brushedDomainMin,
-          max: brushedDomainMax
-        },
-        showHistogramBarTooltip: false
-      }, this._updateHistogramChartScales);
-      const fullDomain = this.densityChartXScale.domain();
-      const isFullDomain = fullDomain[0].getTime() === brushedDomainMin && fullDomain[1].getTime() === brushedDomainMax;
-      this.props.onIntervalChange([brushedDomainMin, brushedDomainMax], isFullDomain);
-    }
+    this.setState({
+      brushTimeDomain: {
+        min: brushedDomainMin,
+        max: brushedDomainMax
+      },
+      showHistogramBarTooltip: false
+    }, this._updateHistogramChartScales);
+    const fullDomain = this.densityChartXScale.domain();
+    const isFullDomain = fullDomain[0].getTime() === brushedDomainMin && fullDomain[1].getTime() === brushedDomainMax;
+    this.props.onIntervalChange([brushedDomainMin, brushedDomainMax], isFullDomain);
   }
@@ -221,0 +218,0 @@ /**

package.json

 {
   "name": "@feedzai/brushable-histogram",
-  "version": "1.1.9",
+  "version": "1.1.10",
   "description": "A time histogram with a time brush that renders a summary of the events",
@@ -5,0 +5,0 @@ "main": "lib/index.js",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

212129

increased by0.15%

Worsened metrics

Lines of code

2630

decreased by-0.04%

No dependency changes