8735733710

Committed 18 Apr 2024 09:38AM UTC coverage: 89.814% (-0.2%) from 90.002%

Build # 8735733710

Build Type

Pull #8703

github

Committed by

web-flow

Commit Message

Merge 5c029222e into 88271773c

Pull Request Pull Request #8703: CARTO: Implement QuadbinHeatmapTileLayer

Run Details

6305 of 6938 branches covered (90.88%)

Branch coverage included in aggregate %.

340 of 521 new or added lines in 5 files covered. (65.26%)

13 existing lines in 2 files now uncovered.

52057 of 58043 relevant lines covered (89.69%)

6637.16 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

43.9

/modules/carto/src/layers/quadbin-heatmap-tile-layer.ts

import {getResolution} from 'quadbin';

import {Accessor, CompositeLayer, DefaultProps, Layer} from '@deck.gl/core';
import {SolidPolygonLayer} from '@deck.gl/layers';

import {HeatmapProps, heatmap} from './heatmap';
import {RTTModifier, PostProcessModifier} from './post-process-utils';
import QuadbinTileLayer, {QuadbinTileLayerProps} from './quadbin-tile-layer';

// Modified polygon layer to draw offscreen and output value expected by heatmap
class RTTSolidPolygonLayer extends RTTModifier(SolidPolygonLayer) {
  static layerName = 'RTTSolidPolygonLayer';

  getShaders(type) {
    const shaders = super.getShaders(type);
    shaders.inject = {
      'vs:#decl': 'uniform float cellResolution;',
      'vs:DECKGL_FILTER_COLOR': `
  const vec3 SHIFT = vec3(1.0, 256.0, 256.0 * 256.0);
  float value = 255.0 * dot(SHIFT, color.rgb);

  // Keep "power" delivered to screen constant when tiles update
  float relativeZoom = log2(project_uScale) - cellResolution + 3.5; // range 0-1
  float relativeArea = pow(2.0, -2.0 * relativeZoom); // range 0.25-1
  value *= relativeArea;

  // Pack float into 3 channels to pass to heatmap shader
  color = vec4(mod(vec3(value, floor(value / SHIFT.yz)), 256.0), 255.0) / 255.0;
      `
    };
    return shaders;
  }

  draw(this, opts: any) {
    const cell0 = this.props!.data[0];
    const cellResolution = Number(getResolution(cell0.id));
    for (const model of this.state.models) {
      model.setUniforms({cellResolution});
    }

    super.draw(opts);
  }
}

// Modify QuadbinTileLayer to apply heatmap post process effect
const PostProcessQuadbinTileLayer = PostProcessModifier(QuadbinTileLayer, heatmap);

function encodeWeight(w: number) {
  return [w % 256, Math.floor(w / 256), Math.floor(w / (256 * 256))];
}

const defaultProps: DefaultProps<QuadbinHeatmapTileLayerProps> = {
  ...QuadbinTileLayer.defaultProps,

  getWeight: {type: 'accessor', value: 1}
};

/** All properties supported by QuadbinHeatmapTileLayer. */
export type QuadbinHeatmapTileLayerProps<DataT = unknown> = _QuadbinHeatmapTileLayerProps<DataT> &
  QuadbinTileLayerProps;

/** Properties added by QuadbinHeatmapTileLayer. */
type _QuadbinHeatmapTileLayerProps<DataT> = QuadbinTileLayerProps<DataT> &
  HeatmapProps & {
    /**
     * The weight of each object.
     *
     * @default 1
     */
    getWeight?: Accessor<DataT, number>;
  };

class QuadbinHeatmapTileLayer<DataT = any, ExtraProps extends {} = {}> extends CompositeLayer<
  ExtraProps & Required<_QuadbinHeatmapTileLayerProps<DataT>>
> {
  static layerName = 'QuadbinHeatmapTileLayer';
  static defaultProps = defaultProps;

  renderLayers(): Layer {
    const {getWeight, colorDomain, colorRange, radiusPixels, _subLayerProps} = this.props;

    // Inject modified polygon layer as sublayer into TileLayer
    const subLayerProps = {
      ..._subLayerProps,
      cell: {
        ..._subLayerProps?.cell,
        _subLayerProps: {
          ..._subLayerProps?.cell?._subLayerProps,
          fill: {
            ..._subLayerProps?.cell?._subLayerProps?.fill,
            type: RTTSolidPolygonLayer
          }
        }
      }
    };

    const getFillColor =
      typeof getWeight === 'function'
        ? (d, info) => encodeWeight(getWeight(d, info))
        : encodeWeight(getWeight);

    return new PostProcessQuadbinTileLayer(
      this.getSubLayerProps({
        id: 'heatmap',
        data: this.props.data,

        getFillColor,

        colorDomain,
        colorRange,
        radiusPixels,
        _subLayerProps: subLayerProps,

        updateTriggers: {
          getPosition: this.props.updateTriggers.getWeight
        }
      })
    );
  }
}

export default QuadbinHeatmapTileLayer;

