@treasuryspatial/map-kit 0.1.11 → 0.1.12

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.
@@ -1 +1 @@
1
- {"version":3,"file":"mapThreeLayer.d.ts","sourceRoot":"","sources":["../src/mapThreeLayer.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,MAAM,MAAM,aAAa,GAAG;IAC1B,KAAK,EAAE,QAAQ,CAAC,oBAAoB,CAAC;IACrC,QAAQ,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,KAAK,GAAG,IAAI,KAAK,IAAI,CAAC;IAC9C,SAAS,EAAE,CAAC,MAAM,EAAE;QAAE,GAAG,EAAE,MAAM,CAAC;QAAC,GAAG,EAAE,MAAM,CAAA;KAAE,GAAG,IAAI,KAAK,IAAI,CAAC;IACjE,gBAAgB,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3C,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,oBAAoB,GAAG;IACjC,EAAE,EAAE,MAAM,CAAC;IACX,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,KAAK,EAAE,QAAQ,EAAE,KAAK,CAAC,aAAa,EAAE,MAAM,EAAE,KAAK,CAAC,MAAM,KAAK,IAAI,CAAC;IAC3F,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB,CAAC;AAEF,wBAAgB,mBAAmB,CAAC,OAAO,EAAE,oBAAoB,GAAG,aAAa,CAsUhF"}
1
+ {"version":3,"file":"mapThreeLayer.d.ts","sourceRoot":"","sources":["../src/mapThreeLayer.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,MAAM,MAAM,aAAa,GAAG;IAC1B,KAAK,EAAE,QAAQ,CAAC,oBAAoB,CAAC;IACrC,QAAQ,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,KAAK,GAAG,IAAI,KAAK,IAAI,CAAC;IAC9C,SAAS,EAAE,CAAC,MAAM,EAAE;QAAE,GAAG,EAAE,MAAM,CAAC;QAAC,GAAG,EAAE,MAAM,CAAA;KAAE,GAAG,IAAI,KAAK,IAAI,CAAC;IACjE,gBAAgB,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3C,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,oBAAoB,GAAG;IACjC,EAAE,EAAE,MAAM,CAAC;IACX,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,KAAK,EAAE,QAAQ,EAAE,KAAK,CAAC,aAAa,EAAE,MAAM,EAAE,KAAK,CAAC,MAAM,KAAK,IAAI,CAAC;IAC3F,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB,CAAC;AAEF,wBAAgB,mBAAmB,CAAC,OAAO,EAAE,oBAAoB,GAAG,aAAa,CAmWhF"}
@@ -22,6 +22,74 @@ export function createMapThreeLayer(options) {
22
22
  let errorCount = 0;
23
23
  let hasRenderable = false;
24
24
  let originResolved = false;
25
+ let didPrerender = false;
26
+ let lastMatrix = null;
27
+ const applyMatrix = (matrix) => {
28
+ if (!matrix || !camera)
29
+ return;
30
+ lastMatrix = matrix;
31
+ camera.projectionMatrix = new THREE.Matrix4().fromArray(matrix);
32
+ if ('projectionMatrixInverse' in camera) {
33
+ camera.projectionMatrixInverse.copy(camera.projectionMatrix).invert();
34
+ }
35
+ };
36
+ const renderOffscreen = () => {
37
+ if (renderDisabled)
38
+ return;
39
+ if (!renderer || !scene || !camera || !rootGroup || !renderTarget)
40
+ return;
41
+ if (!hasRenderable)
42
+ return;
43
+ if (lastMatrix) {
44
+ applyMatrix(lastMatrix);
45
+ }
46
+ if (!mercatorOrigin && mapRef && !originResolved) {
47
+ try {
48
+ const center = mapRef.getCenter();
49
+ mercatorOrigin = mapboxgl.MercatorCoordinate.fromLngLat(center);
50
+ meterScale = mercatorOrigin.meterInMercatorCoordinateUnits();
51
+ originResolved = true;
52
+ if (debug) {
53
+ log('origin fallback', {
54
+ origin: { lng: center.lng, lat: center.lat },
55
+ mercator: { x: mercatorOrigin.x, y: mercatorOrigin.y, z: mercatorOrigin.z },
56
+ meterScale,
57
+ });
58
+ }
59
+ }
60
+ catch (err) {
61
+ logError('origin fallback failed', err);
62
+ }
63
+ }
64
+ if (mercatorOrigin) {
65
+ const translate = new THREE.Matrix4().makeTranslation(mercatorOrigin.x, mercatorOrigin.y, (mercatorOrigin.z ?? 0) + zOffset * meterScale);
66
+ const scale = new THREE.Matrix4().makeScale(meterScale, -meterScale, meterScale);
67
+ rootGroup.matrix = new THREE.Matrix4().multiplyMatrices(translate, scale);
68
+ rootGroup.matrixWorldNeedsUpdate = true;
69
+ }
70
+ const canvas = mapRef?.getCanvas();
71
+ if (canvas && (canvas.width !== targetWidth || canvas.height !== targetHeight)) {
72
+ targetWidth = canvas.width;
73
+ targetHeight = canvas.height;
74
+ renderTarget.setSize(targetWidth, targetHeight);
75
+ log('renderTarget resized', { width: targetWidth, height: targetHeight });
76
+ }
77
+ renderer.setRenderTarget(renderTarget);
78
+ renderer.resetState();
79
+ const gl = renderer.getContext();
80
+ gl.disable(gl.SCISSOR_TEST);
81
+ gl.disable(gl.STENCIL_TEST);
82
+ gl.colorMask(true, true, true, true);
83
+ gl.depthMask(true);
84
+ renderer.setViewport(0, 0, targetWidth, targetHeight);
85
+ renderer.setClearColor(0x000000, 0);
86
+ renderer.setClearAlpha(0);
87
+ renderer.clear(true, true, true);
88
+ checkFramebuffer(gl, 'prerender');
89
+ renderer.render(scene, camera);
90
+ logGlError(gl, 'prerender');
91
+ renderer.setRenderTarget(null);
92
+ };
25
93
  const log = (...args) => {
26
94
  if (!debug)
27
95
  return;
@@ -159,53 +227,9 @@ export function createMapThreeLayer(options) {
159
227
  if (!hasRenderable)
160
228
  return;
161
229
  try {
162
- camera.projectionMatrix = new THREE.Matrix4().fromArray(matrix);
163
- if (!mercatorOrigin && mapRef && !originResolved) {
164
- try {
165
- const center = mapRef.getCenter();
166
- mercatorOrigin = mapboxgl.MercatorCoordinate.fromLngLat(center);
167
- meterScale = mercatorOrigin.meterInMercatorCoordinateUnits();
168
- originResolved = true;
169
- if (debug) {
170
- log('origin fallback', {
171
- origin: { lng: center.lng, lat: center.lat },
172
- mercator: { x: mercatorOrigin.x, y: mercatorOrigin.y, z: mercatorOrigin.z },
173
- meterScale,
174
- });
175
- }
176
- }
177
- catch (err) {
178
- logError('origin fallback failed', err);
179
- }
180
- }
181
- if (mercatorOrigin) {
182
- const translate = new THREE.Matrix4().makeTranslation(mercatorOrigin.x, mercatorOrigin.y, (mercatorOrigin.z ?? 0) + zOffset * meterScale);
183
- const scale = new THREE.Matrix4().makeScale(meterScale, -meterScale, meterScale);
184
- rootGroup.matrix = new THREE.Matrix4().multiplyMatrices(translate, scale);
185
- rootGroup.matrixWorldNeedsUpdate = true;
186
- }
187
- const canvas = mapRef?.getCanvas();
188
- if (canvas && (canvas.width !== targetWidth || canvas.height !== targetHeight)) {
189
- targetWidth = canvas.width;
190
- targetHeight = canvas.height;
191
- renderTarget.setSize(targetWidth, targetHeight);
192
- log('renderTarget resized', { width: targetWidth, height: targetHeight });
193
- }
194
- renderer.setRenderTarget(renderTarget);
195
- renderer.resetState();
196
- const gl = renderer.getContext();
197
- gl.disable(gl.SCISSOR_TEST);
198
- gl.disable(gl.STENCIL_TEST);
199
- gl.colorMask(true, true, true, true);
200
- gl.depthMask(true);
201
- renderer.setViewport(0, 0, targetWidth, targetHeight);
202
- renderer.setClearColor(0x000000, 0);
203
- renderer.setClearAlpha(0);
204
- renderer.clear(true, true, true);
205
- checkFramebuffer(gl, 'prerender');
206
- renderer.render(scene, camera);
207
- logGlError(gl, 'prerender');
208
- renderer.setRenderTarget(null);
230
+ applyMatrix(matrix);
231
+ renderOffscreen();
232
+ didPrerender = true;
209
233
  }
210
234
  catch (err) {
211
235
  errorCount += 1;
@@ -216,7 +240,7 @@ export function createMapThreeLayer(options) {
216
240
  }
217
241
  }
218
242
  },
219
- render: (gl) => {
243
+ render: (gl, matrix) => {
220
244
  if (renderDisabled)
221
245
  return;
222
246
  if (!renderer || !screenScene || !screenCamera)
@@ -224,6 +248,13 @@ export function createMapThreeLayer(options) {
224
248
  if (!hasRenderable)
225
249
  return;
226
250
  try {
251
+ if (matrix) {
252
+ applyMatrix(matrix);
253
+ }
254
+ if (!didPrerender) {
255
+ renderOffscreen();
256
+ }
257
+ didPrerender = false;
227
258
  renderer.resetState();
228
259
  gl.disable(gl.DEPTH_TEST);
229
260
  gl.depthMask(false);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@treasuryspatial/map-kit",
3
- "version": "0.1.11",
3
+ "version": "0.1.12",
4
4
  "type": "module",
5
5
  "license": "UNLICENSED",
6
6
  "main": "./dist/index.js",