@deck.gl/aggregation-layers 8.8.0-beta.5 → 8.8.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (59) hide show
  1. package/dist/dist.dev.js +246 -246
  2. package/dist/es5/cpu-grid-layer/cpu-grid-layer.js.map +1 -1
  3. package/dist/esm/cpu-grid-layer/cpu-grid-layer.js.map +1 -1
  4. package/package.json +2 -2
  5. package/src/cpu-grid-layer/cpu-grid-layer.ts +1 -2
  6. package/typed/aggregation-layer.js +151 -0
  7. package/typed/contour-layer/contour-layer.js +234 -0
  8. package/typed/contour-layer/contour-utils.js +64 -0
  9. package/typed/contour-layer/marching-squares-codes.js +337 -0
  10. package/typed/contour-layer/marching-squares.js +147 -0
  11. package/typed/cpu-grid-layer/cpu-grid-layer.d.ts +1 -2
  12. package/typed/cpu-grid-layer/cpu-grid-layer.d.ts.map +1 -1
  13. package/typed/cpu-grid-layer/cpu-grid-layer.js +129 -0
  14. package/typed/cpu-grid-layer/grid-aggregator.js +141 -0
  15. package/typed/gpu-grid-layer/gpu-grid-cell-layer-fragment.glsl.js +34 -0
  16. package/typed/gpu-grid-layer/gpu-grid-cell-layer-vertex.glsl.js +141 -0
  17. package/typed/gpu-grid-layer/gpu-grid-cell-layer.js +143 -0
  18. package/typed/gpu-grid-layer/gpu-grid-layer.js +289 -0
  19. package/typed/grid-aggregation-layer.js +172 -0
  20. package/typed/grid-layer/grid-layer.js +60 -0
  21. package/typed/heatmap-layer/heatmap-layer-utils.js +78 -0
  22. package/typed/heatmap-layer/heatmap-layer.js +478 -0
  23. package/typed/heatmap-layer/max-fs.glsl.js +7 -0
  24. package/typed/heatmap-layer/max-vs.glsl.js +12 -0
  25. package/typed/heatmap-layer/triangle-layer-fragment.glsl.js +58 -0
  26. package/typed/heatmap-layer/triangle-layer-vertex.glsl.js +51 -0
  27. package/typed/heatmap-layer/triangle-layer.js +67 -0
  28. package/typed/heatmap-layer/weights-fs.glsl.js +19 -0
  29. package/typed/heatmap-layer/weights-vs.glsl.js +23 -0
  30. package/typed/hexagon-layer/hexagon-aggregator.js +112 -0
  31. package/typed/hexagon-layer/hexagon-layer.js +171 -0
  32. package/typed/index.js +33 -0
  33. package/typed/screen-grid-layer/screen-grid-cell-layer.js +159 -0
  34. package/typed/screen-grid-layer/screen-grid-layer-fragment.glsl.js +37 -0
  35. package/typed/screen-grid-layer/screen-grid-layer-vertex.glsl.js +83 -0
  36. package/typed/screen-grid-layer/screen-grid-layer.js +216 -0
  37. package/typed/types.js +1 -0
  38. package/typed/utils/aggregation-operation-utils.js +94 -0
  39. package/typed/utils/bin-sorter.js +167 -0
  40. package/typed/utils/color-utils.js +53 -0
  41. package/typed/utils/cpu-aggregator.js +417 -0
  42. package/typed/utils/gpu-grid-aggregation/aggregate-all-fs.glsl.js +39 -0
  43. package/typed/utils/gpu-grid-aggregation/aggregate-all-vs.glsl.js +53 -0
  44. package/typed/utils/gpu-grid-aggregation/aggregate-to-grid-fs.glsl.js +31 -0
  45. package/typed/utils/gpu-grid-aggregation/aggregate-to-grid-vs.glsl.js +77 -0
  46. package/typed/utils/gpu-grid-aggregation/gpu-grid-aggregator-constants.js +41 -0
  47. package/typed/utils/gpu-grid-aggregation/gpu-grid-aggregator-utils.js +1 -0
  48. package/typed/utils/gpu-grid-aggregation/gpu-grid-aggregator.js +562 -0
  49. package/typed/utils/gpu-grid-aggregation/transform-mean-vs.glsl.js +36 -0
  50. package/typed/utils/grid-aggregation-utils.js +114 -0
  51. package/typed/utils/prop-utils.js +28 -0
  52. package/typed/utils/resource-utils.js +40 -0
  53. package/typed/utils/scale-utils.js +184 -0
  54. package/dist/es5/aggregation-layer.md +0 -54
  55. package/dist/es5/grid-aggregation-layer.md +0 -46
  56. package/dist/esm/aggregation-layer.md +0 -54
  57. package/dist/esm/grid-aggregation-layer.md +0 -46
  58. package/src/aggregation-layer.md +0 -54
  59. package/src/grid-aggregation-layer.md +0 -46
@@ -0,0 +1,114 @@
1
+ import { log, COORDINATE_SYSTEM } from '@deck.gl/core';
2
+ const R_EARTH = 6378000;
3
+ function toFinite(n) {
4
+ return Number.isFinite(n) ? n : 0;
5
+ }
6
+ // Parse input data to build positions, wights and bounding box.
7
+ /* eslint-disable max-statements */
8
+ export function getBoundingBox(attributes, vertexCount) {
9
+ // TODO - value might not exist (e.g. attribute transition)
10
+ const positions = attributes.positions.value;
11
+ let yMin = Infinity;
12
+ let yMax = -Infinity;
13
+ let xMin = Infinity;
14
+ let xMax = -Infinity;
15
+ let y;
16
+ let x;
17
+ for (let i = 0; i < vertexCount; i++) {
18
+ x = positions[i * 3];
19
+ y = positions[i * 3 + 1];
20
+ yMin = y < yMin ? y : yMin;
21
+ yMax = y > yMax ? y : yMax;
22
+ xMin = x < xMin ? x : xMin;
23
+ xMax = x > xMax ? x : xMax;
24
+ }
25
+ const boundingBox = {
26
+ xMin: toFinite(xMin),
27
+ xMax: toFinite(xMax),
28
+ yMin: toFinite(yMin),
29
+ yMax: toFinite(yMax)
30
+ };
31
+ return boundingBox;
32
+ }
33
+ /* eslint-enable max-statements */
34
+ // Returns XY translation for positions to peform aggregation in +ve sapce
35
+ function getTranslation(boundingBox, gridOffset, coordinateSystem, viewport) {
36
+ const { width, height } = viewport;
37
+ // Origin to define grid
38
+ // DEFAULT coordinate system is treated as LNGLAT
39
+ const worldOrigin = coordinateSystem === COORDINATE_SYSTEM.CARTESIAN ? [-width / 2, -height / 2] : [-180, -90];
40
+ // Other coordinate systems not supported/verified yet
41
+ log.assert(coordinateSystem === COORDINATE_SYSTEM.CARTESIAN ||
42
+ coordinateSystem === COORDINATE_SYSTEM.LNGLAT ||
43
+ coordinateSystem === COORDINATE_SYSTEM.DEFAULT);
44
+ const { xMin, yMin } = boundingBox;
45
+ return [
46
+ // Align origin to match grid cell boundaries in CPU and GPU aggregations
47
+ -1 * (alignToCell(xMin - worldOrigin[0], gridOffset.xOffset) + worldOrigin[0]),
48
+ -1 * (alignToCell(yMin - worldOrigin[1], gridOffset.yOffset) + worldOrigin[1])
49
+ ];
50
+ }
51
+ // Aligns `inValue` to given `cellSize`
52
+ export function alignToCell(inValue, cellSize) {
53
+ const sign = inValue < 0 ? -1 : 1;
54
+ let value = sign < 0 ? Math.abs(inValue) + cellSize : Math.abs(inValue);
55
+ value = Math.floor(value / cellSize) * cellSize;
56
+ return value * sign;
57
+ }
58
+ /**
59
+ * Based on geometric center of sample points, calculate cellSize in lng/lat (degree) space
60
+ * @param {object} boundingBox - {xMin, yMin, xMax, yMax} contains bounding box of data
61
+ * @param {number} cellSize - grid cell size in meters
62
+ * @param {boolean, optional} converToDegrees - when true offsets are converted from meters to lng/lat (degree) space
63
+ * @returns {xOffset, yOffset} - cellSize size
64
+ */
65
+ export function getGridOffset(boundingBox, cellSize, convertToMeters = true) {
66
+ if (!convertToMeters) {
67
+ return { xOffset: cellSize, yOffset: cellSize };
68
+ }
69
+ const { yMin, yMax } = boundingBox;
70
+ const centerLat = (yMin + yMax) / 2;
71
+ return calculateGridLatLonOffset(cellSize, centerLat);
72
+ }
73
+ export function getGridParams(boundingBox, cellSize, viewport, coordinateSystem) {
74
+ const gridOffset = getGridOffset(boundingBox, cellSize, coordinateSystem !== COORDINATE_SYSTEM.CARTESIAN);
75
+ const translation = getTranslation(boundingBox, gridOffset, coordinateSystem, viewport);
76
+ const { xMin, yMin, xMax, yMax } = boundingBox;
77
+ const width = xMax - xMin + gridOffset.xOffset;
78
+ const height = yMax - yMin + gridOffset.yOffset;
79
+ const numCol = Math.ceil(width / gridOffset.xOffset);
80
+ const numRow = Math.ceil(height / gridOffset.yOffset);
81
+ return { gridOffset, translation, width, height, numCol, numRow };
82
+ }
83
+ /**
84
+ * calculate grid layer cell size in lat lon based on world unit size
85
+ * and current latitude
86
+ * @param {number} cellSize
87
+ * @param {number} latitude
88
+ * @returns {object} - lat delta and lon delta
89
+ */
90
+ function calculateGridLatLonOffset(cellSize, latitude) {
91
+ const yOffset = calculateLatOffset(cellSize);
92
+ const xOffset = calculateLonOffset(latitude, cellSize);
93
+ return { yOffset, xOffset };
94
+ }
95
+ /**
96
+ * with a given x-km change, calculate the increment of latitude
97
+ * based on stackoverflow http://stackoverflow.com/questions/7477003
98
+ * @param {number} dy - change in km
99
+ * @return {number} - increment in latitude
100
+ */
101
+ function calculateLatOffset(dy) {
102
+ return (dy / R_EARTH) * (180 / Math.PI);
103
+ }
104
+ /**
105
+ * with a given x-km change, and current latitude
106
+ * calculate the increment of longitude
107
+ * based on stackoverflow http://stackoverflow.com/questions/7477003
108
+ * @param {number} lat - latitude of current location (based on city)
109
+ * @param {number} dx - change in km
110
+ * @return {number} - increment in longitude
111
+ */
112
+ function calculateLonOffset(lat, dx) {
113
+ return ((dx / R_EARTH) * (180 / Math.PI)) / Math.cos((lat * Math.PI) / 180);
114
+ }
@@ -0,0 +1,28 @@
1
+ // Copyright (c) 2015 - 2019 Uber Technologies, Inc.
2
+ //
3
+ // Permission is hereby granted, free of charge, to any person obtaining a copy
4
+ // of this software and associated documentation files (the "Software"), to deal
5
+ // in the Software without restriction, including without limitation the rights
6
+ // to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
7
+ // copies of the Software, and to permit persons to whom the Software is
8
+ // furnished to do so, subject to the following conditions:
9
+ //
10
+ // The above copyright notice and this permission notice shall be included in
11
+ // all copies or substantial portions of the Software.
12
+ //
13
+ // THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
14
+ // IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
15
+ // FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
16
+ // AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
17
+ // LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
18
+ // OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
19
+ // THE SOFTWARE.
20
+ export function filterProps(props, filterKeys) {
21
+ const filteredProps = {};
22
+ for (const key in props) {
23
+ if (!filterKeys.includes(key)) {
24
+ filteredProps[key] = props[key];
25
+ }
26
+ }
27
+ return filteredProps;
28
+ }
@@ -0,0 +1,40 @@
1
+ import GL from '@luma.gl/constants';
2
+ import { Framebuffer, Texture2D, isWebGL2 } from '@luma.gl/core';
3
+ const DEFAULT_PARAMETERS = {
4
+ [GL.TEXTURE_MAG_FILTER]: GL.NEAREST,
5
+ [GL.TEXTURE_MIN_FILTER]: GL.NEAREST
6
+ };
7
+ export function getFloatTexture(gl, opts = {}) {
8
+ const { width = 1, height = 1, data = null, unpackFlipY = true, parameters = DEFAULT_PARAMETERS } = opts;
9
+ const texture = new Texture2D(gl, {
10
+ data,
11
+ format: isWebGL2(gl) ? GL.RGBA32F : GL.RGBA,
12
+ type: GL.FLOAT,
13
+ border: 0,
14
+ mipmaps: false,
15
+ parameters,
16
+ dataFormat: GL.RGBA,
17
+ width,
18
+ height,
19
+ unpackFlipY
20
+ });
21
+ return texture;
22
+ }
23
+ export function getFramebuffer(gl, opts) {
24
+ const { id, width = 1, height = 1, texture } = opts;
25
+ const fb = new Framebuffer(gl, {
26
+ id,
27
+ width,
28
+ height,
29
+ attachments: {
30
+ [GL.COLOR_ATTACHMENT0]: texture
31
+ }
32
+ });
33
+ return fb;
34
+ }
35
+ export function getFloatArray(array, size, fillValue = 0) {
36
+ if (!array || array.length < size) {
37
+ return new Float32Array(size).fill(fillValue);
38
+ }
39
+ return array;
40
+ }
@@ -0,0 +1,184 @@
1
+ // Copyright (c) 2015 - 2017 Uber Technologies, Inc.
2
+ //
3
+ // Permission is hereby granted, free of charge, to any person obtaining a copy
4
+ // of this software and associated documentation files (the "Software"), to deal
5
+ // in the Software without restriction, including without limitation the rights
6
+ // to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
7
+ // copies of the Software, and to permit persons to whom the Software is
8
+ // furnished to do so, subject to the following conditions:
9
+ //
10
+ // The above copyright notice and this permission notice shall be included in
11
+ // all copies or substantial portions of the Software.
12
+ //
13
+ // THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
14
+ // IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
15
+ // FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
16
+ // AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
17
+ // LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
18
+ // OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
19
+ // THE SOFTWARE.
20
+ import { log } from '@deck.gl/core';
21
+ // a scale function wrapper just like d3-scales
22
+ export function getScale(domain, range, scaleFunction) {
23
+ const scale = scaleFunction;
24
+ scale.domain = () => domain;
25
+ scale.range = () => range;
26
+ return scale;
27
+ }
28
+ // Quantize scale is similar to linear scales,
29
+ // except it uses a discrete rather than continuous range
30
+ // return a quantize scale function
31
+ export function getQuantizeScale(domain, range) {
32
+ const scaleFunction = value => quantizeScale(domain, range, value);
33
+ return getScale(domain, range, scaleFunction);
34
+ }
35
+ // return a linear scale function
36
+ export function getLinearScale(domain, range) {
37
+ const scaleFunction = value => linearScale(domain, range, value);
38
+ return getScale(domain, range, scaleFunction);
39
+ }
40
+ export function getQuantileScale(domain, range) {
41
+ // calculate threshold
42
+ const sortedDomain = domain.sort(ascending);
43
+ let i = 0;
44
+ const n = Math.max(1, range.length);
45
+ const thresholds = new Array(n - 1);
46
+ while (++i < n) {
47
+ thresholds[i - 1] = threshold(sortedDomain, i / n);
48
+ }
49
+ const scaleFunction = value => thresholdsScale(thresholds, range, value);
50
+ scaleFunction.thresholds = () => thresholds;
51
+ return getScale(domain, range, scaleFunction);
52
+ }
53
+ function ascending(a, b) {
54
+ return a - b;
55
+ }
56
+ function threshold(domain, fraction) {
57
+ const domainLength = domain.length;
58
+ if (fraction <= 0 || domainLength < 2) {
59
+ return domain[0];
60
+ }
61
+ if (fraction >= 1) {
62
+ return domain[domainLength - 1];
63
+ }
64
+ const domainFraction = (domainLength - 1) * fraction;
65
+ const lowIndex = Math.floor(domainFraction);
66
+ const low = domain[lowIndex];
67
+ const high = domain[lowIndex + 1];
68
+ return low + (high - low) * (domainFraction - lowIndex);
69
+ }
70
+ function bisectRight(a, x) {
71
+ let lo = 0;
72
+ let hi = a.length;
73
+ while (lo < hi) {
74
+ const mid = (lo + hi) >>> 1;
75
+ if (ascending(a[mid], x) > 0) {
76
+ hi = mid;
77
+ }
78
+ else {
79
+ lo = mid + 1;
80
+ }
81
+ }
82
+ return lo;
83
+ }
84
+ // return a quantize scale function
85
+ function thresholdsScale(thresholds, range, value) {
86
+ return range[bisectRight(thresholds, value)];
87
+ }
88
+ // ordinal Scale
89
+ function ordinalScale(domain, domainMap, range, value) {
90
+ const key = `${value}`;
91
+ let d = domainMap.get(key);
92
+ if (d === undefined) {
93
+ // update the domain
94
+ d = domain.push(value);
95
+ domainMap.set(key, d);
96
+ }
97
+ return range[(d - 1) % range.length];
98
+ }
99
+ export function getOrdinalScale(domain, range) {
100
+ const domainMap = new Map();
101
+ const uniqueDomain = [];
102
+ for (const d of domain) {
103
+ const key = `${d}`;
104
+ if (!domainMap.has(key)) {
105
+ domainMap.set(key, uniqueDomain.push(d));
106
+ }
107
+ }
108
+ const scaleFunction = value => ordinalScale(uniqueDomain, domainMap, range, value);
109
+ return getScale(domain, range, scaleFunction);
110
+ }
111
+ // Quantize scale is similar to linear scales,
112
+ // except it uses a discrete rather than continuous range
113
+ export function quantizeScale(domain, range, value) {
114
+ const domainRange = domain[1] - domain[0];
115
+ if (domainRange <= 0) {
116
+ log.warn('quantizeScale: invalid domain, returning range[0]')();
117
+ return range[0];
118
+ }
119
+ const step = domainRange / range.length;
120
+ const idx = Math.floor((value - domain[0]) / step);
121
+ const clampIdx = Math.max(Math.min(idx, range.length - 1), 0);
122
+ return range[clampIdx];
123
+ }
124
+ // Linear scale maps continuous domain to continuous range
125
+ export function linearScale(domain, range, value) {
126
+ return ((value - domain[0]) / (domain[1] - domain[0])) * (range[1] - range[0]) + range[0];
127
+ }
128
+ // get scale domains
129
+ function notNullOrUndefined(d) {
130
+ return d !== undefined && d !== null;
131
+ }
132
+ export function unique(values) {
133
+ const results = [];
134
+ values.forEach(v => {
135
+ if (!results.includes(v) && notNullOrUndefined(v)) {
136
+ results.push(v);
137
+ }
138
+ });
139
+ return results;
140
+ }
141
+ function getTruthyValues(data, valueAccessor) {
142
+ const values = typeof valueAccessor === 'function' ? data.map(valueAccessor) : data;
143
+ return values.filter(notNullOrUndefined);
144
+ }
145
+ export function getLinearDomain(data, valueAccessor) {
146
+ const sorted = getTruthyValues(data, valueAccessor).sort();
147
+ return sorted.length ? [sorted[0], sorted[sorted.length - 1]] : [0, 0];
148
+ }
149
+ export function getQuantileDomain(data, valueAccessor) {
150
+ return getTruthyValues(data, valueAccessor);
151
+ }
152
+ export function getOrdinalDomain(data, valueAccessor) {
153
+ return unique(getTruthyValues(data, valueAccessor));
154
+ }
155
+ export function getScaleDomain(scaleType, data, valueAccessor) {
156
+ switch (scaleType) {
157
+ case 'quantize':
158
+ case 'linear':
159
+ return getLinearDomain(data, valueAccessor);
160
+ case 'quantile':
161
+ return getQuantileDomain(data, valueAccessor);
162
+ case 'ordinal':
163
+ return getOrdinalDomain(data, valueAccessor);
164
+ default:
165
+ return getLinearDomain(data, valueAccessor);
166
+ }
167
+ }
168
+ export function clamp(value, min, max) {
169
+ return Math.max(min, Math.min(max, value));
170
+ }
171
+ export function getScaleFunctionByScaleType(scaleType) {
172
+ switch (scaleType) {
173
+ case 'quantize':
174
+ return getQuantizeScale;
175
+ case 'linear':
176
+ return getLinearScale;
177
+ case 'quantile':
178
+ return getQuantileScale;
179
+ case 'ordinal':
180
+ return getOrdinalScale;
181
+ default:
182
+ return getQuantizeScale;
183
+ }
184
+ }
@@ -1,54 +0,0 @@
1
- # AggregationLayer
2
-
3
- All of the layers in `@deck.gl/aggregation-layers` module perform some sort of data aggregation. All these layers perform aggregation with different parameters (CPU vs GPU, aggregation to rectangular bins vs hexagon bins, world space vs screen space, aggregation of single weight vs multiple weights etc).
4
-
5
- `AggregationLayer` and `GridAggregationLayer` perform most of the common tasks for aggregation with flexibility of customizations. This document describes what `AggregationLayer` does and how to use it in other aggregation layers.
6
-
7
-
8
- `AggregationLayer` is subclassed form `CompositeLayer` and all layers in `@deck.gl/aggregation-layers` are subclassed from this Layer.
9
-
10
- ## Integration with `AttributeManager`
11
-
12
- This layer creates `AttributeManager` and makes it available for its subclasses. Any aggregation layer can add attributes to the `AttributeManager` and retrieve them using `getAttributes` method. This enables using `AttributeManager`'s features and optimization for using attributes. Also manual iteration of `data` prop can be removed and attributes can be directly set on GPU aggregation models or accessed directly for CPU aggregation.
13
-
14
- Example: Adding attributes to an aggregation layer
15
-
16
- ```
17
- const attributeManager = this.getAttributeManager();
18
- attributeManager.add({
19
- positions: {size: 3, accessor: 'getPosition'},
20
- color: {size: 3, accessor: 'getColorWeight'},
21
- elevation: {size: 3, accessor: 'getElevationWeight'}
22
- });
23
- ```
24
-
25
- ## updateState()
26
-
27
- During update state, Subclasses of `AggregationLayer` must first call 'super.updateState()', which calls
28
-
29
- - `updateShaders(shaders)` : Subclasses can override this if they need to update shaders, for example, when performing GPU aggregation, aggregation shaders must be merged with argument of this function to correctly apply `extensions`.
30
-
31
- - `_updateAttributes`: This checks and updates attributes based on updated props.
32
-
33
- ## Checking if aggregation is dirty
34
-
35
- ### Dimensions
36
-
37
- Typical aggregation, involves :
38
- 1. Group the input data points into bins
39
- 2. Compute the aggregated value for each bin
40
-
41
- For example, when `cellSize` or `data` is changed, layer needs to perform both `1` and `2` steps, when a parameter affecting a bin's value is changed (like `getWeight` accessor), layer only need to perform step `2`.
42
-
43
- When doing CPU Aggregation, both above steps are performed individually. But for GPU aggregation, both are merged into single render call.
44
-
45
- To support what state is dirty, constructor takes `dimensions` object, which contains, several keyed dimensions. It must contain `data` dimension that defines, when re-aggregation needs to be performed.
46
-
47
- ### isAggregationDirty()
48
-
49
- This helper can be used if a dimension is changed. Sublayers can defined custom dimensions and call this method to check if a dimension is changed.
50
-
51
-
52
- ### isAttributeChanged()
53
-
54
- `AggregationLayer` tracks what attributes are changed in each update cycle. Super classes can use `isAttributeChanged()` method to check if a specific attribute is changed or any attribute is changed.
@@ -1,46 +0,0 @@
1
- # GridAggregationLayer
2
-
3
- This layer performs some common tasks required to perform aggregation to grid cells, especially it takes care of deciding CPU vs GPU aggregation, allocating resources for GPU aggregation and uploading results.
4
-
5
- This in an abstract layer, subclassed form `AggregationLayer`, `GPUGridLayer`, `ScreenGridLayer` and `ContourLayer` are subclassed from this layer.
6
-
7
- ## updateState()
8
-
9
- During `updateState()`, it calls `updateAggregationState()` which sub classes must implement. During this method, sub classes must set following aggregation flags and aggregation params.
10
-
11
- ### Aggregation Flags
12
-
13
- * `gpuAggregation`: When `true` aggregation happens on GPU, otherwise on CPU.
14
- * `aggregationDataDirty` : When `true` data is re-aggregated.
15
- * `aggregationWeightsDirty` : This flag is applicable only for CPU aggregation. When `true`, bin's aggregated values are re computed.
16
-
17
- ## Aggregation Parameters
18
-
19
- * `gridOffset` : Grid's cell size in the format {xOffset, yOffset}.
20
- * `projectPoints` : Should be `true` when doing screen space aggregation, when `false` it implies world space aggregation.
21
- * `attributes` : Layer's current set of attributes which provide position and weights to CPU/GPU aggregators.
22
- * `viewport` : current viewport object.
23
- * `posOffset` : Offset to be added to object's position before aggregating.
24
- * `boundingBox` : Bounding box of the input data.
25
- Following are applicable for GPU aggregation only:
26
- * `translation` : [xTranslation, yTranslation], position translation to be applied on positions.
27
- * `scaling` : [xScale, yScale, flag], scaling to be applied on positions. When scaling not needed `flag` should be set to `0`.
28
- * `vertexCount` : Number of objects to be aggregated.
29
- * `moduleSettings` : Object with set of fields required for applying shader modules.
30
-
31
-
32
- ## updateResults()
33
-
34
- When aggregation performed on CPU, aggregation result is in JS Array objects. Subclasses can override this method to consume aggregation data. This method is called with an object with following fields:
35
- * `aggregationData` (*Float32Array*) - Array containing aggregation data per grid cell. Four elements per grid cell in the format `[value, 0, 0, count]`, where `value` is the aggregated weight value, up to 3 different weights. `count` is the number of objects aggregated to the grid cell.
36
- * `maxMinData` (*Float32Array*) - Array with four values in format, `[maxValue, 0, 0, minValue]`, where `maxValue` is max of all aggregated cells.
37
- * `maxData` (*Float32Array*) - Array with four values in format, `[maxValue, 0, 0, count]`, where `maxValue` is max of all aggregated cells and `count` is total number aggregated objects.
38
- * `minData` (*Float32Array*) - Array with four values in format, `[minValue, 0, 0, count]`, where `minValue` is min of all aggregated cells and `count` is total number aggregated objects.
39
-
40
- NOTE: The goal is to match format of CPU aggregation results to that of GPU aggregation, so consumers of this data (Sublayers) don't have to change.
41
-
42
- ## allocateResources()
43
-
44
- Called with following arguments to allocated resources required to hold aggregation results.
45
- * `numRow` (*Number*) - Number of rows in the grid.
46
- * `numCol` (*Number*) - Number of columns in the grid.
@@ -1,54 +0,0 @@
1
- # AggregationLayer
2
-
3
- All of the layers in `@deck.gl/aggregation-layers` module perform some sort of data aggregation. All these layers perform aggregation with different parameters (CPU vs GPU, aggregation to rectangular bins vs hexagon bins, world space vs screen space, aggregation of single weight vs multiple weights etc).
4
-
5
- `AggregationLayer` and `GridAggregationLayer` perform most of the common tasks for aggregation with flexibility of customizations. This document describes what `AggregationLayer` does and how to use it in other aggregation layers.
6
-
7
-
8
- `AggregationLayer` is subclassed form `CompositeLayer` and all layers in `@deck.gl/aggregation-layers` are subclassed from this Layer.
9
-
10
- ## Integration with `AttributeManager`
11
-
12
- This layer creates `AttributeManager` and makes it available for its subclasses. Any aggregation layer can add attributes to the `AttributeManager` and retrieve them using `getAttributes` method. This enables using `AttributeManager`'s features and optimization for using attributes. Also manual iteration of `data` prop can be removed and attributes can be directly set on GPU aggregation models or accessed directly for CPU aggregation.
13
-
14
- Example: Adding attributes to an aggregation layer
15
-
16
- ```
17
- const attributeManager = this.getAttributeManager();
18
- attributeManager.add({
19
- positions: {size: 3, accessor: 'getPosition'},
20
- color: {size: 3, accessor: 'getColorWeight'},
21
- elevation: {size: 3, accessor: 'getElevationWeight'}
22
- });
23
- ```
24
-
25
- ## updateState()
26
-
27
- During update state, Subclasses of `AggregationLayer` must first call 'super.updateState()', which calls
28
-
29
- - `updateShaders(shaders)` : Subclasses can override this if they need to update shaders, for example, when performing GPU aggregation, aggregation shaders must be merged with argument of this function to correctly apply `extensions`.
30
-
31
- - `_updateAttributes`: This checks and updates attributes based on updated props.
32
-
33
- ## Checking if aggregation is dirty
34
-
35
- ### Dimensions
36
-
37
- Typical aggregation, involves :
38
- 1. Group the input data points into bins
39
- 2. Compute the aggregated value for each bin
40
-
41
- For example, when `cellSize` or `data` is changed, layer needs to perform both `1` and `2` steps, when a parameter affecting a bin's value is changed (like `getWeight` accessor), layer only need to perform step `2`.
42
-
43
- When doing CPU Aggregation, both above steps are performed individually. But for GPU aggregation, both are merged into single render call.
44
-
45
- To support what state is dirty, constructor takes `dimensions` object, which contains, several keyed dimensions. It must contain `data` dimension that defines, when re-aggregation needs to be performed.
46
-
47
- ### isAggregationDirty()
48
-
49
- This helper can be used if a dimension is changed. Sublayers can defined custom dimensions and call this method to check if a dimension is changed.
50
-
51
-
52
- ### isAttributeChanged()
53
-
54
- `AggregationLayer` tracks what attributes are changed in each update cycle. Super classes can use `isAttributeChanged()` method to check if a specific attribute is changed or any attribute is changed.
@@ -1,46 +0,0 @@
1
- # GridAggregationLayer
2
-
3
- This layer performs some common tasks required to perform aggregation to grid cells, especially it takes care of deciding CPU vs GPU aggregation, allocating resources for GPU aggregation and uploading results.
4
-
5
- This in an abstract layer, subclassed form `AggregationLayer`, `GPUGridLayer`, `ScreenGridLayer` and `ContourLayer` are subclassed from this layer.
6
-
7
- ## updateState()
8
-
9
- During `updateState()`, it calls `updateAggregationState()` which sub classes must implement. During this method, sub classes must set following aggregation flags and aggregation params.
10
-
11
- ### Aggregation Flags
12
-
13
- * `gpuAggregation`: When `true` aggregation happens on GPU, otherwise on CPU.
14
- * `aggregationDataDirty` : When `true` data is re-aggregated.
15
- * `aggregationWeightsDirty` : This flag is applicable only for CPU aggregation. When `true`, bin's aggregated values are re computed.
16
-
17
- ## Aggregation Parameters
18
-
19
- * `gridOffset` : Grid's cell size in the format {xOffset, yOffset}.
20
- * `projectPoints` : Should be `true` when doing screen space aggregation, when `false` it implies world space aggregation.
21
- * `attributes` : Layer's current set of attributes which provide position and weights to CPU/GPU aggregators.
22
- * `viewport` : current viewport object.
23
- * `posOffset` : Offset to be added to object's position before aggregating.
24
- * `boundingBox` : Bounding box of the input data.
25
- Following are applicable for GPU aggregation only:
26
- * `translation` : [xTranslation, yTranslation], position translation to be applied on positions.
27
- * `scaling` : [xScale, yScale, flag], scaling to be applied on positions. When scaling not needed `flag` should be set to `0`.
28
- * `vertexCount` : Number of objects to be aggregated.
29
- * `moduleSettings` : Object with set of fields required for applying shader modules.
30
-
31
-
32
- ## updateResults()
33
-
34
- When aggregation performed on CPU, aggregation result is in JS Array objects. Subclasses can override this method to consume aggregation data. This method is called with an object with following fields:
35
- * `aggregationData` (*Float32Array*) - Array containing aggregation data per grid cell. Four elements per grid cell in the format `[value, 0, 0, count]`, where `value` is the aggregated weight value, up to 3 different weights. `count` is the number of objects aggregated to the grid cell.
36
- * `maxMinData` (*Float32Array*) - Array with four values in format, `[maxValue, 0, 0, minValue]`, where `maxValue` is max of all aggregated cells.
37
- * `maxData` (*Float32Array*) - Array with four values in format, `[maxValue, 0, 0, count]`, where `maxValue` is max of all aggregated cells and `count` is total number aggregated objects.
38
- * `minData` (*Float32Array*) - Array with four values in format, `[minValue, 0, 0, count]`, where `minValue` is min of all aggregated cells and `count` is total number aggregated objects.
39
-
40
- NOTE: The goal is to match format of CPU aggregation results to that of GPU aggregation, so consumers of this data (Sublayers) don't have to change.
41
-
42
- ## allocateResources()
43
-
44
- Called with following arguments to allocated resources required to hold aggregation results.
45
- * `numRow` (*Number*) - Number of rows in the grid.
46
- * `numCol` (*Number*) - Number of columns in the grid.
@@ -1,54 +0,0 @@
1
- # AggregationLayer
2
-
3
- All of the layers in `@deck.gl/aggregation-layers` module perform some sort of data aggregation. All these layers perform aggregation with different parameters (CPU vs GPU, aggregation to rectangular bins vs hexagon bins, world space vs screen space, aggregation of single weight vs multiple weights etc).
4
-
5
- `AggregationLayer` and `GridAggregationLayer` perform most of the common tasks for aggregation with flexibility of customizations. This document describes what `AggregationLayer` does and how to use it in other aggregation layers.
6
-
7
-
8
- `AggregationLayer` is subclassed form `CompositeLayer` and all layers in `@deck.gl/aggregation-layers` are subclassed from this Layer.
9
-
10
- ## Integration with `AttributeManager`
11
-
12
- This layer creates `AttributeManager` and makes it available for its subclasses. Any aggregation layer can add attributes to the `AttributeManager` and retrieve them using `getAttributes` method. This enables using `AttributeManager`'s features and optimization for using attributes. Also manual iteration of `data` prop can be removed and attributes can be directly set on GPU aggregation models or accessed directly for CPU aggregation.
13
-
14
- Example: Adding attributes to an aggregation layer
15
-
16
- ```
17
- const attributeManager = this.getAttributeManager();
18
- attributeManager.add({
19
- positions: {size: 3, accessor: 'getPosition'},
20
- color: {size: 3, accessor: 'getColorWeight'},
21
- elevation: {size: 3, accessor: 'getElevationWeight'}
22
- });
23
- ```
24
-
25
- ## updateState()
26
-
27
- During update state, Subclasses of `AggregationLayer` must first call 'super.updateState()', which calls
28
-
29
- - `updateShaders(shaders)` : Subclasses can override this if they need to update shaders, for example, when performing GPU aggregation, aggregation shaders must be merged with argument of this function to correctly apply `extensions`.
30
-
31
- - `_updateAttributes`: This checks and updates attributes based on updated props.
32
-
33
- ## Checking if aggregation is dirty
34
-
35
- ### Dimensions
36
-
37
- Typical aggregation, involves :
38
- 1. Group the input data points into bins
39
- 2. Compute the aggregated value for each bin
40
-
41
- For example, when `cellSize` or `data` is changed, layer needs to perform both `1` and `2` steps, when a parameter affecting a bin's value is changed (like `getWeight` accessor), layer only need to perform step `2`.
42
-
43
- When doing CPU Aggregation, both above steps are performed individually. But for GPU aggregation, both are merged into single render call.
44
-
45
- To support what state is dirty, constructor takes `dimensions` object, which contains, several keyed dimensions. It must contain `data` dimension that defines, when re-aggregation needs to be performed.
46
-
47
- ### isAggregationDirty()
48
-
49
- This helper can be used if a dimension is changed. Sublayers can defined custom dimensions and call this method to check if a dimension is changed.
50
-
51
-
52
- ### isAttributeChanged()
53
-
54
- `AggregationLayer` tracks what attributes are changed in each update cycle. Super classes can use `isAttributeChanged()` method to check if a specific attribute is changed or any attribute is changed.