12831531306

Committed 17 Jan 2025 03:01PM UTC coverage: 77.182% (+0.07%) from 77.115%

Build # 12831531306

Build Type

Pull #10746

github

Committed by

web-flow

Commit Message

Merge 501dbaeea into 4e4dabc03

Pull Request Pull Request #10746: Fix #10739 Changing correctly resolutions limits when switching map CRS

Run Details

30373 of 47156 branches covered (64.41%)

34 of 43 new or added lines in 2 files covered. (79.07%)

126 existing lines in 15 files now uncovered.

37769 of 48935 relevant lines covered (77.18%)

35.14 hits per line

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

55.26

/web/client/components/map/cesium/plugins/ThreeDTilesLayer.js

/**
 * Copyright 2022, GeoSolutions Sas.
 * All rights reserved.
 *
 * This source code is licensed under the BSD-style license found in the
 * LICENSE file in the root directory of this source tree.
 */

import Layers from '../../../../utils/cesium/Layers';
import * as Cesium from 'cesium';
import isEqual from 'lodash/isEqual';
import isNumber from 'lodash/isNumber';
import isNaN from 'lodash/isNaN';
import { getProxyUrl } from "../../../../utils/ProxyUtils";
import { getStyleParser } from '../../../../utils/VectorStyleUtils';
import { polygonToClippingPlanes } from '../../../../utils/cesium/PrimitivesUtils';
import tinycolor from 'tinycolor2';
import googleOnWhiteLogo from '../img/google_on_white_hdpi.png';
import googleOnNonWhiteLogo from '../img/google_on_non_white_hdpi.png';

const cleanStyle = (style, options) => {
    if (style && options?.pointCloudShading?.attenuation) {
        // remove pointSize if attenuation are applied
        const { pointSize, ...others } = style;
        return others;
    }
    return style;
};

function getStyle({ style, pointCloudShading = {} }) {
    const { format, body } = style || {};
    if (!format || !body) {
        return Promise.resolve(null);
    }
    if (format === '3dtiles') {
        return Promise.resolve(cleanStyle(body, { pointCloudShading }));
    }
    if (format === 'geostyler') {
        return getStyleParser('3dtiles')
            .then((parser) => parser.writeStyle(body))
            .then((parsedStyle) => cleanStyle(parsedStyle, { pointCloudShading }));
    }
    return Promise.all([
        getStyleParser(format),
        getStyleParser('3dtiles')
    ])
        .then(([parser, threeDTilesParser]) =>
            parser
                .readStyle(body)
                .then(parsedStyle => threeDTilesParser.writeStyle(parsedStyle))
                .then((parsedStyle) => cleanStyle(parsedStyle, { pointCloudShading }))
        );
}

function updateModelMatrix(tileSet, { heightOffset }) {
    if (!isNaN(heightOffset) && isNumber(heightOffset)) {
        const boundingSphere = tileSet.boundingSphere;
        const cartographic = Cesium.Cartographic.fromCartesian(boundingSphere.center);          // undefined if the cartesian is at the center of the ellipsoid
        const surface = Cesium.Cartesian3.fromRadians(cartographic?.longitude || 0, cartographic?.latitude || 0, 0.0);
        const offset = Cesium.Cartesian3.fromRadians(cartographic?.longitude || 0, cartographic?.latitude || 0, heightOffset);
        const translation = Cesium.Cartesian3.subtract(offset, surface, new Cesium.Cartesian3());
        tileSet.modelMatrix =  Cesium.Matrix4.fromTranslation(translation);
    }
}

