Move feature picking and image recoloring out to Cesium.

lib/Models/CsvCatalogItem.js

@@ -293,14 +293,15 @@ CsvCatalogItem.prototype._load = function() {
 
 CsvCatalogItem.prototype._enable = function() {
     if (this._regionMapped) {
-        this._imageryLayer = ImageryLayerCatalogItem.enableLayer(this, this._createImageryProvider(), this.opacity);
+        var ip = this._createImageryProvider();
+        this._imageryLayer = ImageryLayerCatalogItem.enableLayer(this, ip, this.opacity);
 
         if (defined( this.terria.leaflet)) {
             var that = this;
             this._imageryLayer.setFilter(function () {
                 new L.CanvasFilter(this, {
                     channelFilter: function (image) {
-                        return recolorImage(image, that.colorFunc);
+                        return ip.recolorImage(image, that.colorFunc);
                     }
                 }).render();
             });
@@ -346,42 +347,15 @@ CsvCatalogItem.prototype._hide = function() {
  * For region-mapped files, enable the WMS imagery layer, with recoloring and feature picking.
 */
 CsvCatalogItem.prototype._createImageryProvider = function(time) {
+    var that = this;
     var imageryProvider = new WebMapServiceImageryProvider({
         url: proxyUrl( this.terria, this._tableStyle.regionProvider.server),
         layers: this._tableStyle.regionProvider.layerName,
         parameters: WebMapServiceCatalogItem.defaultParameters,
         getFeatureInfoParameters: WebMapServiceCatalogItem.defaultParameters,
-        tilingScheme: new WebMercatorTilingScheme()
-    });
-
-    var that = this;
-
-    // Override requestImage to recolor the images.
-    imageryProvider.base_requestImage = imageryProvider.requestImage;
-    imageryProvider.requestImage = function(x, y, level) {
-        var imagePromise = this.base_requestImage(x, y, level);
-        if (!defined(imagePromise)) {
-            return imagePromise;
-        }
-
-        return when(imagePromise, function(image) {
-            if (defined(image)) {
-                var context = getCanvasContext(that, image);
-                image = recolorImageWithCanvasContext(context, image, that.colorFunc);
-            }
-            return image;
-        });
-    };
-
-    // Override pickFeatures to add more metadata.
-    imageryProvider.base_pickFeatures = imageryProvider.pickFeatures;
-    imageryProvider.pickFeatures = function(x, y, level, longitude, latitude) {
-        var featurePromise = this.base_pickFeatures(x, y, level, longitude, latitude);
-        if (!defined(featurePromise)) {
-            return featurePromise;
-        }
-
-        return when(featurePromise, function(results) {
+        tilingScheme: new WebMercatorTilingScheme(),
+        recolorFunc: this.colorFunc, 
+        pickFeatureHook: function(results) {
             if (!defined(results) || results.length === 0) {
                 return;
             }
@@ -393,9 +367,8 @@ CsvCatalogItem.prototype._createImageryProvider = function(time) {
             }
 
             return results;
-        });
-    };
-
+        }
+    });
     return imageryProvider;
 };
 
@@ -693,63 +666,6 @@ function updateRegionMapping(csvItem, tableStyle, showFeedback) {
 }
 
 
-/* Recolor a raster image pixel by pixel, replacing encoded identifiers with some calculated value. */
-function recolorImage(image, colorFunc) {
-    var length = image.data.length;  //pixel count * 4
-    for (var i = 0; i < length; i += 4) {
-        // Region identifiers are encoded in the blue and green channels, with R=0 and A=255
-        if (image.data[i+3] < 255 || image.data[i] !== 0) {
-            // Set any pixel that is not part of a region completely transparent
-            image.data[i+3] = 0;
-            continue;
-        }
-        // Convert the colour of a pixel back into the identifier of the region it belongs to
-        var idx = image.data[i+1] * 0x100 + image.data[i+2];
-        // Convert that identifier into the data-mapped colour it should display as.
-        var clr = colorFunc(idx);
-        if (defined(clr)) {
-            for (var j = 0; j < 4; j++) {
-                image.data[i+j] = clr[j];
-            }
-        }
-        else {
-            // This is a region but we don't have data for it, so make it transparent. Possibly should be configurable.
-            image.data[i+3] = 0;
-        }
-    }
-    return image;
-}
-
-function getCanvasContext(csvItem, img) {
-    var context = csvItem._canvas2dContext;
-    if (!defined(context) || context.canvas.width !== img.width || context.canvas.height !== img.height) {
-        var canvas = document.createElement("canvas");
-        canvas.width = img.width;
-        canvas.height = img.height;
-
-        context = canvas.getContext("2d");
-        csvItem._canvas2dContext = context;
-    }
-    return context;
-}
-
-/* Copy an image to a newly created Canvas, then perform recoloring there. */
-function recolorImageWithCanvasContext(context, img, colorFunc) {
-    if (!defined(context)) {
-        throw new DeveloperError('No context for image recoloring.');
-    }
-
-    // Copy the image contents to the canvas
-    context.clearRect(0, 0, context.canvas.width, context.canvas.height);
-    context.drawImage(img, 0, 0);
-    var image = context.getImageData(0, 0, context.canvas.width, context.canvas.height);
-    image = recolorImage(image, colorFunc);
-    return image;
-}
-
-
-
-
 
 module.exports = CsvCatalogItem;