This sample uses an instance of ImageryLayer to visualize global sea temperature.
The pixelFilter property is used in this sample to add a custom continuous color ramp to the pixels. The color is determined based on the temperature or the value of the pixel. To assign a color to the pixels, you must loop through all the pixels displayed in the view.
functioncolorize(pixelData) {
if (pixelData === null || pixelData.pixelBlock === null || pixelData.pixelBlock.pixels === null) {
return;
}
// The pixelBlock stores the values of all pixels visible in the view pixelBlock = pixelData.pixelBlock;
// Get the min and max values of the data in the current view minValue = pixelBlock.statistics[0].minValue;
maxValue = pixelBlock.statistics[0].maxValue;
// The pixels visible in the viewvar pixels = pixelBlock.pixels;
// The number of pixels in the pixelBlockvar numPixels = pixelBlock.width * pixelBlock.height;
// Calculate the factor by which to determine the red and blue// values in the colorized version of the layer factor = 255.0 / (maxValue - minValue);
// Get the pixels containing temperature values in the only band of the datavar tempBand = pixels[0];
// Create empty arrays for each of the RGB bands to set on the pixelBlockvar rBand = [];
var gBand = [];
var bBand = [];
// Loop through all the pixels in the viewfor (i = 0; i < numPixels; i++) {
// Get the pixel value (the temperature) recorded at the pixel locationvar tempValue = tempBand[i];
// Calculate the red value based on the factorvar red = (tempValue - minValue) * factor;
// Sets a color between blue (coldest) and red (warmest) in each band rBand[i] = red;
gBand[i] = 0;
bBand[i] = 255 - red;
}
// Set the new pixel values on the pixelBlock pixelData.pixelBlock.pixels = [rBand, gBand, bBand];
pixelData.pixelBlock.pixelType = "U8"; // U8 is used for color}
var layer = new ImageryLayer({
url: url,
pixelFilter: colorize,
mosaicRule: mr
});
Since the image service has multidimensional information, you can set the multidimensionalDefinition property in the MosaicRule object to apply a pixelFilter based on water temperature at a specific water depth and time.