function clip3DTiles(tileSet, options, map) {

    const request = () => options.clippingPolygon
        ? polygonToClippingPlanes(options.clippingPolygon, !!options.clippingPolygonUnion, options.clipOriginalGeometry)
        : Promise.resolve([]);

    request()
        .then((planes) => {
            if (planes?.length && !tileSet.clippingPlanes) {
                tileSet.clippingPlanes = new Cesium.ClippingPlaneCollection({
                    modelMatrix: Cesium.Matrix4.inverse(
                        Cesium.Matrix4.multiply(
                            tileSet.root.computedTransform,
                            tileSet._initialClippingPlanesOriginMatrix,
                            new Cesium.Matrix4()
                        ),
                        new Cesium.Matrix4()),
                    planes,
                    unionClippingRegions: !!options.clippingPolygonUnion
                });
            }
            if (tileSet.clippingPlanes) {
                tileSet.clippingPlanes.removeAll();
                tileSet.clippingPlanes.unionClippingRegions = !!options.clippingPolygonUnion;
                planes.forEach((plane) => {
                    tileSet.clippingPlanes.add(plane);
                });
                map.scene.requestRender();
            }
        });
}

let pendingCallbacks = {};

function ensureReady(layer, callback, eventKey) {
    const tileSet = layer.getTileSet();
    if (!tileSet && eventKey) {
        pendingCallbacks[eventKey] = callback;
        return;
    }
    if (tileSet.ready) {
        callback(tileSet);
    } else {
        tileSet.readyPromise.then(() => {
            callback(tileSet);
        });
    }
}

// Google Photorealistic 3D Tiles requires both attribution and brand logo (see https://cloud.google.com/blog/products/maps-platform/commonly-asked-questions-about-our-recently-launched-photorealistic-3d-tiles)
// The attribution are dynamic and updated directly with the `showCreditsOnScreen` property (see https://developers.google.com/maps/documentation/tile/policies#3d_tiles)
// The brand logo instead is not managed by the Cesium3DTileset class and must to be included in the credits
function updateGooglePhotorealistic3DTilesBrandLogo(map, options, tileSet) {
    if ((options?.url || '').includes('https://tile.googleapis.com')) {
        if (!tileSet._googleCredit) {
            const bodyStyle = window?.getComputedStyle ? window.getComputedStyle(document.body, null) : null;
            const bodyBackgroundColor = bodyStyle?.getPropertyValue ? bodyStyle.getPropertyValue('background-color') : '#ffffff';
            const src = tinycolor(bodyBackgroundColor).isDark()
                ? googleOnNonWhiteLogo
                : googleOnWhiteLogo;
            tileSet._googleCredit = new Cesium.Credit(`<img src="${src}" title="Google" style="padding:0 0.5rem"/>`, true);
            return map.creditDisplay.addStaticCredit(tileSet._googleCredit);
        }
        return map.creditDisplay.removeStaticCredit(tileSet._googleCredit);
    }
    return null;
}

function updateShading(tileSet, options, map) {
    // point cloud
    tileSet.pointCloudShading.attenuation = !!options?.pointCloudShading?.attenuation;
    tileSet.pointCloudShading.maximumAttenuation = options?.pointCloudShading?.maximumAttenuation ?? 4;
    tileSet.pointCloudShading.eyeDomeLighting = !!options?.pointCloudShading?.eyeDomeLighting;
    tileSet.pointCloudShading.eyeDomeLightingStrength = options?.pointCloudShading?.eyeDomeLightingStrength ?? 1.0;
    tileSet.pointCloudShading.eyeDomeLightingRadius = options?.pointCloudShading?.eyeDomeLightingRadius ?? 1.0;
    setTimeout(() => map.scene.requestRender());
}

const createLayer = (options, map) => {
    if (!options.visibility) {
        return {
            detached: true,
            getResource: () => undefined,
            getTileSet: () => undefined,
            add: () => {},
            remove: () => {}
        };
    }
    let tileSet;
    let resource;
    let promise;
    const removeTileset = () => {
        updateGooglePhotorealistic3DTilesBrandLogo(map, options, tileSet);
        map.scene.primitives.remove(tileSet);
        tileSet = undefined;
    };
    const layer = {
        getTileSet: () => tileSet,
        getResource: () => resource
    };
    return {
        detached: true,
        ...layer,
        add: () => {
            resource = new Cesium.Resource({
                url: options.url,
                proxy: options.forceProxy ? new Cesium.DefaultProxy(getProxyUrl()) : undefined
                // TODO: axios supports also adding access tokens or credentials (e.g. authkey, Authentication header ...).
                // if we want to use internal cesium functionality to retrieve data
                // we need to create a utility to set a CesiumResource that applies also this part.
                // in addition to this proxy.
            });
            promise = Cesium.Cesium3DTileset.fromUrl(resource,
                {
                    showCreditsOnScreen: true
                }
            ).then((_tileSet) => {
                tileSet = _tileSet;
                updateGooglePhotorealistic3DTilesBrandLogo(map, options, tileSet);
                map.scene.primitives.add(tileSet);
                // assign the original mapstore id of the layer
                tileSet.msId = options.id;
                ensureReady(layer, () => {
                    updateModelMatrix(tileSet, options);
                    clip3DTiles(tileSet, options, map);
                    updateShading(tileSet, options, map);
                    getStyle(options)
                        .then((style) => {
                            if (style) {
                                tileSet.style = new Cesium.Cesium3DTileStyle(style);
                            }
                            Object.keys(pendingCallbacks).forEach((eventKey) => {
                                pendingCallbacks[eventKey](tileSet);
                            });
                            pendingCallbacks = {};
                        });
                });
            });
        },
        remove: () => {
            if (tileSet) {
                removeTileset();
                return;
            }
            if (promise) {
                promise.then(() => {
                    removeTileset();
                });
            }
            return;
        }
    };
};

Layers.registerType('3dtiles', {
    create: createLayer,
    update: function(layer, newOptions, oldOptions, map) {
        if (newOptions.forceProxy !== oldOptions.forceProxy) {
            return createLayer(newOptions, map);
        }
        if (
            (!isEqual(newOptions.clippingPolygon, oldOptions.clippingPolygon)
            || newOptions.clippingPolygonUnion !== oldOptions.clippingPolygonUnion
            || newOptions.clipOriginalGeometry !== oldOptions.clipOriginalGeometry)
        ) {
            ensureReady(layer, (tileSet) => {
                clip3DTiles(tileSet, newOptions, map);
            }, 'clip');
        }
        if ((
            !isEqual(newOptions.style, oldOptions.style)
            || newOptions?.pointCloudShading?.attenuation !== oldOptions?.pointCloudShading?.attenuation
        )) {
            ensureReady(layer, (tileSet) => {
                getStyle(newOptions)
                    .then((style) => {
                        if (style && tileSet) {
                            tileSet.makeStyleDirty();
                            tileSet.style = new Cesium.Cesium3DTileStyle(style);
                        }
                    });
            }, 'style');
        }
        if (!isEqual(newOptions.pointCloudShading, oldOptions.pointCloudShading)) {
            ensureReady(layer, (tileSet) => {
                updateShading(tileSet, newOptions, map);
            }, 'shading');
        }
        if (newOptions.heightOffset !== oldOptions.heightOffset) {
            ensureReady(layer, (tileSet) => {
                updateModelMatrix(tileSet, newOptions);
            }, 'matrix');
        }
        return null;
    }
});