1	import {getResolution} from 'quadbin';	1✔
2		1✔
3	import {Accessor, CompositeLayer, DefaultProps, Layer} from '@deck.gl/core';	1✔
4	import {SolidPolygonLayer} from '@deck.gl/layers';	1✔
5		1✔
6	import {HeatmapProps, heatmap} from './heatmap';	1✔
7	import {RTTModifier, PostProcessModifier} from './post-process-utils';	1✔
8	import QuadbinTileLayer, {QuadbinTileLayerProps} from './quadbin-tile-layer';	1✔
9		1✔
10	// Modified polygon layer to draw offscreen and output value expected by heatmap	1✔
11	class RTTSolidPolygonLayer extends RTTModifier(SolidPolygonLayer) {	1✔
12	static layerName = 'RTTSolidPolygonLayer';	1✔
13		1✔
14	getShaders(type) {	1✔
NEW 15	const shaders = super.getShaders(type);	×
NEW 16	shaders.inject = {	×
NEW 17	'vs:#decl': 'uniform float cellResolution;',	×
NEW 18	'vs:DECKGL_FILTER_COLOR': `	×
NEW 19	const vec3 SHIFT = vec3(1.0, 256.0, 256.0 * 256.0);	×
NEW 20	float value = 255.0 * dot(SHIFT, color.rgb);	×
NEW 21		×
NEW 22	// Keep "power" delivered to screen constant when tiles update	×
NEW 23	float relativeZoom = log2(project_uScale) - cellResolution + 3.5; // range 0-1	×
NEW 24	float relativeArea = pow(2.0, -2.0 * relativeZoom); // range 0.25-1	×
NEW 25	value *= relativeArea;	×
NEW 26		×
NEW 27	// Pack float into 3 channels to pass to heatmap shader	×
NEW 28	color = vec4(mod(vec3(value, floor(value / SHIFT.yz)), 256.0), 255.0) / 255.0;	×
NEW 29	`	×
NEW 30	};	×
NEW 31	return shaders;	×
NEW 32	}	×
33		1✔
34	draw(this, opts: any) {	1✔
NEW 35	const cell0 = this.props!.data[0];	×
NEW 36	const cellResolution = Number(getResolution(cell0.id));	×
NEW 37	for (const model of this.state.models) {	×
NEW 38	model.setUniforms({cellResolution});	×
NEW 39	}	×
NEW 40		×
NEW 41	super.draw(opts);	×
NEW 42	}	×
43	}	1✔
44		1✔
45	// Modify QuadbinTileLayer to apply heatmap post process effect	1✔
46	const PostProcessQuadbinTileLayer = PostProcessModifier(QuadbinTileLayer, heatmap);	1✔
47		1✔
NEW 48	function encodeWeight(w: number) {	×
NEW 49	return [w % 256, Math.floor(w / 256), Math.floor(w / (256 * 256))];	×
NEW 50	}	×
51		1✔
52	const defaultProps: DefaultProps<QuadbinHeatmapTileLayerProps> = {	1✔
53	...QuadbinTileLayer.defaultProps,	1✔
54		1✔
55	getWeight: {type: 'accessor', value: 1}	1✔
56	};	1✔
57		1✔
58	/** All properties supported by QuadbinHeatmapTileLayer. */	1✔
59	export type QuadbinHeatmapTileLayerProps<DataT = unknown> = _QuadbinHeatmapTileLayerProps<DataT> &	1✔
60	QuadbinTileLayerProps;	1✔
61		1✔
62	/** Properties added by QuadbinHeatmapTileLayer. */	1✔
63	type _QuadbinHeatmapTileLayerProps<DataT> = QuadbinTileLayerProps<DataT> &	1✔
64	HeatmapProps & {	1✔
65	/**	1✔
66	* The weight of each object.	1✔
67	*	1✔
68	* @default 1	1✔
69	*/	1✔
70	getWeight?: Accessor<DataT, number>;	1✔
71	};	1✔
72		1✔
73	class QuadbinHeatmapTileLayer<DataT = any, ExtraProps extends {} = {}> extends CompositeLayer<	1✔
74	ExtraProps & Required<_QuadbinHeatmapTileLayerProps<DataT>>	1✔
75	> {	1✔
76	static layerName = 'QuadbinHeatmapTileLayer';	1✔
77	static defaultProps = defaultProps;	1✔
78		1✔
79	renderLayers(): Layer {	1✔
NEW 80	const {getWeight, colorDomain, colorRange, radiusPixels, _subLayerProps} = this.props;	×
NEW 81		×
NEW 82	// Inject modified polygon layer as sublayer into TileLayer	×
NEW 83	const subLayerProps = {	×
NEW 84	..._subLayerProps,	×
NEW 85	cell: {	×
NEW 86	..._subLayerProps?.cell,	×
NEW 87	_subLayerProps: {	×
NEW 88	..._subLayerProps?.cell?._subLayerProps,	×
NEW 89	fill: {	×
NEW 90	..._subLayerProps?.cell?._subLayerProps?.fill,	×
NEW 91	type: RTTSolidPolygonLayer	×
NEW 92	}	×
NEW 93	}	×
NEW 94	}	×
NEW 95	};	×
NEW 96		×
NEW 97	const getFillColor =	×
NEW 98	typeof getWeight === 'function'	×
NEW 99	? (d, info) => encodeWeight(getWeight(d, info))	×
NEW 100	: encodeWeight(getWeight);	×
NEW 101		×
NEW 102	return new PostProcessQuadbinTileLayer(	×
NEW 103	this.getSubLayerProps({	×
NEW 104	id: 'heatmap',	×
NEW 105	data: this.props.data,	×
NEW 106		×
NEW 107	getFillColor,	×
NEW 108		×
NEW 109	colorDomain,	×
NEW 110	colorRange,	×
NEW 111	radiusPixels,	×
NEW 112	_subLayerProps: subLayerProps,	×
NEW 113		×
NEW 114	updateTriggers: {	×
NEW 115	getPosition: this.props.updateTriggers.getWeight	×
NEW 116	}	×
NEW 117	})	×
NEW 118	);	×
NEW 119	}	×
120	}	1✔
121		1✔
122	export default QuadbinHeatmapTileLayer;	1✔

visgl / deck.gl / 8735733710

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous