@deck.gl/carto 8.8.0-alpha.5 → 8.8.0-beta.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.
- package/dist/dist.dev.js +13886 -13809
- package/dist/es5/api/layer-map.js +7 -5
- package/dist/es5/api/layer-map.js.map +1 -1
- package/dist/es5/layers/carto-layer.js.map +1 -1
- package/dist/es5/layers/carto-tile-layer.js.map +1 -1
- package/dist/es5/layers/h3-tile-layer.js +20 -10
- package/dist/es5/layers/h3-tile-layer.js.map +1 -1
- package/dist/es5/layers/h3-tileset-2d.js +4 -8
- package/dist/es5/layers/h3-tileset-2d.js.map +1 -1
- package/dist/es5/layers/quadkey-tile-layer.js +23 -12
- package/dist/es5/layers/quadkey-tile-layer.js.map +1 -1
- package/dist/es5/layers/quadkey-tileset-2d.js.map +1 -1
- package/dist/es5/layers/spatial-index-tile-layer.js +3 -0
- package/dist/es5/layers/spatial-index-tile-layer.js.map +1 -1
- package/dist/esm/api/layer-map.js +8 -6
- package/dist/esm/api/layer-map.js.map +1 -1
- package/dist/esm/layers/carto-layer.js.map +1 -1
- package/dist/esm/layers/carto-tile-layer.js.map +1 -1
- package/dist/esm/layers/h3-tile-layer.js +12 -6
- package/dist/esm/layers/h3-tile-layer.js.map +1 -1
- package/dist/esm/layers/h3-tileset-2d.js +5 -9
- package/dist/esm/layers/h3-tileset-2d.js.map +1 -1
- package/dist/esm/layers/quadkey-tile-layer.js +15 -8
- package/dist/esm/layers/quadkey-tile-layer.js.map +1 -1
- package/dist/esm/layers/quadkey-tileset-2d.js.map +1 -1
- package/dist/esm/layers/spatial-index-tile-layer.js +3 -0
- package/dist/esm/layers/spatial-index-tile-layer.js.map +1 -1
- package/dist.min.js +4 -4
- package/package.json +10 -9
- package/src/api/layer-map.ts +16 -7
- package/src/layers/carto-layer.ts +19 -7
- package/src/layers/carto-tile-layer.ts +3 -3
- package/src/layers/h3-tile-layer.ts +79 -0
- package/src/layers/{h3-tileset-2d.js → h3-tileset-2d.ts} +29 -26
- package/src/layers/quadkey-tile-layer.ts +69 -0
- package/src/layers/{quadkey-tileset-2d.js → quadkey-tileset-2d.ts} +10 -5
- package/src/layers/{spatial-index-tile-layer.js → spatial-index-tile-layer.ts} +9 -6
- package/typed/api/index.d.ts +4 -0
- package/typed/api/index.d.ts.map +1 -0
- package/typed/api/index.js +3 -0
- package/typed/api/layer-map.d.ts +54 -0
- package/typed/api/layer-map.d.ts.map +1 -0
- package/typed/api/layer-map.js +264 -0
- package/typed/api/maps-api-common.d.ts +65 -0
- package/typed/api/maps-api-common.d.ts.map +1 -0
- package/typed/api/maps-api-common.js +50 -0
- package/typed/api/maps-client.d.ts +18 -0
- package/typed/api/maps-client.d.ts.map +1 -0
- package/typed/api/maps-client.js +125 -0
- package/typed/api/maps-v3-client.d.ts +45 -0
- package/typed/api/maps-v3-client.d.ts.map +1 -0
- package/typed/api/maps-v3-client.js +304 -0
- package/typed/api/parseMap.d.ts +11 -0
- package/typed/api/parseMap.d.ts.map +1 -0
- package/typed/api/parseMap.js +178 -0
- package/typed/basemap.d.ts +10 -0
- package/typed/basemap.d.ts.map +1 -0
- package/typed/basemap.js +9 -0
- package/typed/config.d.ts +26 -0
- package/typed/config.d.ts.map +1 -0
- package/typed/config.js +35 -0
- package/typed/index.d.ts +12 -0
- package/typed/index.d.ts.map +1 -0
- package/typed/index.js +10 -0
- package/typed/layers/carto-layer.d.ts +96 -0
- package/typed/layers/carto-layer.d.ts.map +1 -0
- package/typed/layers/carto-layer.js +173 -0
- package/typed/layers/carto-tile-layer.d.ts +30 -0
- package/typed/layers/carto-tile-layer.d.ts.map +1 -0
- package/typed/layers/carto-tile-layer.js +105 -0
- package/typed/layers/h3-tile-layer.d.ts +21 -0
- package/typed/layers/h3-tile-layer.d.ts.map +1 -0
- package/typed/layers/h3-tile-layer.js +47 -0
- package/typed/layers/h3-tileset-2d.d.ts +18 -0
- package/typed/layers/h3-tileset-2d.d.ts.map +1 -0
- package/typed/layers/h3-tileset-2d.js +85 -0
- package/typed/layers/quadkey-tile-layer.d.ts +21 -0
- package/typed/layers/quadkey-tile-layer.d.ts.map +1 -0
- package/typed/layers/quadkey-tile-layer.js +42 -0
- package/typed/layers/quadkey-tileset-2d.d.ts +15 -0
- package/typed/layers/quadkey-tileset-2d.d.ts.map +1 -0
- package/typed/layers/quadkey-tileset-2d.js +36 -0
- package/typed/layers/schema/carto-tile.d.ts +44 -0
- package/typed/layers/schema/carto-tile.d.ts.map +1 -0
- package/typed/layers/schema/carto-tile.js +161 -0
- package/typed/layers/spatial-index-tile-layer.d.ts +12 -0
- package/typed/layers/spatial-index-tile-layer.d.ts.map +1 -0
- package/typed/layers/spatial-index-tile-layer.js +40 -0
- package/typed/package.json +6 -0
- package/typed/style/color-bins-style.d.ts +9 -0
- package/typed/style/color-bins-style.d.ts.map +1 -0
- package/typed/style/color-bins-style.js +12 -0
- package/typed/style/color-categories-style.d.ts +10 -0
- package/typed/style/color-categories-style.d.ts.map +1 -0
- package/typed/style/color-categories-style.js +16 -0
- package/typed/style/color-continuous-style.d.ts +9 -0
- package/typed/style/color-continuous-style.d.ts.map +1 -0
- package/typed/style/color-continuous-style.js +12 -0
- package/typed/style/palette.d.ts +7 -0
- package/typed/style/palette.d.ts.map +1 -0
- package/typed/style/palette.js +62 -0
- package/typed/style/utils.d.ts +8 -0
- package/typed/style/utils.d.ts.map +1 -0
- package/typed/style/utils.js +15 -0
- package/typed/utils.d.ts +2 -0
- package/typed/utils.d.ts.map +1 -0
- package/typed/utils.js +4 -0
- package/src/layers/h3-tile-layer.js +0 -52
- package/src/layers/quadkey-tile-layer.js +0 -47
package/package.json
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
"name": "@deck.gl/carto",
|
|
3
3
|
"description": "CARTO official integration with Deck.gl. Build geospatial applications using CARTO and Deck.gl.",
|
|
4
4
|
"license": "MIT",
|
|
5
|
-
"version": "8.8.0-
|
|
5
|
+
"version": "8.8.0-beta.2",
|
|
6
6
|
"publishConfig": {
|
|
7
7
|
"access": "public"
|
|
8
8
|
},
|
|
@@ -32,22 +32,23 @@
|
|
|
32
32
|
"prepublishOnly": "npm run build-bundle && npm run build-bundle -- --env.dev"
|
|
33
33
|
},
|
|
34
34
|
"dependencies": {
|
|
35
|
-
"@loaders.gl/gis": "^3.2.0
|
|
36
|
-
"@loaders.gl/loader-utils": "^3.2.0
|
|
37
|
-
"@loaders.gl/mvt": "^3.2.0
|
|
38
|
-
"@loaders.gl/tiles": "^3.2.0
|
|
39
|
-
"@luma.gl/constants": "^8.5.
|
|
40
|
-
"@math.gl/web-mercator": "3.6.0
|
|
35
|
+
"@loaders.gl/gis": "^3.2.0",
|
|
36
|
+
"@loaders.gl/loader-utils": "^3.2.0",
|
|
37
|
+
"@loaders.gl/mvt": "^3.2.0",
|
|
38
|
+
"@loaders.gl/tiles": "^3.2.0",
|
|
39
|
+
"@luma.gl/constants": "^8.5.14",
|
|
40
|
+
"@math.gl/web-mercator": "^3.6.0",
|
|
41
41
|
"cartocolor": "^4.0.2",
|
|
42
42
|
"d3-array": "^2.8.0",
|
|
43
43
|
"d3-color": "^2.0.0",
|
|
44
44
|
"d3-format": "^2.0.0",
|
|
45
45
|
"d3-scale": "^3.2.3",
|
|
46
|
+
"h3-js": "^3.7.0",
|
|
46
47
|
"moment-timezone": "^0.5.33",
|
|
47
48
|
"pbf": "^3.2.1"
|
|
48
49
|
},
|
|
49
50
|
"devDependencies": {
|
|
50
|
-
"@loaders.gl/schema": "^3.2.0
|
|
51
|
+
"@loaders.gl/schema": "^3.2.0",
|
|
51
52
|
"@types/d3-array": "^3.0.2",
|
|
52
53
|
"@types/d3-color": "^1.4.2",
|
|
53
54
|
"@types/d3-scale": "^3.0.0"
|
|
@@ -60,5 +61,5 @@
|
|
|
60
61
|
"@deck.gl/layers": "^8.0.0",
|
|
61
62
|
"@loaders.gl/core": "^3.0.0"
|
|
62
63
|
},
|
|
63
|
-
"gitHead": "
|
|
64
|
+
"gitHead": "d9bae59d015387c547366465d75d80950c60a34e"
|
|
64
65
|
}
|
package/src/api/layer-map.ts
CHANGED
|
@@ -13,6 +13,7 @@ import {
|
|
|
13
13
|
import {format as d3Format} from 'd3-format';
|
|
14
14
|
import moment from 'moment-timezone';
|
|
15
15
|
|
|
16
|
+
import {Layer, _ConstructorOf as ConstructorOf} from '@deck.gl/core';
|
|
16
17
|
import {CPUGridLayer, HeatmapLayer, HexagonLayer} from '@deck.gl/aggregation-layers';
|
|
17
18
|
import {GeoJsonLayer} from '@deck.gl/layers';
|
|
18
19
|
import {H3HexagonLayer, MVTLayer} from '@deck.gl/geo-layers';
|
|
@@ -101,7 +102,7 @@ const defaultProps = {
|
|
|
101
102
|
wrapLongitude: false
|
|
102
103
|
};
|
|
103
104
|
|
|
104
|
-
function mergePropMaps(a = {}, b = {}) {
|
|
105
|
+
function mergePropMaps(a: Record<string, any> = {}, b: Record<string, any> = {}) {
|
|
105
106
|
return {...a, ...b, visConfig: {...a.visConfig, ...b.visConfig}};
|
|
106
107
|
}
|
|
107
108
|
|
|
@@ -109,7 +110,7 @@ export function getLayer(
|
|
|
109
110
|
type: string,
|
|
110
111
|
config,
|
|
111
112
|
dataset
|
|
112
|
-
): {Layer:
|
|
113
|
+
): {Layer: ConstructorOf<Layer>; propMap: any; defaultProps: any} {
|
|
113
114
|
if (type === 'mvt' || type === 'tileset') {
|
|
114
115
|
return getTileLayer(dataset);
|
|
115
116
|
}
|
|
@@ -118,7 +119,11 @@ export function getLayer(
|
|
|
118
119
|
const getPosition = d => d[geoColumn].coordinates;
|
|
119
120
|
|
|
120
121
|
const hexagonId = config.columns?.hex_id;
|
|
121
|
-
|
|
122
|
+
|
|
123
|
+
const layerTypeDefs: Record<
|
|
124
|
+
string,
|
|
125
|
+
{Layer: ConstructorOf<Layer>; propMap?: any; defaultProps?: any}
|
|
126
|
+
> = {
|
|
122
127
|
point: {
|
|
123
128
|
Layer: GeoJsonLayer,
|
|
124
129
|
propMap: {visConfig: {outline: 'stroked'}}
|
|
@@ -146,12 +151,16 @@ export function getLayer(
|
|
|
146
151
|
propMap: {visConfig: {coverage: 'coverage'}},
|
|
147
152
|
defaultProps: {getHexagon: d => d[hexagonId], stroked: false}
|
|
148
153
|
}
|
|
149
|
-
}
|
|
154
|
+
};
|
|
155
|
+
|
|
156
|
+
const layer = layerTypeDefs[type];
|
|
150
157
|
|
|
151
158
|
assert(layer, `Unsupported layer type: ${type}`);
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
159
|
+
return {
|
|
160
|
+
...layer,
|
|
161
|
+
propMap: mergePropMaps(sharedPropMap, layer.propMap),
|
|
162
|
+
defaultProps: {...defaultProps, ...layer.defaultProps}
|
|
163
|
+
};
|
|
155
164
|
}
|
|
156
165
|
|
|
157
166
|
function getTileLayer(dataset) {
|
|
@@ -1,4 +1,11 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import {
|
|
2
|
+
CompositeLayer,
|
|
3
|
+
Layer,
|
|
4
|
+
log,
|
|
5
|
+
CompositeLayerProps,
|
|
6
|
+
LayerProps,
|
|
7
|
+
ChangeFlags
|
|
8
|
+
} from '@deck.gl/core';
|
|
2
9
|
import CartoTileLayer from './carto-tile-layer';
|
|
3
10
|
import H3TileLayer from './h3-tile-layer';
|
|
4
11
|
import QuadkeyTileLayer from './quadkey-tile-layer';
|
|
@@ -21,8 +28,6 @@ import {
|
|
|
21
28
|
Credentials,
|
|
22
29
|
getDefaultCredentials
|
|
23
30
|
} from '../config';
|
|
24
|
-
import {CompositeLayerProps, LayerProps} from 'modules/core/src/types/layer-props';
|
|
25
|
-
import {ChangeFlags} from 'modules/core/src/lib/layer-state';
|
|
26
31
|
import {FetchLayerDataResult} from '../api/maps-v3-client';
|
|
27
32
|
import {assert} from '../utils';
|
|
28
33
|
|
|
@@ -66,7 +71,11 @@ const defaultProps = {
|
|
|
66
71
|
aggregationResLevel: null
|
|
67
72
|
};
|
|
68
73
|
|
|
69
|
-
|
|
74
|
+
/** All properties supported by CartoLayer. */
|
|
75
|
+
export type CartoLayerProps<DataT = any> = _CartoLayerProps & CompositeLayerProps<DataT>;
|
|
76
|
+
|
|
77
|
+
/** Properties added by CartoLayer. */
|
|
78
|
+
type _CartoLayerProps = {
|
|
70
79
|
/**
|
|
71
80
|
* Either a SQL query or a name of dataset/tileset.
|
|
72
81
|
*/
|
|
@@ -147,9 +156,11 @@ export interface CartoLayerProps<DataT = any> extends CompositeLayerProps<DataT>
|
|
|
147
156
|
onDataError?: (err: unknown) => void;
|
|
148
157
|
|
|
149
158
|
clientId?: string;
|
|
150
|
-
}
|
|
159
|
+
};
|
|
151
160
|
|
|
152
|
-
export default class CartoLayer<
|
|
161
|
+
export default class CartoLayer<ExtraProps = {}> extends CompositeLayer<
|
|
162
|
+
Required<_CartoLayerProps> & ExtraProps
|
|
163
|
+
> {
|
|
153
164
|
static layerName = 'CartoLayer';
|
|
154
165
|
static defaultProps = defaultProps as any;
|
|
155
166
|
|
|
@@ -237,7 +248,7 @@ export default class CartoLayer<DataT = any> extends CompositeLayer<CartoLayerPr
|
|
|
237
248
|
const localConfig = {...getDefaultCredentials(), ...credentials};
|
|
238
249
|
const {apiVersion} = localConfig;
|
|
239
250
|
|
|
240
|
-
let result: FetchLayerDataResult
|
|
251
|
+
let result: Partial<FetchLayerDataResult>;
|
|
241
252
|
if (apiVersion === API_VERSIONS.V1 || apiVersion === API_VERSIONS.V2) {
|
|
242
253
|
result = {
|
|
243
254
|
data: await getDataV2({type, source, credentials: credentials as ClassicCredentials})
|
|
@@ -276,6 +287,7 @@ export default class CartoLayer<DataT = any> extends CompositeLayer<CartoLayerPr
|
|
|
276
287
|
const {uniqueIdProperty} = defaultProps;
|
|
277
288
|
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
278
289
|
const {data: _notUsed, ...propsNoData} = this.props;
|
|
290
|
+
// @ts-expect-error 'uniqueIdProperty' is specified more than once, so this usage will be overwritten.
|
|
279
291
|
const props = {uniqueIdProperty, ...propsNoData};
|
|
280
292
|
|
|
281
293
|
if (apiVersion === API_VERSIONS.V1 || apiVersion === API_VERSIONS.V2) {
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/* global TextDecoder */
|
|
2
2
|
import Protobuf from 'pbf';
|
|
3
|
-
import {
|
|
3
|
+
import {log, DefaultProps} from '@deck.gl/core';
|
|
4
4
|
import {ClipExtension} from '@deck.gl/extensions';
|
|
5
5
|
import {
|
|
6
6
|
MVTLayer,
|
|
@@ -79,7 +79,7 @@ const CartoTileLoader: LoaderWithParser = {
|
|
|
79
79
|
}
|
|
80
80
|
};
|
|
81
81
|
|
|
82
|
-
const defaultProps = {
|
|
82
|
+
const defaultProps: DefaultProps<CartoTileLayerProps> = {
|
|
83
83
|
...MVTLayer.defaultProps,
|
|
84
84
|
formatTiles: defaultTileFormat,
|
|
85
85
|
loaders: [CartoTileLoader]
|
|
@@ -96,7 +96,7 @@ type _CartoTileLayerProps = {
|
|
|
96
96
|
* Possible values are: `TILE_FORMATS.BINARY`, `TILE_FORMATS.GEOJSON` and `TILE_FORMATS.MVT`.
|
|
97
97
|
*
|
|
98
98
|
* Only supported when `apiVersion` is `API_VERSIONS.V3` and `format` is `FORMATS.TILEJSON`.
|
|
99
|
-
|
|
99
|
+
*/
|
|
100
100
|
formatTiles?: TileFormat;
|
|
101
101
|
};
|
|
102
102
|
|
|
@@ -0,0 +1,79 @@
|
|
|
1
|
+
import {
|
|
2
|
+
CompositeLayer,
|
|
3
|
+
CompositeLayerProps,
|
|
4
|
+
Layer,
|
|
5
|
+
LayersList,
|
|
6
|
+
UpdateParameters,
|
|
7
|
+
DefaultProps
|
|
8
|
+
} from '@deck.gl/core';
|
|
9
|
+
import {H3HexagonLayer} from '@deck.gl/geo-layers';
|
|
10
|
+
import H3Tileset2D from './h3-tileset-2d';
|
|
11
|
+
import SpatialIndexTileLayer from './spatial-index-tile-layer';
|
|
12
|
+
|
|
13
|
+
const renderSubLayers = props => {
|
|
14
|
+
const {data} = props;
|
|
15
|
+
const {index} = props.tile;
|
|
16
|
+
if (!data || !data.length) return null;
|
|
17
|
+
|
|
18
|
+
return new H3HexagonLayer(props, {
|
|
19
|
+
getHexagon: d => d.id,
|
|
20
|
+
centerHexagon: index,
|
|
21
|
+
highPrecision: true
|
|
22
|
+
});
|
|
23
|
+
};
|
|
24
|
+
|
|
25
|
+
const defaultProps: DefaultProps<H3HexagonLayerProps> = {
|
|
26
|
+
aggregationResLevel: 4
|
|
27
|
+
};
|
|
28
|
+
|
|
29
|
+
/** All properties supported by H3TileLayer. */
|
|
30
|
+
export type H3TileLayerProps<DataT = any> = _H3TileLayerProps<DataT> & CompositeLayerProps<DataT>;
|
|
31
|
+
|
|
32
|
+
// TODO: use type from h3-hexagon-layer when available
|
|
33
|
+
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
34
|
+
type H3HexagonLayerProps<DataT = any> = Record<string, any>;
|
|
35
|
+
|
|
36
|
+
/** Properties added by H3TileLayer. */
|
|
37
|
+
type _H3TileLayerProps<DataT> = H3HexagonLayerProps<DataT> & {
|
|
38
|
+
aggregationResLevel?: number;
|
|
39
|
+
};
|
|
40
|
+
|
|
41
|
+
export default class H3TileLayer<DataT = any, ExtraPropsT = {}> extends CompositeLayer<
|
|
42
|
+
ExtraPropsT & Required<_H3TileLayerProps<DataT>>
|
|
43
|
+
> {
|
|
44
|
+
static layerName = 'H3TileLayer';
|
|
45
|
+
static defaultProps = defaultProps;
|
|
46
|
+
|
|
47
|
+
state!: {
|
|
48
|
+
tileJSON: any;
|
|
49
|
+
data: any;
|
|
50
|
+
};
|
|
51
|
+
|
|
52
|
+
initializeState(): void {
|
|
53
|
+
this.setState({data: null, tileJSON: null});
|
|
54
|
+
}
|
|
55
|
+
|
|
56
|
+
updateState({changeFlags}: UpdateParameters<this>): void {
|
|
57
|
+
if (changeFlags.dataChanged) {
|
|
58
|
+
let {data} = this.props;
|
|
59
|
+
const tileJSON = data;
|
|
60
|
+
data = (tileJSON as any).tiles;
|
|
61
|
+
this.setState({data, tileJSON});
|
|
62
|
+
}
|
|
63
|
+
}
|
|
64
|
+
|
|
65
|
+
renderLayers(): Layer | null | LayersList {
|
|
66
|
+
const {data, tileJSON} = this.state;
|
|
67
|
+
const maxZoom = parseInt(tileJSON.maxresolution);
|
|
68
|
+
return [
|
|
69
|
+
new SpatialIndexTileLayer(this.props, {
|
|
70
|
+
id: `h3-tile-layer-${this.props.id}`,
|
|
71
|
+
data,
|
|
72
|
+
// @ts-expect-error Tileset2D should be generic over TileIndex
|
|
73
|
+
TilesetClass: H3Tileset2D,
|
|
74
|
+
renderSubLayers,
|
|
75
|
+
maxZoom
|
|
76
|
+
})
|
|
77
|
+
];
|
|
78
|
+
}
|
|
79
|
+
}
|
|
@@ -1,24 +1,22 @@
|
|
|
1
|
-
import {_Tileset2D as Tileset2D} from '@deck.gl/geo-layers';
|
|
2
|
-
import {
|
|
3
|
-
polyfill,
|
|
4
|
-
getRes0Indexes,
|
|
5
|
-
geoToH3,
|
|
6
|
-
h3GetResolution,
|
|
7
|
-
h3ToGeoBoundary,
|
|
8
|
-
h3ToParent,
|
|
9
|
-
kRing
|
|
10
|
-
} from 'h3-js';
|
|
1
|
+
import {_Tileset2D as Tileset2D, GeoBoundingBox} from '@deck.gl/geo-layers';
|
|
2
|
+
import {polyfill, geoToH3, h3GetResolution, h3ToGeoBoundary, h3ToParent, kRing} from 'h3-js';
|
|
11
3
|
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
}
|
|
16
|
-
|
|
4
|
+
export type H3TileIndex = {i: string};
|
|
5
|
+
|
|
6
|
+
function getHexagonsInBoundingBox(
|
|
7
|
+
{west, north, east, south}: GeoBoundingBox,
|
|
8
|
+
resolution: number
|
|
9
|
+
): string[] {
|
|
10
|
+
if (Math.abs(east - west) > 180) {
|
|
17
11
|
// This is a known issue in h3-js: polyfill does not work correctly
|
|
18
12
|
// when longitude span is larger than 180 degrees.
|
|
19
|
-
return
|
|
20
|
-
|
|
21
|
-
|
|
13
|
+
return [
|
|
14
|
+
...new Set(
|
|
15
|
+
getHexagonsInBoundingBox({west, north, east: 0, south}, resolution).concat(
|
|
16
|
+
getHexagonsInBoundingBox({west: 0, north, east, south}, resolution)
|
|
17
|
+
)
|
|
18
|
+
)
|
|
19
|
+
];
|
|
22
20
|
}
|
|
23
21
|
|
|
24
22
|
// `polyfill()` fills based on hexagon center, which means tiles vanish
|
|
@@ -41,7 +39,7 @@ function getHexagonsInBoundingBox({west, north, east, south}, resolution) {
|
|
|
41
39
|
return oversample ? [...new Set(h3Indices.map(i => h3ToParent(i, resolution)))] : h3Indices;
|
|
42
40
|
}
|
|
43
41
|
|
|
44
|
-
function tileToBoundingBox(index) {
|
|
42
|
+
function tileToBoundingBox(index: string): GeoBoundingBox {
|
|
45
43
|
const coordinates = h3ToGeoBoundary(index);
|
|
46
44
|
const latitudes = coordinates.map(c => c[0]);
|
|
47
45
|
const longitudes = coordinates.map(c => c[1]);
|
|
@@ -57,7 +55,7 @@ function tileToBoundingBox(index) {
|
|
|
57
55
|
// similar
|
|
58
56
|
// Relative scale factor (0 = no biasing, 2 = a few hexagons cover view)
|
|
59
57
|
const BIAS = 2;
|
|
60
|
-
function getHexagonResolution(viewport) {
|
|
58
|
+
function getHexagonResolution(viewport): number {
|
|
61
59
|
const hexagonScaleFactor = (2 / 3) * viewport.zoom;
|
|
62
60
|
const latitudeScaleFactor = Math.log(1 / Math.cos((Math.PI * viewport.latitude) / 180));
|
|
63
61
|
|
|
@@ -66,11 +64,12 @@ function getHexagonResolution(viewport) {
|
|
|
66
64
|
}
|
|
67
65
|
|
|
68
66
|
export default class H3Tileset2D extends Tileset2D {
|
|
69
|
-
|
|
67
|
+
// @ts-expect-error Tileset2D should be generic over TileIndex
|
|
68
|
+
getTileIndices({viewport, minZoom, maxZoom}): H3TileIndex[] {
|
|
70
69
|
const [east, south, west, north] = viewport.getBounds();
|
|
71
70
|
|
|
72
71
|
let z = getHexagonResolution(viewport);
|
|
73
|
-
let indices
|
|
72
|
+
let indices: string[];
|
|
74
73
|
if (typeof minZoom === 'number' && Number.isFinite(minZoom) && z < minZoom) {
|
|
75
74
|
z = minZoom;
|
|
76
75
|
}
|
|
@@ -88,19 +87,23 @@ export default class H3Tileset2D extends Tileset2D {
|
|
|
88
87
|
return indices.map(i => ({i}));
|
|
89
88
|
}
|
|
90
89
|
|
|
91
|
-
|
|
90
|
+
// @ts-expect-error Tileset2D should be generic over TileIndex
|
|
91
|
+
getTileId({i}: H3TileIndex): string {
|
|
92
92
|
return i;
|
|
93
93
|
}
|
|
94
94
|
|
|
95
|
-
|
|
95
|
+
// @ts-expect-error Tileset2D should be generic over TileIndex
|
|
96
|
+
getTileMetadata({i}: H3TileIndex) {
|
|
96
97
|
return {bbox: tileToBoundingBox(i)};
|
|
97
98
|
}
|
|
98
99
|
|
|
99
|
-
|
|
100
|
+
// @ts-expect-error Tileset2D should be generic over TileIndex
|
|
101
|
+
getTileZoom({i}: H3TileIndex): number {
|
|
100
102
|
return h3GetResolution(i);
|
|
101
103
|
}
|
|
102
104
|
|
|
103
|
-
|
|
105
|
+
// @ts-expect-error Tileset2D should be generic over TileIndex
|
|
106
|
+
getParentIndex(index: H3TileIndex): H3TileIndex {
|
|
104
107
|
const resolution = h3GetResolution(index.i);
|
|
105
108
|
const i = h3ToParent(index.i, resolution - 1);
|
|
106
109
|
return {i};
|
|
@@ -0,0 +1,69 @@
|
|
|
1
|
+
import {
|
|
2
|
+
CompositeLayer,
|
|
3
|
+
CompositeLayerProps,
|
|
4
|
+
Layer,
|
|
5
|
+
LayersList,
|
|
6
|
+
UpdateParameters,
|
|
7
|
+
DefaultProps
|
|
8
|
+
} from '@deck.gl/core';
|
|
9
|
+
import {QuadkeyLayer, QuadkeyLayerProps} from '@deck.gl/geo-layers';
|
|
10
|
+
import QuadkeyTileset2D from './quadkey-tileset-2d';
|
|
11
|
+
import SpatialIndexTileLayer from './spatial-index-tile-layer';
|
|
12
|
+
|
|
13
|
+
const renderSubLayers = props => {
|
|
14
|
+
const {data} = props;
|
|
15
|
+
if (!data || !data.length) return null;
|
|
16
|
+
return new QuadkeyLayer(props, {getQuadkey: d => d.id});
|
|
17
|
+
};
|
|
18
|
+
|
|
19
|
+
const defaultProps: DefaultProps<QuadkeyTileLayerProps> = {
|
|
20
|
+
aggregationResLevel: 6
|
|
21
|
+
};
|
|
22
|
+
|
|
23
|
+
/** All properties supported by QuadkeyTileLayer. */
|
|
24
|
+
export type QuadkeyTileLayerProps<DataT = any> = _QuadkeyTileLayerProps<DataT> &
|
|
25
|
+
CompositeLayerProps<DataT>;
|
|
26
|
+
|
|
27
|
+
/** Properties added by QuadkeyTileLayer. */
|
|
28
|
+
type _QuadkeyTileLayerProps<DataT> = QuadkeyLayerProps<DataT> & {
|
|
29
|
+
aggregationResLevel?: number;
|
|
30
|
+
};
|
|
31
|
+
|
|
32
|
+
export default class QuadkeyTileLayer<DataT = any, ExtraProps = {}> extends CompositeLayer<
|
|
33
|
+
ExtraProps & Required<_QuadkeyTileLayerProps<DataT>>
|
|
34
|
+
> {
|
|
35
|
+
static layerName = 'QuadkeyTileLayer';
|
|
36
|
+
static defaultProps = defaultProps;
|
|
37
|
+
|
|
38
|
+
state!: {
|
|
39
|
+
tileJSON: any;
|
|
40
|
+
data: any;
|
|
41
|
+
};
|
|
42
|
+
initializeState(): void {
|
|
43
|
+
this.setState({data: null, tileJSON: null});
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
updateState({changeFlags}: UpdateParameters<this>): void {
|
|
47
|
+
if (changeFlags.dataChanged) {
|
|
48
|
+
let {data} = this.props;
|
|
49
|
+
const tileJSON = data;
|
|
50
|
+
data = (tileJSON as any).tiles;
|
|
51
|
+
this.setState({data, tileJSON});
|
|
52
|
+
}
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
renderLayers(): Layer | null | LayersList {
|
|
56
|
+
const {data, tileJSON} = this.state;
|
|
57
|
+
const maxZoom = parseInt(tileJSON?.maxresolution);
|
|
58
|
+
return [
|
|
59
|
+
new SpatialIndexTileLayer(this.props, {
|
|
60
|
+
id: `quadkey-tile-layer-${this.props.id}`,
|
|
61
|
+
data,
|
|
62
|
+
// TODO: Tileset2D should be generic over TileIndex type
|
|
63
|
+
TilesetClass: QuadkeyTileset2D as any,
|
|
64
|
+
renderSubLayers,
|
|
65
|
+
maxZoom
|
|
66
|
+
})
|
|
67
|
+
];
|
|
68
|
+
}
|
|
69
|
+
}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import {_Tileset2D as Tileset2D} from '@deck.gl/geo-layers';
|
|
2
2
|
|
|
3
|
-
|
|
3
|
+
type QuadkeyTileIndex = {i: string};
|
|
4
|
+
function tileToQuadkey(tile): QuadkeyTileIndex {
|
|
4
5
|
let index = '';
|
|
5
6
|
for (let z = tile.z; z > 0; z--) {
|
|
6
7
|
let b = 0;
|
|
@@ -13,11 +14,13 @@ function tileToQuadkey(tile) {
|
|
|
13
14
|
}
|
|
14
15
|
|
|
15
16
|
export default class QuadkeyTileset2D extends Tileset2D {
|
|
16
|
-
|
|
17
|
+
// @ts-expect-error for spatial indices, TileSet2d should be parametrized by TileIndexT
|
|
18
|
+
getTileIndices(opts): QuadkeyTileIndex[] {
|
|
17
19
|
return super.getTileIndices(opts).map(tileToQuadkey);
|
|
18
20
|
}
|
|
19
21
|
|
|
20
|
-
|
|
22
|
+
// @ts-expect-error TileIndex must be generic
|
|
23
|
+
getTileId({i}: QuadkeyTileIndex) {
|
|
21
24
|
return i;
|
|
22
25
|
}
|
|
23
26
|
|
|
@@ -25,11 +28,13 @@ export default class QuadkeyTileset2D extends Tileset2D {
|
|
|
25
28
|
return {};
|
|
26
29
|
}
|
|
27
30
|
|
|
28
|
-
|
|
31
|
+
// @ts-expect-error TileIndex must be generic
|
|
32
|
+
getTileZoom({i}: QuadkeyTileIndex) {
|
|
29
33
|
return i.length;
|
|
30
34
|
}
|
|
31
35
|
|
|
32
|
-
|
|
36
|
+
// @ts-expect-error TileIndex must be generic
|
|
37
|
+
getParentIndex(index: QuadkeyTileIndex) {
|
|
33
38
|
const i = index.i.slice(0, -1);
|
|
34
39
|
return {i};
|
|
35
40
|
}
|
|
@@ -1,11 +1,14 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import {PickingInfo} from '@deck.gl/core';
|
|
2
|
+
import {TileLayer, _Tile2DHeader as Tile2DHeader} from '@deck.gl/geo-layers';
|
|
2
3
|
|
|
3
|
-
function isFeatureIdDefined(value) {
|
|
4
|
+
function isFeatureIdDefined(value: unknown): boolean {
|
|
4
5
|
return value !== undefined && value !== null && value !== '';
|
|
5
6
|
}
|
|
6
7
|
|
|
7
|
-
export default class SpatialIndexTileLayer extends TileLayer {
|
|
8
|
-
|
|
8
|
+
export default class SpatialIndexTileLayer<ExtraProps = {}> extends TileLayer<any, ExtraProps> {
|
|
9
|
+
static layerName = 'SpatialIndexTileLayer';
|
|
10
|
+
|
|
11
|
+
protected _updateAutoHighlight(info: PickingInfo): void {
|
|
9
12
|
const {hoveredFeatureId} = this.state;
|
|
10
13
|
const hoveredFeature = info.object;
|
|
11
14
|
let newHoveredFeatureId;
|
|
@@ -27,14 +30,14 @@ export default class SpatialIndexTileLayer extends TileLayer {
|
|
|
27
30
|
}
|
|
28
31
|
}
|
|
29
32
|
|
|
30
|
-
getSubLayerPropsByTile(tile) {
|
|
33
|
+
getSubLayerPropsByTile(tile: Tile2DHeader) {
|
|
31
34
|
return {
|
|
32
35
|
highlightedObjectIndex: this.getHighlightedObjectIndex(tile),
|
|
33
36
|
highlightColor: this.state.highlightColor
|
|
34
37
|
};
|
|
35
38
|
}
|
|
36
39
|
|
|
37
|
-
getHighlightedObjectIndex(tile) {
|
|
40
|
+
getHighlightedObjectIndex(tile: Tile2DHeader) {
|
|
38
41
|
const {hoveredFeatureId} = this.state;
|
|
39
42
|
const data = tile.content;
|
|
40
43
|
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/api/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,OAAO,EAAE,YAAY,EAAE,SAAS,EAAE,YAAY,EAAC,MAAM,mBAAmB,CAAC;AACjF,OAAO,EAAC,SAAS,EAAE,WAAW,EAAC,MAAM,eAAe,CAAC;AACrD,OAAO,EAAC,cAAc,EAAE,QAAQ,EAAE,OAAO,EAAE,gBAAgB,EAAC,MAAM,kBAAkB,CAAC"}
|
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
import { scaleLinear, scaleOrdinal, scaleLog, scalePoint, scaleQuantile, scaleQuantize, scaleSqrt, scaleThreshold } from 'd3-scale';
|
|
2
|
+
import { Layer, _ConstructorOf as ConstructorOf } from '@deck.gl/core/typed';
|
|
3
|
+
declare const SCALE_FUNCS: {
|
|
4
|
+
linear: typeof scaleLinear;
|
|
5
|
+
ordinal: typeof scaleOrdinal;
|
|
6
|
+
log: typeof scaleLog;
|
|
7
|
+
point: typeof scalePoint;
|
|
8
|
+
quantile: typeof scaleQuantile;
|
|
9
|
+
quantize: typeof scaleQuantize;
|
|
10
|
+
sqrt: typeof scaleSqrt;
|
|
11
|
+
custom: typeof scaleThreshold;
|
|
12
|
+
};
|
|
13
|
+
export declare type SCALE_TYPE = keyof typeof SCALE_FUNCS;
|
|
14
|
+
export declare const AGGREGATION: {
|
|
15
|
+
average: string;
|
|
16
|
+
maximum: string;
|
|
17
|
+
minimum: string;
|
|
18
|
+
sum: string;
|
|
19
|
+
};
|
|
20
|
+
export declare const OPACITY_MAP: {
|
|
21
|
+
getFillColor: string;
|
|
22
|
+
getLineColor: string;
|
|
23
|
+
getTextColor: string;
|
|
24
|
+
};
|
|
25
|
+
export declare function getLayer(type: string, config: any, dataset: any): {
|
|
26
|
+
Layer: ConstructorOf<Layer>;
|
|
27
|
+
propMap: any;
|
|
28
|
+
defaultProps: any;
|
|
29
|
+
};
|
|
30
|
+
declare function domainFromValues(values: any, scaleType: SCALE_TYPE): any;
|
|
31
|
+
export declare function opacityToAlpha(opacity: any): number;
|
|
32
|
+
export declare function getColorValueAccessor({ name }: {
|
|
33
|
+
name: any;
|
|
34
|
+
}, colorAggregation: any, data: any): any;
|
|
35
|
+
export declare function getColorAccessor({ name }: {
|
|
36
|
+
name: any;
|
|
37
|
+
}, scaleType: SCALE_TYPE, { colors, colorMap }: {
|
|
38
|
+
colors: any;
|
|
39
|
+
colorMap: any;
|
|
40
|
+
}, opacity: number | undefined, data: any): any;
|
|
41
|
+
export declare function getSizeAccessor({ name }: {
|
|
42
|
+
name: any;
|
|
43
|
+
}, scaleType: SCALE_TYPE, range: Iterable<Range>, data: any): any;
|
|
44
|
+
export declare function getTextAccessor({ name, type }: {
|
|
45
|
+
name: any;
|
|
46
|
+
type: any;
|
|
47
|
+
}, data: any): any;
|
|
48
|
+
export declare function getTextPixelOffsetAccessor({ alignment, anchor, size }: {
|
|
49
|
+
alignment: any;
|
|
50
|
+
anchor: any;
|
|
51
|
+
size: any;
|
|
52
|
+
}, radius: any): number[] | ((d: any) => number[]);
|
|
53
|
+
export { domainFromValues as _domainFromValues };
|
|
54
|
+
//# sourceMappingURL=layer-map.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"layer-map.d.ts","sourceRoot":"","sources":["../../src/api/layer-map.ts"],"names":[],"mappings":"AAEA,OAAO,EACL,WAAW,EACX,YAAY,EACZ,QAAQ,EACR,UAAU,EACV,aAAa,EACb,aAAa,EACb,SAAS,EACT,cAAc,EACf,MAAM,UAAU,CAAC;AAIlB,OAAO,EAAC,KAAK,EAAE,cAAc,IAAI,aAAa,EAAC,MAAM,eAAe,CAAC;AASrE,QAAA,MAAM,WAAW;;;;;;;;;CAShB,CAAC;AACF,oBAAY,UAAU,GAAG,MAAM,OAAO,WAAW,CAAC;AAIlD,eAAO,MAAM,WAAW;;;;;CAKvB,CAAC;AAEF,eAAO,MAAM,WAAW;;;;CAIvB,CAAC;AA2DF,wBAAgB,QAAQ,CACtB,IAAI,EAAE,MAAM,EACZ,MAAM,KAAA,EACN,OAAO,KAAA,GACN;IAAC,KAAK,EAAE,aAAa,CAAC,KAAK,CAAC,CAAC;IAAC,OAAO,EAAE,GAAG,CAAC;IAAC,YAAY,EAAE,GAAG,CAAA;CAAC,CAmDhE;AAkCD,iBAAS,gBAAgB,CAAC,MAAM,KAAA,EAAE,SAAS,EAAE,UAAU,OActD;AA8BD,wBAAgB,cAAc,CAAC,OAAO,KAAA,UAErC;AAED,wBAAgB,qBAAqB,CAAC,EAAC,IAAI,EAAC;;CAAA,EAAE,gBAAgB,KAAA,EAAE,IAAI,EAAE,GAAG,OAIxE;AAED,wBAAgB,gBAAgB,CAC9B,EAAC,IAAI,EAAC;;CAAA,EACN,SAAS,EAAE,UAAU,EACrB,EAAC,MAAM,EAAE,QAAQ,EAAC;;;CAAA,EAClB,OAAO,EAAE,MAAM,GAAG,SAAS,EAC3B,IAAI,EAAE,GAAG,OA+BV;AAED,wBAAgB,eAAe,CAAC,EAAC,IAAI,EAAC;;CAAA,EAAE,SAAS,EAAE,UAAU,EAAE,KAAK,EAAE,QAAQ,CAAC,KAAK,CAAC,EAAE,IAAI,EAAE,GAAG,OAS/F;AAUD,wBAAgB,eAAe,CAAC,EAAC,IAAI,EAAE,IAAI,EAAC;;;CAAA,EAAE,IAAI,KAAA,OAMjD;AAED,wBAAgB,0BAA0B,CAAC,EAAC,SAAS,EAAE,MAAM,EAAE,IAAI,EAAC;;;;CAAA,EAAE,MAAM,KAAA,qCAa3E;AAED,OAAO,EAAC,gBAAgB,IAAI,iBAAiB,EAAC,CAAC"}
|