@ -46,7 +46,7 @@ var currentGeoPose = null; // https://developer.mozilla.org/en-US/docs/Web/API/G
// otherwise have 2 fallbacks via menu // otherwise have 2 fallbacks via menu
var positionsCurated = [ var positionsCurated = [
{ position:[50.8365354, 4.3581719], hotspots: []}, { position:[50.8365354, 4.3581719], hotspots: []},
{ shortname: "baquets", worldposition:[83.03582, -346.4272 ], position:[49.3516400, 0.5461600], // way heavier! { shortname: "baquets", worldposition:[-38, 17 ], position:[49.3516400, 0.5461600], // way heavier!
offsetLandscapePosition: "-124.32254 0.78377 -46.41836", // TODO use, might prefer something easier to compute to add e.g Vector3, or do pose (position/rotation/scale) per id offsetLandscapePosition: "-124.32254 0.78377 -46.41836", // TODO use, might prefer something easier to compute to add e.g Vector3, or do pose (position/rotation/scale) per id
// alternatively might show/hide per classname based on shortname // alternatively might show/hide per classname based on shortname
offsetWatersimPosition: "-124.32254 0.78377 -46.41836", // TODO use offsetWatersimPosition: "-124.32254 0.78377 -46.41836", // TODO use
@ -194,6 +194,7 @@ function fromOSMTo3DElements( josm, el ){
//var houses = josm.elements.filter( e => (e.type == "way" & & e.tags & & e.tags["add:housenumber"]) ).map( e => e.geometry) //var houses = josm.elements.filter( e => (e.type == "way" & & e.tags & & e.tags["add:housenumber"]) ).map( e => e.geometry)
var houses = josm.elements.filter( e => (e.type == "way" & & e.tags & & e.tags["building"]) ) var houses = josm.elements.filter( e => (e.type == "way" & & e.tags & & e.tags["building"]) )
.filter( i => !loadedosmways.includes(i.id) ) .filter( i => !loadedosmways.includes(i.id) )
.filter( i => (i.id < 561974951 | | i . id > 561974997) ) // does not seem present in the model (assuming sequential OSM list, as of now)
.map( e => e.geometry) .map( e => e.geometry)
houses.map( e => { makeBuilding( e, buildingHeight*(1+Math.random()), el ) }) houses.map( e => { makeBuilding( e, buildingHeight*(1+Math.random()), el ) })
idfound = josm.elements.filter( e => (e.type == "way" & & e.tags & & e.tags["building"]) ) idfound = josm.elements.filter( e => (e.type == "way" & & e.tags & & e.tags["building"]) )
@ -255,7 +256,7 @@ function addWall(a, b, h, el, color=0x6d6a64){
const material = new THREE.MeshBasicMaterial({ const material = new THREE.MeshBasicMaterial({
color : new THREE.Color( 0x6d6a64 ).offsetHSL(0,0,-Math.random()/10), color : new THREE.Color( 0x6d6a64 ).offsetHSL(0,0,-Math.random()/10),
side: THREE.DoubleSide, side: THREE.DoubleSide,
map: loader.load('Visuals/TEXTURE_BAT/TEXTURE_BAT_Base_Color.jpg'), // map: loader.load('Visuals/TEXTURE_BAT/TEXTURE_BAT_Base_Color.jpg'),
}); });
var mesh = new THREE.Mesh( geometry, material ); var mesh = new THREE.Mesh( geometry, material );
@ -334,25 +335,19 @@ function makeWay( points, height, el, color=0xCCCCCC ){
} }
function makeLamp( treedata, el){ function makeLamp( treedata, el){
// < a-gltf-model position = "-2 0 -6" scale = "2 2 2" src = "arbre.gltf" > < / a-gltf-model >
var tree = document.createElement("a-entity") var tree = document.createElement("a-entity")
tree.setAttribute("position", AFRAME.utils.coordinates.stringify( tree.setAttribute("position", AFRAME.utils.coordinates.stringify(
pointFromCoordinates( {lat:treedata.lat, lon:treedata.lon} ) pointFromCoordinates( {lat:treedata.lat, lon:treedata.lon} )
) ) ) )
//tree.setAttribute("gltf-model", "Visuals/EXPORTS/EXPORTS_gltf/ModelsSolo/AA_Ruelle_Lampadaire.glb" )
tree.setAttribute("instanced-mesh-member", "mesh:#meshlamp") tree.setAttribute("instanced-mesh-member", "mesh:#meshlamp")
el.appendChild( tree ) el.appendChild( tree )
} }
function makeTree( treedata, el){ function makeTree( treedata, el){
// < a-gltf-model position = "-2 0 -6" scale = "2 2 2" src = "arbre.gltf" > < / a-gltf-model >
var tree = document.createElement("a-entity") var tree = document.createElement("a-entity")
tree.setAttribute("position", AFRAME.utils.coordinates.stringify( tree.setAttribute("position", AFRAME.utils.coordinates.stringify(
pointFromCoordinates( {lat:treedata.lat, lon:treedata.lon} ) pointFromCoordinates( {lat:treedata.lat, lon:treedata.lon} )
) ) ) )
//tree.setAttribute("gltf-model", "Visuals/EXPORTS/EXPORTS_gltf/AA_Ruelle_Arbre.glb" )
tree.setAttribute("instanced-mesh-member", "mesh:#meshtree") tree.setAttribute("instanced-mesh-member", "mesh:#meshtree")
el.appendChild( tree ) el.appendChild( tree )
} }
@ -371,16 +366,6 @@ function makeBuilding( points, height, el ){
var color = new THREE.Color( 0x8F8FFF ).offsetHSL(0,0,-Math.random()); var color = new THREE.Color( 0x8F8FFF ).offsetHSL(0,0,-Math.random());
make3DRoof( poly, building, height, color ) make3DRoof( poly, building, height, color )
building.setAttribute("shadow", "")// somehow doesn't seem to receive it, only casts
/*
var inbuilding = document.createElement("a-entity")
inbuilding.className = "inbuilding"
building.appendChild( inbuilding )
makeWalls( poly, 0.2, inbuilding )
make3DFloor( poly, inbuilding )
inbuilding.setAttribute("scale", "1.1 1 1.1") // adds an horizontal offset instead of being centered on building
inbuilding.setAttribute("position", "-.2 0 -.2")
*/
} }
function makeLine( poly, h, el ){ function makeLine( poly, h, el ){
@ -679,8 +664,8 @@ function startExperience(){
< / a-entity > < / a-entity >
< a-gltf-model resetanimations = "" position = "6 6 9" scale = "100 100 100" rotation = "29 -160 -10" gltf-model = "Visuals/ASSETS_3D/AA_Reset.glb" opacity = "1" > < / a-gltf-model > < a-gltf-model resetanimations = "" position = "6 6 9" scale = "100 100 100" rotation = "29 -160 -10" gltf-model = "Visuals/ASSETS_3D/AA_Reset.glb" opacity = "1" > < / a-gltf-model >
< / a-entity > < / a-entity >
< a-entity id = "meshlamp" gltf-model = "Visuals/EXPORTS/EXPORTS_gltf/ModelsSolo/AA_Ruelle_Lampadaire.glb" instanced-mesh > < / a-entity > < a-entity id = "meshlamp" gltf-model = "Visuals/EXPORTS/EXPORTS_gltf/ModelsSolo/AA_Ruelle_Lampadaire.glb" instanced-mesh > < / a-entity >
< a-entity id = "meshtree" gltf-model = "Visuals/EXPORTS/EXPORTS_gltf/AA_Ruelle_Arbre.glb" instanced-mesh > < / a-entity > < a-entity id = "meshtree" gltf-model = "Visuals/EXPORTS/EXPORTS_gltf/AA_Ruelle_Arbre.glb" instanced-mesh > < / a-entity >
< a-plane id = "ground" visible = false position = "0 -.5 0" rotation = "-90 0 0" width = "1000" height = "1000" color = "lightgrey" > < / a-plane > < a-plane id = "ground" visible = false position = "0 -.5 0" rotation = "-90 0 0" width = "1000" height = "1000" color = "lightgrey" > < / a-plane >
< a-entity light = "type: ambient; color: #BBB" > < / a-entity > < a-entity light = "type: ambient; color: #BBB" > < / a-entity >
@ -689,22 +674,21 @@ function startExperience(){
animation__pos="property: position; from:-50 50 100; to: 50 50 100; dur: 20000; easing: linear; loop: true"> animation__pos="property: position; from:-50 50 100; to: 50 50 100; dur: 20000; easing: linear; loop: true">
< / a-entity > < / a-entity >
< a-entity position = "-70 0 -42 " osm id = "osm" > < / a-entity > < a-entity position = "0 -0.10 0 " osm id = "osm" > < / a-entity >
<!-- offset on test data for easier vr testing --> <!-- offset on test data for easier vr testing -->
< a-gltf-model class = "models_ruelle" visible = "" position = "-139.95628 0.73 -34.3154" scale = "1.2 1.2 1.2" rotation = "0 -111.8545396388247 0" gltf-model = "Visuals/EXPORTS/EXPORTS_gltf/AA_Quaidelaruelle.glb" listosmways = "" > < / a-gltf-model > < a-gltf-model class = "models_ruelle" visible = "" position = "-139.95628 0.73 -34.3154" scale = "1.2 1.2 1.2" rotation = "0 -111.8545396388247 0" gltf-model = "Visuals/EXPORTS/EXPORTS_gltf/AA_Quaidelaruelle.glb" listosmways = "" > < / a-gltf-model >
< a-gltf-model class = "models_baquets" visible = "" position = "33.17554 -1.33294 -293.0568" scale = "1.2 1.2 1.2" rotation = "0 170.2355012158848 0" gltf-model = "Visuals/EXPORTS/EXPORTS_gltf/AA_Citedesbaquets.glb" listosmways = "" > < / a-gltf-model > < a-gltf-model class = "models_baquets" visible = "" position = "-28.39341 0 10.05424" scale = "" rotation = "0 66.68655777527651 0" gltf-model = "Visuals/EXPORTS/EXPORTS_gltf/AA_Citedesbaquets.glb" listosmways = "" > < / a-gltf-model >
< a-plane id = "landscape" position = "0 -12.5 0" scale = "10 10 10" rotation = "-90 0 -90" width = "100" height = "100" geometry = "segmentsHeight: 128; segmentsWidth: 128" < a-plane id = "landscape" position = "1135.38323 -36.66906 -1784.89792" scale = "50 50 50" rotation = "-90.00021045914971 -96.34743691360897 0" width = "100" height = "100" geometry = "segmentsHeight: 128; segmentsWidth: 128" material = "src: ign_terrain_cached.jpg; displacementScale: 5; displacementMap: ign_elevation_cached.jpg" visible = "" > < / a-plane >
material="src: ign_terrain_cached.jpg; displacementScale: 10; displacementMap: ign_elevation_cached.jpg;">< / a-plane >
< a-plane id = "watersim" cerema = "" position = "0 -51.55 0" rotation = "-90 90 0" src = "Visuals/EAU/Eau_01.jpg" < a-plane id = "watersim" cerema = "" position = "0 -51.55 0" rotation = "-90 90 0" src = "Visuals/EAU/Eau_01.jpg"
material="displacementScale: 0.04; wireframe: false; displacementMap: " material="displacementScale: 0.04; wireframe: false; displacementMap: "
geometry="segmentsHeight: 128; segmentsWidth: 128" scale="1000 1000 100">< / a-plane > geometry="segmentsHeight: 128; segmentsWidth: 128" scale="1000 1000 100">< / a-plane >
<!-- animation might fail due texture.neddUpdate unset --> <!-- animation might fail due texture.neddUpdate unset -->
< a-image id = "debug_baquet_osm" src = "baquet_osm.png" visible = false position = "-235 1.1 145" rotation = "-90 90 0" scale = "200 200 200" material = "opacity: 0.5" class = debug > < / a-image > < a-image id = "debug_baquet_osm" src = "baquet_osm.png" visible = false position = "-235 1.1 145" rotation = "-90 90 0" scale = "200 200 200" material = "opacity: 0.5" class = debug > < / a-image >
< a-image id = "debug_ruelle_osm" src = "ruelle_osm.png" visible = false position = "-40 1 -220" rotation = "-90 90 0" material = "opacity: 0.5" scale = "200 200 200" class = "debug" > < / a-image > < a-image id = "debug_ruelle_osm" src = "ruelle_osm.png" visible = false position = "-40 1 -220" rotation = "-90 90 0" material = "opacity: 0.5" scale = "200 200 200" class = "debug" > < / a-image >
< a-image id = "debug_sim_cerema" src = "" visible = false position = "0 1.2 0" rotation = "-90 90 0" material = "opacity: 0.5" scale = "1000 1000 1000" class = "debug" > < / a-image > < a-image id = "debug_sim_cerema" src = "" visible = false position = "0 1.2 0" rotation = "-90 90 0" material = "opacity: 0.5" scale = "1000 1000 1000" class = "debug" > < / a-image >
< a-sky src = "cloudsky.jpg" < a-sky src = "cloudsky.jpg"
animation="from: #000; to: #aaf; loop: true; dur: 20000; dir: alternate; loop:true; property: components.material.material.color; type: color;" animation="from: #000; to: #aaf; loop: true; dur: 20000; dir: alternate; loop:true; property: components.material.material.color; type: color;"
animation_texture="property: material.offset; to: 1 1; dur: 200; easing: linear; loop: true; dir: alternate;" animation_texture="property: material.offset; to: 1 1; dur: 200; easing: linear; loop: true; dir: alternate;"
