mapbox-gl-shadow-simulator 0.61.1 → 0.62.1

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 (34) hide show
  1. package/README.md +22 -3
  2. package/dist/mapbox-gl-shadow-simulator.d.ts +3 -0
  3. package/dist/mapbox-gl-shadow-simulator.esm.js +2 -2
  4. package/dist/mapbox-gl-shadow-simulator.umd.min.js +2 -2
  5. package/examples/map.html +246 -196
  6. package/examples/maplibre.html +257 -214
  7. package/examples/markers-maplibre.html +230 -0
  8. package/examples/markers.html +197 -0
  9. package/package.json +1 -1
  10. package/dist/leaflet-shademap/leaflet-shademap/dist/ShadeMap.d.ts +0 -122
  11. package/dist/leaflet-shademap/leaflet-shademap/dist/ShadeMapLeaflet.d.ts +0 -17
  12. package/dist/leaflet-shademap/leaflet-shademap/dist/ShadeMapMapbox.d.ts +0 -29
  13. package/dist/leaflet-shademap/leaflet-shademap/dist/buildings/BuildingRasterizer.d.ts +0 -42
  14. package/dist/leaflet-shademap/leaflet-shademap/dist/buildings/fetch-buildings.d.ts +0 -12
  15. package/dist/leaflet-shademap/leaflet-shademap/dist/buildings/normalize-buildings.d.ts +0 -8
  16. package/dist/leaflet-shademap/leaflet-shademap/dist/components/CanvasOverlay.d.ts +0 -11
  17. package/dist/leaflet-shademap/leaflet-shademap/dist/index.d.ts +0 -7
  18. package/dist/leaflet-shademap/leaflet-shademap/dist/lib/EventEmitter.d.ts +0 -10
  19. package/dist/leaflet-shademap/leaflet-shademap/dist/lib/TileMerger.d.ts +0 -49
  20. package/dist/leaflet-shademap/leaflet-shademap/dist/lib/heightMap.d.ts +0 -33
  21. package/dist/leaflet-shademap/leaflet-shademap/dist/lib/helpers.d.ts +0 -33
  22. package/dist/leaflet-shademap/leaflet-shademap/dist/lib/image.d.ts +0 -13
  23. package/dist/leaflet-shademap/leaflet-shademap/dist/lib/projection.d.ts +0 -3
  24. package/dist/leaflet-shademap/leaflet-shademap/dist/lib/shadowMap.d.ts +0 -17
  25. package/dist/leaflet-shademap/leaflet-shademap/dist/lib/webgl.d.ts +0 -13
  26. package/dist/leaflet-shademap/leaflet-shademap/dist/map/geometryLeaflet.d.ts +0 -11
  27. package/dist/leaflet-shademap/leaflet-shademap/dist/map/umap.d.ts +0 -26
  28. package/dist/leaflet-shademap/leaflet-shademap/dist/shader/gpu.d.ts +0 -35
  29. package/dist/leaflet-shademap/leaflet-shademap/dist/shader/kernel.d.ts +0 -72
  30. package/dist/leaflet-shademap/leaflet-shademap/dist/types/color.d.ts +0 -5
  31. package/dist/leaflet-shademap/leaflet-shademap/dist/types/constants.d.ts +0 -3
  32. package/dist/leaflet-shademap/leaflet-shademap/dist/types/quality.d.ts +0 -5
  33. package/dist/leaflet-shademap/leaflet-shademap/dist/types/shadeMapOptions.d.ts +0 -46
  34. package/dist/leaflet-shademap/leaflet-shademap/dist/types/shadow3DData.d.ts +0 -21