1	/**
2	* Copyright 2022, GeoSolutions Sas.
3	* All rights reserved.
4	*
5	* This source code is licensed under the BSD-style license found in the
6	* LICENSE file in the root directory of this source tree.
7	*/
8
9	import Layers from '../../../../utils/cesium/Layers';
10	import * as Cesium from 'cesium';
11	import isEqual from 'lodash/isEqual';
12	import isNumber from 'lodash/isNumber';
13	import isNaN from 'lodash/isNaN';
14	import { getProxyUrl } from "../../../../utils/ProxyUtils";
15	import { getStyleParser } from '../../../../utils/VectorStyleUtils';
16	import { polygonToClippingPlanes } from '../../../../utils/cesium/PrimitivesUtils';
17	import tinycolor from 'tinycolor2';
18	import googleOnWhiteLogo from '../img/google_on_white_hdpi.png';
19	import googleOnNonWhiteLogo from '../img/google_on_non_white_hdpi.png';
20
21	const cleanStyle = (style, options) => {	1✔
22	if (style && options?.pointCloudShading?.attenuation) {	×
23	// remove pointSize if attenuation are applied
24	const { pointSize, ...others } = style;	×
25	return others;	×
26	}
27	return style;	×
28	};
29
30	function getStyle({ style, pointCloudShading = {} }) {	2✔
31	const { format, body } = style \|\| {};	2✔
32	if (!format \|\| !body) {	2!
33	return Promise.resolve(null);	2✔
34	}
35	if (format === '3dtiles') {	×
36	return Promise.resolve(cleanStyle(body, { pointCloudShading }));	×
37	}
38	if (format === 'geostyler') {	×
39	return getStyleParser('3dtiles')	×
40	.then((parser) => parser.writeStyle(body))	×
41	.then((parsedStyle) => cleanStyle(parsedStyle, { pointCloudShading }));	×
42	}
43	return Promise.all([	×
44	getStyleParser(format),
45	getStyleParser('3dtiles')
46	])
47	.then(([parser, threeDTilesParser]) =>
48	parser	×
49	.readStyle(body)
50	.then(parsedStyle => threeDTilesParser.writeStyle(parsedStyle))	×
51	.then((parsedStyle) => cleanStyle(parsedStyle, { pointCloudShading }))	×
52	);
53	}
54
55	function updateModelMatrix(tileSet, { heightOffset }) {
56	if (!isNaN(heightOffset) && isNumber(heightOffset)) {	2✔
57	const boundingSphere = tileSet.boundingSphere;	1✔
58	const cartographic = Cesium.Cartographic.fromCartesian(boundingSphere.center); // undefined if the cartesian is at the center of the ellipsoid	1✔
59	const surface = Cesium.Cartesian3.fromRadians(cartographic?.longitude \|\| 0, cartographic?.latitude \|\| 0, 0.0);	1!
60	const offset = Cesium.Cartesian3.fromRadians(cartographic?.longitude \|\| 0, cartographic?.latitude \|\| 0, heightOffset);	1!
61	const translation = Cesium.Cartesian3.subtract(offset, surface, new Cesium.Cartesian3());	1✔
62	tileSet.modelMatrix = Cesium.Matrix4.fromTranslation(translation);	1✔
63	}
64	}
65
66	function clip3DTiles(tileSet, options, map) {
67
68	const request = () => options.clippingPolygon	2!
69	? polygonToClippingPlanes(options.clippingPolygon, !!options.clippingPolygonUnion, options.clipOriginalGeometry)
70	: Promise.resolve([]);
71
72	request()	2✔
73	.then((planes) => {
74	if (planes?.length && !tileSet.clippingPlanes) {	2!
75	tileSet.clippingPlanes = new Cesium.ClippingPlaneCollection({	×
76	modelMatrix: Cesium.Matrix4.inverse(
77	Cesium.Matrix4.multiply(
78	tileSet.root.computedTransform,
79	tileSet._initialClippingPlanesOriginMatrix,
80	new Cesium.Matrix4()
81	),
82	new Cesium.Matrix4()),
83	planes,
84	unionClippingRegions: !!options.clippingPolygonUnion
85	});
86	}
87	if (tileSet.clippingPlanes) {	2!
88	tileSet.clippingPlanes.removeAll();	×
89	tileSet.clippingPlanes.unionClippingRegions = !!options.clippingPolygonUnion;	×
90	planes.forEach((plane) => {	×
91	tileSet.clippingPlanes.add(plane);	×
92	});
93	map.scene.requestRender();	×
94	}
95	});
96	}
97
98	let pendingCallbacks = {};	1✔
99
100	function ensureReady(layer, callback, eventKey) {
101	const tileSet = layer.getTileSet();	2✔
102	if (!tileSet && eventKey) {	2!
103	pendingCallbacks[eventKey] = callback;	×
UNCOV 104	return;	×
105	}
106	if (tileSet.ready) {	2!
107	callback(tileSet);	2✔
108	} else {
UNCOV 109	tileSet.readyPromise.then(() => {	×
UNCOV 110	callback(tileSet);	×
111	});
112	}
113	}
114
115	// Google Photorealistic 3D Tiles requires both attribution and brand logo (see https://cloud.google.com/blog/products/maps-platform/commonly-asked-questions-about-our-recently-launched-photorealistic-3d-tiles)
116	// The attribution are dynamic and updated directly with the `showCreditsOnScreen` property (see https://developers.google.com/maps/documentation/tile/policies#3d_tiles)
117	// The brand logo instead is not managed by the Cesium3DTileset class and must to be included in the credits
118	function updateGooglePhotorealistic3DTilesBrandLogo(map, options, tileSet) {
119	if ((options?.url \|\| '').includes('https://tile.googleapis.com')) {	4!
120	if (!tileSet._googleCredit) {	×
UNCOV 121	const bodyStyle = window?.getComputedStyle ? window.getComputedStyle(document.body, null) : null;	×
122	const bodyBackgroundColor = bodyStyle?.getPropertyValue ? bodyStyle.getPropertyValue('background-color') : '#ffffff';	×
UNCOV 123	const src = tinycolor(bodyBackgroundColor).isDark()	×
124	? googleOnNonWhiteLogo
125	: googleOnWhiteLogo;
UNCOV 126	tileSet._googleCredit = new Cesium.Credit(`<img src="${src}" title="Google" style="padding:0 0.5rem"/>`, true);	×
UNCOV 127	return map.creditDisplay.addStaticCredit(tileSet._googleCredit);	×
128	}
UNCOV 129	return map.creditDisplay.removeStaticCredit(tileSet._googleCredit);	×
130	}
131	return null;	4✔
132	}
133
134	function updateShading(tileSet, options, map) {
135	// point cloud
136	tileSet.pointCloudShading.attenuation = !!options?.pointCloudShading?.attenuation;	2✔
137	tileSet.pointCloudShading.maximumAttenuation = options?.pointCloudShading?.maximumAttenuation ?? 4;	2✔
138	tileSet.pointCloudShading.eyeDomeLighting = !!options?.pointCloudShading?.eyeDomeLighting;	2✔
139	tileSet.pointCloudShading.eyeDomeLightingStrength = options?.pointCloudShading?.eyeDomeLightingStrength ?? 1.0;	2✔
140	tileSet.pointCloudShading.eyeDomeLightingRadius = options?.pointCloudShading?.eyeDomeLightingRadius ?? 1.0;	2✔
141	setTimeout(() => map.scene.requestRender());	2✔
142	}
143
144	const createLayer = (options, map) => {	1✔
145	if (!options.visibility) {	8✔
146	return {	1✔
147	detached: true,
UNCOV 148	getResource: () => undefined,	×
149	getTileSet: () => undefined,	1✔
150	add: () => {},
151	remove: () => {}
152	};
153	}
154	let tileSet;
155	let resource;
156	let promise;
157	const removeTileset = () => {	7✔
158	updateGooglePhotorealistic3DTilesBrandLogo(map, options, tileSet);	2✔
159	map.scene.primitives.remove(tileSet);	2✔
160	tileSet = undefined;	2✔
161	};
162	const layer = {	7✔
163	getTileSet: () => tileSet,	11✔
164	getResource: () => resource	12✔
165	};
166	return {	7✔
167	detached: true,
168	...layer,
169	add: () => {
170	resource = new Cesium.Resource({	4✔
171	url: options.url,
172	proxy: options.forceProxy ? new Cesium.DefaultProxy(getProxyUrl()) : undefined	4✔
173	// TODO: axios supports also adding access tokens or credentials (e.g. authkey, Authentication header ...).
174	// if we want to use internal cesium functionality to retrieve data
175	// we need to create a utility to set a CesiumResource that applies also this part.
176	// in addition to this proxy.
177	});
178	promise = Cesium.Cesium3DTileset.fromUrl(resource,	4✔
179	{
180	showCreditsOnScreen: true
181	}
182	).then((_tileSet) => {
183	tileSet = _tileSet;	2✔
184	updateGooglePhotorealistic3DTilesBrandLogo(map, options, tileSet);	2✔
185	map.scene.primitives.add(tileSet);	2✔
186	// assign the original mapstore id of the layer
187	tileSet.msId = options.id;	2✔
188	ensureReady(layer, () => {	2✔
189	updateModelMatrix(tileSet, options);	2✔
190	clip3DTiles(tileSet, options, map);	2✔
191	updateShading(tileSet, options, map);	2✔
192	getStyle(options)	2✔
193	.then((style) => {
194	if (style) {	2!
UNCOV 195	tileSet.style = new Cesium.Cesium3DTileStyle(style);	×
196	}
197	Object.keys(pendingCallbacks).forEach((eventKey) => {	2✔
198	pendingCallbacks[eventKey](tileSet);	×
199	});
200	pendingCallbacks = {};	2✔
201	});
202	});
203	});
204	},
205	remove: () => {
206	if (tileSet) {	7✔
207	removeTileset();	2✔
208	return;	2✔
209	}
210	if (promise) {	5✔
211	promise.then(() => {	2✔
212	removeTileset();	×
213	});
214	}
215	return;	5✔
216	}
217	};
218	};
219
220	Layers.registerType('3dtiles', {	1✔
221	create: createLayer,
222	update: function(layer, newOptions, oldOptions, map) {
223	if (newOptions.forceProxy !== oldOptions.forceProxy) {	3!
224	return createLayer(newOptions, map);	3✔
225	}
226	if (	×
227	(!isEqual(newOptions.clippingPolygon, oldOptions.clippingPolygon)	×
228	\|\| newOptions.clippingPolygonUnion !== oldOptions.clippingPolygonUnion
229	\|\| newOptions.clipOriginalGeometry !== oldOptions.clipOriginalGeometry)
230	) {
231	ensureReady(layer, (tileSet) => {	×
UNCOV 232	clip3DTiles(tileSet, newOptions, map);	×
233	}, 'clip');
234	}
UNCOV 235	if ((	×
236	!isEqual(newOptions.style, oldOptions.style)	×
237	\|\| newOptions?.pointCloudShading?.attenuation !== oldOptions?.pointCloudShading?.attenuation
238	)) {
UNCOV 239	ensureReady(layer, (tileSet) => {	×
UNCOV 240	getStyle(newOptions)	×
241	.then((style) => {
242	if (style && tileSet) {	×
243	tileSet.makeStyleDirty();	×
UNCOV 244	tileSet.style = new Cesium.Cesium3DTileStyle(style);	×
245	}
246	});
247	}, 'style');
248	}
UNCOV 249	if (!isEqual(newOptions.pointCloudShading, oldOptions.pointCloudShading)) {	×
UNCOV 250	ensureReady(layer, (tileSet) => {	×
UNCOV 251	updateShading(tileSet, newOptions, map);	×
252	}, 'shading');
253	}
UNCOV 254	if (newOptions.heightOffset !== oldOptions.heightOffset) {	×
UNCOV 255	ensureReady(layer, (tileSet) => {	×
UNCOV 256	updateModelMatrix(tileSet, newOptions);	×
257	}, 'matrix');
258	}
UNCOV 259	return null;	×
260	}
261	});

geosolutions-it / MapStore2 / 12831531306

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

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