Google Earth Demo: Add support for retrieving credits (#337)

* fix metadata * Add support for containing metadata in tile cache * fix memory leak * Add support for credits
NASA-AMMOS · May 31, 2023 · c9da400 · c9da400
1 parent 5b06c36
commit c9da400
Show file tree

Hide file tree

Showing 4 changed files with 115 additions and 24 deletions.
diff --git a/example/googleMapsExample.html b/example/googleMapsExample.html
@@ -39,6 +39,16 @@
 				color: white;
 				pointer-events: all;
 			}
+
+			#credits {
+				position: absolute;
+				bottom: 0;
+				left: 0;
+				color: white;
+				font-size: 10px;
+				opacity: 0.5;
+				padding: 5px;
+			}
         </style>
     </head>
     <body>
@@ -48,6 +58,8 @@
 				<br/>
 			</div>
 		</div>
+		<div id="credits">
+		</div>
         <script src="./googleMapsExample.js"></script>
     </body>
 </html>
diff --git a/example/googleMapsExample.js b/example/googleMapsExample.js
@@ -24,10 +24,11 @@ import Stats from 'three/examples/jsm/libs/stats.module.js';
 import { GlobeOrbitControls } from './GlobeOrbitControls.js';
 import { WGS84_RADIUS, WGS84_HEIGHT } from '../src/base/constants.js';
 import { EllipsoidRegionHelper } from '../src/index.js';
+import { MapsTilesCredits } from './src/MapsTilesCredits.js';
 
 const apiOrigin = 'https://tile.googleapis.com';
 
-let camera, controls, scene, renderer, tiles, cameraHelper;
+let camera, controls, scene, renderer, tiles, credits, cameraHelper;
 let mainGroup;
 let statsContainer, stats;
 
@@ -127,21 +128,23 @@ function reinstantiateTiles() {
 
 			}
 
-			// TODO: check this is correct
-			// find first node with uri and treat that as root
-			let uri = undefined;
-			const toVisit = [];
-			for ( let curr = json.root; curr !== undefined; curr = toVisit.pop() ) {
+			// TODO: See if there's a better way to retrieve the session id
+			let uri;
+			const toVisit = [ json.root ];
+			while ( toVisit.length !== 0 ) {
 
-				if ( curr.content.uri ) {
+				const curr = toVisit.pop();
+				if ( curr.content && curr.content.uri ) {
 
 					uri = new URL( `${ apiOrigin }${ curr.content.uri }` );
 					uri.searchParams.append( 'key', params.apiKey );
 					break;
 
-				}
+				} else {
+
+					toVisit.push( ...curr.children );
 
-				toVisit.push( ...curr.children );
+				}
 
 			}
 
@@ -167,6 +170,16 @@ function reinstantiateTiles() {
 
 			};
 
+			credits = new MapsTilesCredits();
+			tiles.onTileVisibilityChange = ( scene, tile, visible ) => {
+
+				const copyright = tile.cached.metadata.asset.copyright || '';
+				if ( visible ) credits.addCredits( copyright );
+				else credits.removeCredits( copyright );
+
+
+			};
+
 			tiles.lruCache.minSize = 3000;
 			tiles.lruCache.maxSize = 5000;
 			tiles.group.rotation.x = - Math.PI / 2;
@@ -532,4 +545,10 @@ function render() {
 
 	}
 
+	if ( credits ) {
+
+		document.getElementById( 'credits' ).innerText = credits.getCredits();
+
+	}
+
 }
diff --git a/example/src/MapsTilesCredits.js b/example/src/MapsTilesCredits.js
@@ -0,0 +1,53 @@
+export class MapsTilesCredits {
+
+	constructor() {
+
+		this.creditsCount = {};
+
+	}
+
+	_adjustCredits( line, add ) {
+
+		const creditsCount = this.creditsCount;
+		const tokens = line.split( /;/g );
+		for ( let i = 0, l = tokens.length; i < l; i ++ ) {
+
+			const t = tokens[ i ];
+			if ( ! ( t in creditsCount ) ) {
+
+				creditsCount[ t ] = 0;
+
+			}
+
+			creditsCount[ t ] += add ? 1 : - 1;
+
+			if ( creditsCount[ t ] <= 0 ) {
+
+				delete creditsCount[ t ];
+
+			}
+
+		}
+
+	}
+
+	addCredits( line ) {
+
+		this._adjustCredits( line, true );
+
+	}
+
+	removeCredits( line ) {
+
+		this._adjustCredits( line, false );
+
+	}
+
+	getCredits() {
+
+		const tokens = Object.keys( this.creditsCount ).sort();
+		return tokens.join( ', ' );
+
+	}
+
+}
diff --git a/src/three/TilesRenderer.js b/src/three/TilesRenderer.js
@@ -642,9 +642,7 @@ export class TilesRenderer extends TilesRendererBase {
 
 				loader.adjustmentTransform.copy( upAdjustment );
 
-				promise = loader
-					.parse( buffer )
-					.then( res => res.scene );
+				promise = loader.parse( buffer );
 				break;
 
 			}
@@ -654,9 +652,7 @@ export class TilesRenderer extends TilesRendererBase {
 				const loader = new PNTSLoader( manager );
 				loader.workingPath = workingPath;
 				loader.fetchOptions = fetchOptions;
-				promise = loader
-					.parse( buffer )
-					.then( res => res.scene );
+				promise = loader.parse( buffer );
 				break;
 
 			}
@@ -669,9 +665,7 @@ export class TilesRenderer extends TilesRendererBase {
 
 				loader.adjustmentTransform.copy( upAdjustment );
 
-				promise = loader
-					.parse( buffer )
-					.then( res => res.scene );
+				promise = loader.parse( buffer );
 				break;
 
 			}
@@ -697,9 +691,7 @@ export class TilesRenderer extends TilesRendererBase {
 				const loader = new GLTFExtensionLoader( manager );
 				loader.workingPath = workingPath;
 				loader.fetchOptions = fetchOptions;
-				promise = loader
-					.parse( buffer )
-					.then( res => res.scene	);
+				promise = loader.parse( buffer );
 				break;
 
 			default:
@@ -709,7 +701,21 @@ export class TilesRenderer extends TilesRendererBase {
 
 		}
 
-		return promise.then( scene => {
+		return promise.then( result => {
+
+			let scene;
+			let metadata;
+			if ( result.isObject3D ) {
+
+				scene = result;
+				metadata = null;
+
+			} else {
+
+				scene = result.scene;
+				metadata = result;
+
+			}
 
 			if ( tile._loadIndex !== loadIndex ) {
 
@@ -739,8 +745,6 @@ export class TilesRenderer extends TilesRendererBase {
 			} );
 			updateFrustumCulled( scene, ! this.autoDisableRendererCulling );
 
-			cached.scene = scene;
-
 			// We handle raycasting in a custom way so remove it from here
 			scene.traverse( c => {
 
@@ -782,6 +786,8 @@ export class TilesRenderer extends TilesRendererBase {
 			cached.materials = materials;
 			cached.geometry = geometry;
 			cached.textures = textures;
+			cached.scene = scene;
+			cached.metadata = metadata;
 
 			if ( this.onLoadModel ) {
 
@@ -839,6 +845,7 @@ export class TilesRenderer extends TilesRendererBase {
 			cached.materials = null;
 			cached.textures = null;
 			cached.geometry = null;
+			cached.metadata = null;
 
 		}