@@ -0,0 +1,230 @@
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+
4
+ <head>
5
+ <meta charset="UTF-8" />
6
+ <meta name="viewport" content="width=device-width, initial-scale=1.0" />
7
+ <meta http-equiv="X-UA-Compatible" content="ie=edge" />
8
+ <link rel="stylesheet" href="https://unpkg.com/maplibre-gl@4.1.0/dist/maplibre-gl.css" />
9
+ <script src="https://unpkg.com/maplibre-gl@4.1.0/dist/maplibre-gl.js"></script>
10
+ <script src="https://www.unpkg.com/suncalc@1.9.0/suncalc.js"></script>
11
+ <script src="https://unpkg.com/protomaps-themes-base@4.3.0/dist/protomaps-themes-base.js"></script>
12
+ <script src="../dist/mapbox-gl-shadow-simulator.umd.min.js"></script>
13
+ <style>
14
+ body {
15
+ padding: 0px;
16
+ margin: 0px;
17
+ }
18
+
19
+ #mapid {
20
+ height: 100vh;
21
+ }
22
+
23
+ .maplibregl-control-time {
24
+ padding: 20px;
25
+ background-color: white;
26
+ }
27
+ </style>
28
+ <title>mapbox-gl-shadow-simulator Maplibre Markers Example</title>
29
+ </head>
30
+
31
+ <body>
32
+ <div id="mapid">
33
+ <div class="maplibregl-control-container" style="z-index: 2000; pointer-events: auto">
34
+ <div class="maplibregl-ctrl-top-left">
35
+ <div class="maplibregl-control-time" style="pointer-events: auto">
36
+ <button id="decrement">-1 hour</button>
37
+ <button id="increment">+1 hour</button>
38
+ <button id="play">Play</button>
39
+ <button id="stop">Stop</button>
40
+ <button>
41
+ <a href="https://shademap.app/about" target="_blank">Get API key</a>
42
+ </button>
43
+ <span id="loader" style="padding: 3px"></span>
44
+ </div>
45
+ </div>
46
+ </div>
47
+ </div>
48
+ <script>
49
+ const mapLoaded = (map) => {
50
+ return new Promise((res, rej) => {
51
+ function cb() {
52
+ if (!map.loaded()) {
53
+ return;
54
+ }
55
+ map.off("render", cb);
56
+ res();
57
+ }
58
+ map.on("render", cb);
59
+ cb();
60
+ });
61
+ };
62
+ /* Maplibregl setup */
63
+ maplibregl.setRTLTextPlugin(
64
+ "https://unpkg.com/@mapbox/mapbox-gl-rtl-text@0.2.3/mapbox-gl-rtl-text.min.js",
65
+ true // Lazy load the plugin
66
+ );
67
+
68
+ const map = new maplibregl.Map({
69
+ container: "mapid",
70
+ style: {
71
+ version: 8,
72
+ glyphs:
73
+ "https://protomaps.github.io/basemaps-assets/fonts/{fontstack}/{range}.pbf",
74
+ sources: {
75
+ protomaps: {
76
+ type: "vector",
77
+ tiles: ["https://cfw.shademap.app/planet/{z}/{x}/{y}.pbf"],
78
+ attribution:
79
+ '<a href="https://protomaps.com">Protomaps</a> © <a href="https://openstreetmap.org">OpenStreetMap</a>',
80
+ maxzoom: 15,
81
+ },
82
+ buildings: {
83
+ type: "vector",
84
+ tiles: [`https://cfw.shademap.app/buildings/{z}/{x}/{y}.mvt`],
85
+ minzoom: 14,
86
+ maxzoom: 14,
87
+ },
88
+ },
89
+ layers: [
90
+ ...protomaps_themes_base.default("protomaps", "light", "en"),
91
+ {
92
+ id: "building",
93
+ source: "buildings",
94
+ "source-layer": "building",
95
+ type: "line",
96
+ },
97
+ ],
98
+ },
99
+ maplibreLogo: true,
100
+ center: { lng: -122.15675711631776, lat: 47.75510439397995 },
101
+ zoom: 16, // starting zoom
102
+ hash: true,
103
+ });
104
+ /* End Maplibregl setup */
105
+
106
+ /* Add markers for cafes */
107
+ const cafes = [
108
+ { lat: 47.75479062611596, lng: -122.15534138695534 },
109
+ { lat: 47.75337697202738, lng: -122.16319480178332 },
110
+ { lat: 47.751941595291726, lng: -122.15921456808333 },
111
+ { lat: 47.753477542718706, lng: -122.15083544800348 },
112
+ { lat: 47.754992309138885, lng: -122.15102829347933 },
113
+ { lat: 47.757776865447056, lng: -122.1563603726317 },
114
+ ];
115
+ const markers = cafes.map((coords) => {
116
+ return new maplibregl.Marker().setLngLat(coords).addTo(map);
117
+ });
118
+ /* End add markers for cafes */
119
+
120
+ /* ShadeMap setup */
121
+ const loaderEl = document.getElementById("loader");
122
+ let now = new Date(1633362188054);
123
+ let shadeMap;
124
+ map.on("load", () => {
125
+ shadeMap = new ShadeMap({
126
+ apiKey:
127
+ "eyJhbGciOiJIUzI1NiJ9.eyJlbWFpbCI6InRwcGlvdHJvd3NraUBzaGFkZW1hcC5hcHAiLCJjcmVhdGVkIjoxNjYyNDkzMDY2Nzk0LCJpYXQiOjE2NjI0OTMwNjZ9.ovCrLTYsdKFTF6TW3DuODxCaAtGQ3qhcmqj3DWcol5g",
128
+ date: now,
129
+ color: "#01112f",
130
+ opacity: 0.7,
131
+ terrainSource: {
132
+ maxZoom: 15,
133
+ tileSize: 256,
134
+ getSourceUrl: ({ x, y, z }) =>
135
+ `https://s3.amazonaws.com/elevation-tiles-prod/terrarium/${z}/${x}/${y}.png`,
136
+ getElevation: ({ r, g, b, a }) => r * 256 + g + b / 256 - 32768,
137
+ _overzoom: 18,
138
+ },
139
+ getFeatures: async () => {
140
+ if (map.getZoom() >= 12) {
141
+ await mapLoaded(map);
142
+ const buildingData = map.querySourceFeatures("buildings", {
143
+ sourceLayer: "building",
144
+ });
145
+
146
+ buildingData.forEach((feature) => {
147
+ feature.properties.height = feature.properties.height || 3.1;
148
+ });
149
+
150
+ // Buildings segments must be rasterized from bottom to top. If not, the base of a building
151
+ // could rasterize over the top tower of the building
152
+ buildingData.sort((a, b) => {
153
+ return a.properties.height - b.properties.height;
154
+ });
155
+ return buildingData;
156
+ }
157
+ return [];
158
+ },
159
+ debug: (msg) => {
160
+ console.log(new Date().toISOString(), msg);
161
+ },
162
+ }).addTo(map);
163
+
164
+ shadeMap.on("tileloaded", (loadedTiles, totalTiles) => {
165
+ loaderEl.innerText = `Loading: ${(
166
+ (loadedTiles / totalTiles) *
167
+ 100
168
+ ).toFixed(0)}%`;
169
+ });
170
+
171
+ shadeMap.on("idle", async () => {
172
+ console.log('idle')
173
+ const promises = markers.map((marker) => {
174
+ const latlng = marker.getLngLat();
175
+ const { x, y } = map.project(latlng);
176
+ return shadeMap.isPositionInSun(x, y);
177
+ });
178
+ const results = await Promise.all(promises);
179
+ markers.forEach((marker, i) => {
180
+ const inTheSun = results[i] === true;
181
+ const element = marker.getElement();
182
+ const svg = element.getElementsByTagName("svg")[0];
183
+ const path = svg.getElementsByTagName("path")[0];
184
+ path.setAttribute("fill", inTheSun ? "#ffcc00" : "#ccf");
185
+ });
186
+ });
187
+ });
188
+ /* End ShadeMap setup */
189
+
190
+ /* Controls setup */
191
+ let intervalTimer;
192
+
193
+ const increment = document.getElementById("increment");
194
+ const decrement = document.getElementById("decrement");
195
+ const play = document.getElementById("play");
196
+ const stop = document.getElementById("stop");
197
+
198
+ increment.addEventListener(
199
+ "click",
200
+ () => {
201
+ now = new Date(now.getTime() + 3600000);
202
+ shadeMap && shadeMap.setDate(now);
203
+ },
204
+ false
205
+ );
206
+
207
+ decrement.addEventListener(
208
+ "click",
209
+ () => {
210
+ now = new Date(now.getTime() - 3600000);
211
+ shadeMap && shadeMap.setDate(now);
212
+ },
213
+ false
214
+ );
215
+
216
+ play.addEventListener("click", () => {
217
+ intervalTimer = setInterval(() => {
218
+ now = new Date(now.getTime() + 60000);
219
+ shadeMap && shadeMap.setDate(now);
220
+ }, 100);
221
+ });
222
+
223
+ stop.addEventListener("click", () => {
224
+ clearInterval(intervalTimer);
225
+ });
226
+ /* End controls setup */
227
+ </script>
228
+ </body>
229
+
230
+ </html>
@@ -0,0 +1,197 @@
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8" />
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0" />
6
+ <meta http-equiv="X-UA-Compatible" content="ie=edge" />
7
+ <link
8
+ href="https://api.mapbox.com/mapbox-gl-js/v2.8.2/mapbox-gl.css"
9
+ rel="stylesheet"
10
+ />
11
+ <script src="https://api.mapbox.com/mapbox-gl-js/v2.8.2/mapbox-gl.js"></script>
12
+ <script src="https://www.unpkg.com/suncalc@1.9.0/suncalc.js"></script>
13
+ <script src="../dist/mapbox-gl-shadow-simulator.umd.min.js"></script>
14
+ <style>
15
+ body {
16
+ padding: 0px;
17
+ margin: 0px;
18
+ }
19
+
20
+ #mapid {
21
+ height: 100vh;
22
+ }
23
+
24
+ .mapbox-control-time {
25
+ padding: 20px;
26
+ background-color: white;
27
+ }
28
+ </style>
29
+ <title>mapbox-gl-shadow-simulator Mapbox Markers Example</title>
30
+ </head>
31
+
32
+ <body>
33
+ <div id="mapid">
34
+ <div
35
+ class="mapboxgl-control-container"
36
+ style="z-index: 2000; pointer-events: auto"
37
+ >
38
+ <div class="mapboxgl-ctrl-top-left">
39
+ <div class="mapbox-control-time" style="pointer-events: auto">
40
+ <button id="decrement">-1 hour</button>
41
+ <button id="increment">+1 hour</button>
42
+ <button id="play">Play</button>
43
+ <button id="stop">Stop</button>
44
+ <button>
45
+ <a href="https://shademap.app/about" target="_blank"
46
+ >Get API key</a
47
+ >
48
+ </button>
49
+ <span id="loader" style="padding: 3px"></span>
50
+ </div>
51
+ </div>
52
+ </div>
53
+ </div>
54
+ <script>
55
+ const mapLoaded = (map) => {
56
+ return new Promise((res, rej) => {
57
+ function cb() {
58
+ if (!map.loaded()) {
59
+ return;
60
+ }
61
+ map.off("render", cb);
62
+ res();
63
+ }
64
+ map.on("render", cb);
65
+ cb();
66
+ });
67
+ };
68
+ /* Mapbox setup */
69
+ mapboxgl.accessToken =
70
+ "pk.eyJ1IjoidHBwaW90cm93c2tpIiwiYSI6ImNrbGtkMXZtNTA3NmUydXJ5Z2xxNXExcmEifQ.Anj5VuaYC5d595Pde-Xp3w";
71
+ const map = new mapboxgl.Map({
72
+ container: "mapid",
73
+ style: "mapbox://styles/mapbox/streets-v11",
74
+ center: { lng: -122.15675711631776, lat: 47.75510439397995 },
75
+ zoom: 16, // starting zoom
76
+ hash: true,
77
+ });
78
+ /* End Mapbox setup */
79
+
80
+ /* Add markers for cafes */
81
+ const cafes = [
82
+ { lat: 47.75479062611596, lng: -122.15534138695534 },
83
+ { lat: 47.75337697202738, lng: -122.16319480178332 },
84
+ { lat: 47.751941595291726, lng: -122.15921456808333 },
85
+ { lat: 47.753477542718706, lng: -122.15083544800348 },
86
+ { lat: 47.754992309138885, lng: -122.15102829347933 },
87
+ { lat: 47.757776865447056, lng: -122.1563603726317 },
88
+ ];
89
+ const markers = cafes.map((coords) => {
90
+ return new mapboxgl.Marker().setLngLat(coords).addTo(map);
91
+ });
92
+ /* End add markers for cafes */
93
+
94
+ /* ShadeMap setup */
95
+ const loaderEl = document.getElementById("loader");
96
+ let now = new Date(1633362188054);
97
+ let shadeMap;
98
+ map.on("load", () => {
99
+ shadeMap = new ShadeMap({
100
+ apiKey:
101
+ "eyJhbGciOiJIUzI1NiJ9.eyJlbWFpbCI6InRwcGlvdHJvd3NraUBzaGFkZW1hcC5hcHAiLCJjcmVhdGVkIjoxNjYyNDkzMDY2Nzk0LCJpYXQiOjE2NjI0OTMwNjZ9.ovCrLTYsdKFTF6TW3DuODxCaAtGQ3qhcmqj3DWcol5g",
102
+ date: now,
103
+ color: "#01112f",
104
+ opacity: 0.7,
105
+ terrainSource: {
106
+ maxZoom: 15,
107
+ tileSize: 256,
108
+ getSourceUrl: ({ x, y, z }) =>
109
+ `https://s3.amazonaws.com/elevation-tiles-prod/terrarium/${z}/${x}/${y}.png`,
110
+ getElevation: ({ r, g, b, a }) => r * 256 + g + b / 256 - 32768,
111
+ _overzoom: 18,
112
+ },
113
+ getFeatures: async () => {
114
+ await mapLoaded(map);
115
+ const buildingData = map
116
+ .querySourceFeatures("composite", { sourceLayer: "building" })
117
+ .filter((feature) => {
118
+ return (
119
+ feature.properties &&
120
+ feature.properties.underground !== "true" &&
121
+ (feature.properties.height ||
122
+ feature.properties.render_height)
123
+ );
124
+ });
125
+ return buildingData;
126
+ },
127
+ debug: (msg) => {
128
+ console.log(new Date().toISOString(), msg);
129
+ },
130
+ }).addTo(map);
131
+
132
+ shadeMap.on("tileloaded", (loadedTiles, totalTiles) => {
133
+ loaderEl.innerText = `Loading: ${(
134
+ (loadedTiles / totalTiles) *
135
+ 100
136
+ ).toFixed(0)}%`;
137
+ });
138
+
139
+ shadeMap.on("idle", async () => {
140
+ console.log("idle");
141
+ const promises = markers.map((marker) => {
142
+ const latlng = marker.getLngLat();
143
+ const { x, y } = map.project(latlng);
144
+ return shadeMap.isPositionInSun(x, y);
145
+ });
146
+ const results = await Promise.all(promises);
147
+ markers.forEach((marker, i) => {
148
+ const inTheSun = results[i] === true;
149
+ const element = marker.getElement();
150
+ const svg = element.getElementsByTagName("svg")[0];
151
+ const path = svg.getElementsByTagName("path")[0];
152
+ path.setAttribute("fill", inTheSun ? "#ffcc00" : "#ccf");
153
+ });
154
+ });
155
+ });
156
+ /* End ShadeMap setup */
157
+
158
+ /* Controls setup */
159
+ let intervalTimer;
160
+
161
+ const increment = document.getElementById("increment");
162
+ const decrement = document.getElementById("decrement");
163
+ const play = document.getElementById("play");
164
+ const stop = document.getElementById("stop");
165
+
166
+ increment.addEventListener(
167
+ "click",
168
+ () => {
169
+ now = new Date(now.getTime() + 3600000);
170
+ shadeMap && shadeMap.setDate(now);
171
+ },
172
+ false
173
+ );
174
+
175
+ decrement.addEventListener(
176
+ "click",
177
+ () => {
178
+ now = new Date(now.getTime() - 3600000);
179
+ shadeMap && shadeMap.setDate(now);
180
+ },
181
+ false
182
+ );
183
+
184
+ play.addEventListener("click", () => {
185
+ intervalTimer = setInterval(() => {
186
+ now = new Date(now.getTime() + 60000);
187
+ shadeMap && shadeMap.setDate(now);
188
+ }, 100);
189
+ });
190
+
191
+ stop.addEventListener("click", () => {
192
+ clearInterval(intervalTimer);
193
+ });
194
+ /* End controls setup */
195
+ </script>
196
+ </body>
197
+ </html>
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "mapbox-gl-shadow-simulator",
3
- "version": "0.61.1",
3
+ "version": "0.62.1",
4
4
  "description": "Display terrain and structure shadows cast by the sun in a custom style layer",
