Heatmap add minOpacity, maxOpacity

richahuang · Mar 21, 2016 · 9193bf3 · 9193bf3
1 parent fe8d7ea
commit 9193bf3
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 3 deletions.
diff --git a/src/chart/heatmap/HeatmapLayer.js b/src/chart/heatmap/HeatmapLayer.js
@@ -21,7 +21,9 @@ define(function (require) {
 
         this.blurSize = 30;
         this.pointSize = 20;
-        this.opacity = 1;
+
+        this.maxOpacity = 1;
+        this.minOpacity = 0;
 
         this._gradientPixels = {};
     }
@@ -63,16 +65,22 @@ define(function (require) {
             var pixels = imageData.data;
             var offset = 0;
             var pixelLen = pixels.length;
+            var minOpacity = this.minOpacity;
+            var maxOpacity = this.maxOpacity;
+            var diffOpacity = maxOpacity - minOpacity;
+
             while(offset < pixelLen) {
                 var alpha = pixels[offset + 3] / 256;
                 var gradientOffset = Math.floor(alpha * (GRADIENT_LEVELS - 1)) * 4;
                 // Simple optimize to ignore the empty data
                 if (alpha > 0) {
                     var gradient = isInRange(alpha) ? gradientInRange : gradientOutOfRange;
+                    // Any alpha > 0 will be mapped to [minOpacity, maxOpacity]
+                    alpha > 0 && (alpha = alpha * diffOpacity + minOpacity);
                     pixels[offset++] = gradient[gradientOffset];
                     pixels[offset++] = gradient[gradientOffset + 1];
                     pixels[offset++] = gradient[gradientOffset + 2];
-                    pixels[offset++] *= this.opacity * gradient[gradientOffset + 3];
+                    pixels[offset++] = gradient[gradientOffset + 3] * alpha * 256;
                 }
                 else {
                     offset += 4;

diff --git a/src/chart/heatmap/HeatmapSeries.js b/src/chart/heatmap/HeatmapSeries.js
@@ -28,7 +28,11 @@ define(function (require) {
 
             blurSize: 30,
 
-            pointSize: 20
+            pointSize: 20,
+
+            maxOpacity: 1,
+
+            minOpacity: 0
         }
     });
 });
diff --git a/src/chart/heatmap/HeatmapView.js b/src/chart/heatmap/HeatmapView.js
@@ -157,6 +157,8 @@ define(function (require) {
             var hmLayer = this._hmLayer || (this._hmLayer || new HeatmapLayer());
             hmLayer.blurSize = seriesModel.get('blurSize');
             hmLayer.pointSize = seriesModel.get('pointSize');
+            hmLayer.minOpacity = seriesModel.get('minOpacity');
+            hmLayer.maxOpacity = seriesModel.get('maxOpacity');
 
             var rect = geo.getViewRect().clone();
             var roamTransform = geo.getRoamTransform();