5
5
  "main": "dist/mapbox-gl-shadow-simulator.umd.min.js",
6
6
  "browser": "dist/mapbox-gl-shadow-simulator.umd.min.js",
@@ -1,122 +0,0 @@
1
- import { LatLngLiteral, Map as LeafletMap } from "leaflet";
2
- import { Map, MapboxGeoJSONFeature } from "mapbox-gl";
3
- import { BuildingRasterizer } from "./buildings/BuildingRasterizer";
4
- import { EventEmitter } from "./lib/EventEmitter";
5
- import { HeightMap } from "./lib/heightMap";
6
- import { TileMerger } from "./lib/TileMerger";
7
- import { LatLngBounds } from "./map/geometryLeaflet";
8
- import { UMap } from "./map/umap";
9
- import { CompiledKernel } from "./shader/kernel";
10
- import { Color } from "./types/color";
11
- import { DSMSource, SunExposureOptions, TerrainSource } from "./types/shadeMapOptions";
12
- export declare class ShadeMap extends EventEmitter {
13
- _canvas: HTMLCanvasElement;
14
- _gl?: WebGLRenderingContext;
15
- _map?: Map | LeafletMap;
16
- _compiledKernel?: CompiledKernel;
17
- _color: Color;
18
- _bounds?: LatLngBounds;
19
- _buildingRasterizer?: BuildingRasterizer;
20
- _tileMerger?: TileMerger;
21
- _heightMap?: HeightMap;
22
- options: {
23
- date: Date;
24
- color: string;
25
- opacity: number;
26
- sunExposure: {
27
- enabled: boolean;
28
- startDate: Date;
29
- endDate: Date;
30
- iterations: number;
31
- };
32
- apiKey: string;
33
- terrainSource: {
34
- maxZoom: number;
35
- tileSize: number;
36
- _overzoom: number;
37
- getSourceUrl: (params: {
38
- x: number;
39
- y: number;
40
- z: number;
41
- }) => string;
42
- getElevation: (params: {
43
- r: number;
44
- g: number;
45
- b: number;
46
- a: number;
47
- }) => number;
48
- };
49
- dsmSource: {
50
- bounds: {
51
- lat: number;
52
- lng: number;
53
- }[];
54
- data: Uint8ClampedArray;
55
- width: number;
56
- height: number;
57
- maxHeight: number;
58
- };
59
- belowCanopy: boolean;
60
- getFeatures: () => Promise<MapboxGeoJSONFeature[]>;
61
- getSize: () => {
62
- width: number;
63
- height: number;
64
- };
65
- debug: (msg: string) => void;
66
- };
67
- constructor(...args: any[]);
68
- onRemove(): this;
69
- setDate(date: Date): this;
70
- _setDateForTimezone(date: Date, tzId?: string): void;
71
- setColor(color: string): this;
72
- setOpacity(opacity: number): this;
73
- setBelowCanopy(belowCanopy: boolean): this;
74
- setTerrainSource(terrainSource: TerrainSource): this;
75
- setDSMSource(dsmSource: DSMSource): this;
76
- setSunExposure(enabled?: boolean, options?: SunExposureOptions): Promise<this>;
77
- _lngLatToTextureCoords(lngLat: LatLngLiteral[]): number[][];
78
- _getBounds(map: UMap, demZoom: number): LatLngBounds;
79
- _getDEMZoom(map: UMap): number;
80
- _reset(): Promise<this>;
81
- _draw(heightMap: HeightMap): Promise<this>;
82
- readPixel(x: number, y: number): Uint8Array;
83
- readPixels(x: number, y: number, width: number, height: number): Uint8Array;
84
- toGeoTiff(): {
85
- data: Uint8Array;
86
- metadata: {
87
- width: number;
88
- height: number;
89
- ModelTiepoint: any[];
90
- ModelPixelScale: number[];
91
- GeographicTypeGeoKey: number;
92
- GeogCitationGeoKey: string;
93
- };
94
- } | null;
95
- _generateShadeProfile(params: {
96
- locations: LatLngLiteral[];
97
- dates: Date[];
98
- sunColor: number[];
99
- shadeColor: number[];
100
- }): Uint8Array;
101
- _generateLocationShadeProfile(params: {
102
- location: LatLngLiteral;
103
- startDate: Date;
104
- endDate: Date;
105
- sunColor: number[];
106
- shadeColor: number[];
107
- tzId: string;
108
- }): {
109
- data: Uint8Array;
110
- width: number;
111
- height: number;
112
- };
113
- getHoursOfSun(x: number, y: number): number;
114
- _repositionCanvas(bounds: LatLngBounds): void;
115
- _flush(): void;
116
- flushSync(): void;
117
- _parseColor(color: string): {
118
- r: number;
119
- g: number;
120
- b: number;
121
- };
122
- }
@@ -1,17 +0,0 @@
1
- import { Map } from "leaflet";
2
- import { CanvasOverlay } from "./components/CanvasOverlay";
3
- import { LatLngBounds } from "./map/geometryLeaflet";
4
- import { ShadeMap } from "./ShadeMap";
5
- import { ShadeMapOptions } from "./types/shadeMapOptions";
6
- declare class ShadeMapLeaflet extends ShadeMap {
7
- _canvasOverlay?: CanvasOverlay;
8
- constructor(options: ShadeMapOptions);
9
- addTo(map: Map): this;
10
- onAdd(map: Map): this;
11
- _repositionCanvas(bounds: LatLngBounds): void;
12
- _flush(): void;
13
- }
14
- declare module "leaflet" {
15
- function shadeMap(options: ShadeMapOptions): ShadeMapLeaflet;
16
- }
17
- export default ShadeMapLeaflet;
@@ -1,29 +0,0 @@
1
- import { Map } from "mapbox-gl";
2
- import { LatLngBounds } from "./map/geometryLeaflet";
3
- import { ShadeMap } from "./ShadeMap";
4
- import { ShadeMapOptions } from "./types/shadeMapOptions";
5
- export default class extends ShadeMap {
6
- id: string;
7
- type: string;
8
- canvasSourceId: string;
9
- attributionSourceId: string;
10
- canvasLayerId: string;
11
- attributionLayerId: string;
12
- _map?: Map;
13
- _refreshing: number;
14
- _raf: number;
15
- _moveEndHandler: () => void;
16
- _framebuffer?: WebGLFramebuffer;
17
- constructor(options: ShadeMapOptions);
18
- render(gl: WebGLRenderingContext, matrix: number[]): void;
19
- addTo(map: Map): this;
20
- onAdd(map: Map): this;
21
- onRemove(): this;
22
- _getHeightMapCoords(x: number, y: number): any;
23
- getHoursOfSun(x: number, y: number): number;
24
- remove(): void;
25
- readPixel(x: number, y: number): Uint8Array;
26
- readPixels(x: number, y: number, width: number, height: number): Uint8Array;
27
- _flush(): void;
28
- _repositionCanvas(bounds: LatLngBounds): this;
29
- }
@@ -1,42 +0,0 @@
1
- import { XYZ } from "../lib/helpers";
2
- import { DSMSource } from "../types/shadeMapOptions";
3
- interface BuildingRasterGLArgs {
4
- upperLeftTile: XYZ;
5
- features: {
6
- aPosition: Float32Array;
7
- cuts: Uint16Array | Uint8Array;
8
- buildingHeight: number;
9
- centroid: number[];
10
- highlight: boolean;
11
- }[];
12
- mapZoom: number;
13
- imageData: WebGLTexture;
14
- width: number;
15
- height: number;
16
- dsmSource: DSMSource;
17
- dsmCoords: number[];
18
- gl: WebGLRenderingContext;
19
- }
20
- export declare class BuildingRasterizer {
21
- gl: WebGLRenderingContext;
22
- program: WebGLProgram;
23
- positionAttributeLocation: number;
24
- dsmAttributeLocation: number;
25
- useDSMUniformLocation: WebGLUniformLocation;
26
- isNegative: WebGLUniformLocation;
27
- xyzUniformLocation: WebGLUniformLocation;
28
- dimensionsUniformLocation: WebGLUniformLocation;
29
- heightMapUniformLocation: WebGLUniformLocation;
30
- centroidUniformLocation: WebGLUniformLocation;
31
- colorUniformLocation: WebGLUniformLocation;
32
- positionBuffer: WebGLBuffer;
33
- dsmBuffer: WebGLBuffer;
34
- indexBuffer: WebGLBuffer;
35
- targetTexture: WebGLTexture;
36
- constructor(gl: WebGLRenderingContext);
37
- raster(args: BuildingRasterGLArgs): {
38
- maxHeight: number;
39
- heightMapTex: WebGLTexture;
40
- };
41
- }
42
- export {};
@@ -1,12 +0,0 @@
1
- import { MapboxGeoJSONFeature } from "mapbox-gl";
2
- interface FetchBuildingsArgs {
3
- getFeatures: () => Promise<MapboxGeoJSONFeature[]>;
4
- }
5
- export declare const fetchBuildings: (args: FetchBuildingsArgs) => Promise<{
6
- aPosition: Float32Array;
7
- cuts: Uint8Array | Uint16Array;
8
- buildingHeight: number;
9
- centroid: number[];
10
- highlight: any;
11
- }[]>;
12
- export {};
@@ -1,8 +0,0 @@
1
- import { MapboxGeoJSONFeature } from "mapbox-gl";
2
- export declare function normalizeBuildings(features: MapboxGeoJSONFeature[]): {
3
- aPosition: Float32Array;
4
- cuts: Uint8Array | Uint16Array;
5
- buildingHeight: number;
6
- centroid: number[];
7
- highlight: any;
8
- }[];
@@ -1,11 +0,0 @@
1
- import { ImageOverlay, ImageOverlayOptions, LatLngBounds, LatLngBoundsExpression } from "leaflet";
2
- export declare class CanvasOverlay extends ImageOverlay {
3
- _url: HTMLCanvasElement;
4
- _image?: HTMLCanvasElement;
5
- _zoomAnimated?: boolean;
6
- _bounds?: LatLngBounds;
7
- constructor(canvas: HTMLCanvasElement, bounds: LatLngBoundsExpression, options?: ImageOverlayOptions);
8
- _initImage(): this;
9
- setBounds(bounds: LatLngBounds): this;
10
- }
11
- export declare function canvasOverlay(...args: ConstructorParameters<typeof CanvasOverlay>): CanvasOverlay;
@@ -1,7 +0,0 @@
1
- import "leaflet";
2
- import ShadeMapLeaflet from "./ShadeMapLeaflet";
3
- import { ShadeMapOptions } from "./types/shadeMapOptions";
4
- declare module "leaflet" {
5
- function shadeMap(options: ShadeMapOptions): ShadeMapLeaflet;
6
- }
7
- export { ShadeMapLeaflet as default, ShadeMapOptions };