diff --git a/CHANGELOG.md b/CHANGELOG.md index 3197c683..2ac52dc1 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -4,19 +4,19 @@ Minor version by [@jscastro76](https://github.com/jscastro76), some enhancements #### :sparkles: Enhancements -- three.js draw geojson #125 -- add options.rotate and options.scale for Objects3D #126 -- Create a new example with Three.js extrusions based on standard geoJson #127 Added a new example [17-extrusions.html](https://github.com/jscastro76/threebox/blob/master/examples/17-extrusions.html) -- Convert internal variables (`selectedObject`, `draggedObject`, ...) into instance variables #130 -- Deprecate `tb.setLayerZoomVisibility`, overlaps with `tb.toggleLayer` #134 +- #125 three.js draw geojson. +- #126 add options.rotate and options.scale for Objects3D. +- #127 Create a new example with Three.js extrusions based on standard geoJson. Added a new example [17-extrusions.html](https://github.com/jscastro76/threebox/blob/master/examples/17-extrusions.html) +- #130 Convert internal variables (`selectedObject`, `draggedObject`, ...) into instance variables . +- #134 Deprecate `tb.setLayerZoomVisibility`, overlaps with `tb.toggleLayer`. +- #138 expose `SunCalc.toJulian` #### :beetle: Bug fixes -- when an object is wireframed, all its clones are too #124 -- Error when wireframing all the objects #131 -- While dragging an object if mouse overs a label it stops dragging #132 -- A layer shouldn't be shown explicitely if it's not in the right zoom range #133 - +- #124 when an object is wireframed, all its clones are too. +- #131 Error when wireframing all the objects. +- #132 While dragging an object if mouse overs a label it stops dragging. +- #133 A layer shouldn't be shown explicitely if it's not in the right zoom range.
- - - diff --git a/README.md b/README.md index f145461b..214d5d2d 100755 --- a/README.md +++ b/README.md @@ -5,7 +5,7 @@ [![NPM license](http://img.shields.io/npm/l/threebox-plugin.svg?style=flat-square)](https://www.npmjs.org/package/threebox-plugin) ![npm](https://img.shields.io/npm/dt/threebox-plugin?style=social) -A **[*Three.js*](https://threejs.org/)** plugin for **[*Mapbox GL JS*](https://docs.mapbox.com/mapbox-gl-js/examples/)**, using the [`CustomLayerInterface`](https://docs.mapbox.com/mapbox-gl-js/api/properties/#customlayerinterface) feature. Provides convenient methods to manage objects in lnglat coordinates, and to synchronize the map and scene cameras. +A **[*Three.js*](https://threejs.org/)** plugin for **[*Mapbox GL JS*](https://docs.mapbox.com/mapbox-gl-js/examples/)** and **[Azure Maps](https://azure.microsoft.com/en-us/services/azure-maps/)** using the [`CustomLayerInterface`](https://docs.mapbox.com/mapbox-gl-js/api/properties/#customlayerinterface) feature. Provides convenient methods to manage objects in lnglat coordinates, and to synchronize the map and scene cameras. threebox
@@ -46,20 +46,21 @@ npm i threebox-plugin
Only in this fork, there is a list of new features implemented on top of the amazing work from [@peterqliu](https://github.com/peterqliu/threebox/): -- Update to Three.js v117. -- Update to Mapbox-gl-js v1.11.1. -- [18 examples](https://github.com/jscastro76/threebox/tree/master/examples) with new features. +- Updated to Three.js v117. +- Updated to Mapbox-gl-js v1.11.1. +- Updated to Azure Maps v2.0.31. +- [18 examples](https://github.com/jscastro76/threebox/tree/master/examples) with all the new features. - Support for multiple 3D format objects (FBX, GLTF/GLB, Collada, OBJ/MTL). - Support for CSS2D labels supporting rich HTML controls through a new LabelManager. - Support for CSS2D tooltips/title browser-like and mapbox-like. - Support for built-in shadows and real Sun light positioning for a given datetime and lnglat coords. -- Support for built-in Raycaster in loaded Object3D and fill-extrusions together. +- Support for built-in Raycaster in Object3D and fill-extrusions together. - Support for built-in MouseOver/Mouseout, Selected, Drag&Drop, Drag&Rotate, Wireframe in loadedObjects including events. - Support for [GeoJson](https://geojson.org/) standard features format import and export in different layers. -- Support for Object3D embedded animations, and combined animations on AnimationManager (i.e. translate + embedded). -- Support for multi-floor design of spaces. +- Support for Object3D embedded animations, and custom animations on AnimationManager (i.e. embedded animation + translate + rotate). +- Support for multi-floor/layer design of spaces. - Support for Non-AABB Non Axes Aligned Bounding Box and real model size. -- Support for wireframing on Object3D, removing them from the raycast. +- Support for wireframing on any Object3D, removing them from the raycast. - Support for `setLayerZoomRange` and `setLayoutProperty` on Custom Layers (not available in Mapbox). - Support for `removeLayer` considering Object3D. - Support for style change through `setStyle` and keeping Object3D. diff --git a/dist/threebox.js b/dist/threebox.js index 1f773b04..913572f9 100755 --- a/dist/threebox.js +++ b/dist/threebox.js @@ -692,8 +692,8 @@ Threebox.prototype = { return; } let z = this.map.getZoom(); - if (l.minzoom && z < l.minzoom) { console.log("< minzoom"); this.toggle(l.id, false); return; }; - if (l.maxzoom && z >= l.maxzoom) { console.log(">= maxzoom"); this.toggle(l.id, false); return; }; + if (l.minzoom && z < l.minzoom) { this.toggle(l.id, false); return; }; + if (l.maxzoom && z >= l.maxzoom) { this.toggle(l.id, false); return; }; this.toggle(l.id, true); }; }, @@ -18621,6 +18621,9 @@ module.exports = exports = material; function fromJulian(j) { return new Date((j + 0.5 - J1970) * dayMs); } function toDays(date) { return toJulian(date) - J2000; } + SunCalc.toJulian = function (date) { + return toJulian(date); + }; // general calculations for position diff --git a/dist/threebox.min.js b/dist/threebox.min.js index 307de4a6..5ba1b9e0 100644 --- a/dist/threebox.min.js +++ b/dist/threebox.min.js @@ -2,7 +2,7 @@ window.Threebox=require("./src/Threebox.js"),window.THREE=require("./src/three.js"); },{"./src/Threebox.js":2,"./src/three.js":23}],2:[function(require,module,exports){ -const THREE=require("./three.js"),CameraSync=require("./camera/CameraSync.js"),utils=require("./utils/utils.js"),SunCalc=require("./utils/suncalc.js"),ThreeboxConstants=require("./utils/constants.js"),Objects=require("./objects/objects.js"),material=require("./utils/material.js"),sphere=require("./objects/sphere.js"),extrusion=require("./objects/extrusion.js"),label=require("./objects/label.js"),tooltip=require("./objects/tooltip.js"),loader=require("./objects/loadObj.js"),Object3D=require("./objects/Object3D.js"),line=require("./objects/line.js"),tube=require("./objects/tube.js"),LabelRenderer=require("./objects/LabelRenderer.js"),BuildingShadows=require("./objects/effects/BuildingShadows.js");function Threebox(e,t,i){this.init(e,t,i)}Threebox.prototype={repaint:function(){this.map.repaint=!0},init:function(e,t,i){this.options=utils._validate(i||{},defaultOptions),this.map=e,this.map.tb=this,this.objects=new Objects,this.renderer=new THREE.WebGLRenderer({alpha:!0,antialias:!0,canvas:e.getCanvas(),context:t}),this.renderer.setPixelRatio(window.devicePixelRatio),this.renderer.setSize(this.map.getCanvas().clientWidth,this.map.getCanvas().clientHeight),this.renderer.outputEncoding=THREE.sRGBEncoding,this.renderer.autoClear=!1,this.labelRenderer=new LabelRenderer(this.map),this.scene=new THREE.Scene,this.camera=new THREE.PerspectiveCamera(ThreeboxConstants.FOV_DEGREES,this.map.getCanvas().clientWidth/this.map.getCanvas().clientHeight,1,1e21),this.camera.layers.enable(0),this.camera.layers.enable(1),this.world=new THREE.Group,this.world.name="world",this.scene.add(this.world),this.objectsCache=new Map,this.zoomLayers=[],this.cameraSync=new CameraSync(this.map,this.camera,this.world),this.raycaster=new THREE.Raycaster,this.raycaster.layers.set(0),this.mapCenter=this.map.getCenter(),this.mapCenterUnits=utils.projectToWorld([this.mapCenter.lng,this.mapCenter.lat]),this.lightDateTime=new Date,this.lightLng=this.mapCenter.lng,this.lightLat=this.mapCenter.lat,this.sunPosition,this.rotationStep=5,this.gridStep=6,this.altitudeStep=.1,this.lights=this.initLights,this.options.defaultLights&&this.defaultLights(),this.options.realSunlight&&this.realSunlight(this.options.realSunlightHelper),this.enableSelectingFeatures=this.options.enableSelectingFeatures||!1,this.enableSelectingObjects=this.options.enableSelectingObjects||!1,this.enableDraggingObjects=this.options.enableDraggingObjects||!1,this.enableRotatingObjects=this.options.enableRotatingObjects||!1,this.enableTooltips=this.options.enableTooltips||!1,this.multiLayer=this.options.multiLayer||!1,this.map.on("style.load",function(){this.tb.zoomLayers=[],this.tb.options.multiLayer&&this.addLayer({id:"threebox_layer",type:"custom",renderingMode:"3d",map:this,onAdd:function(e,t){},render:function(e,t){this.map.tb.update()}})}),this.map.on("load",function(){let t;this.selectedObject,this.selectedFeature,this.draggedObject,this.overedObject,this.overedFeature;let i,s=this.getCanvasContainer();this.getCanvasContainer().style.cursor="default";let r,n,o,a,h=[];function l(e){var t=s.getBoundingClientRect();return{x:e.originalEvent.clientX-t.left-s.clientLeft,y:e.originalEvent.clientY-t.top-s.clientTop}}this.unselectObject=function(e){e.selected=!1,this.selectedObject=null},this.unselectFeature=function(e){void 0!==e.id&&(this.setFeatureState({source:e.source,sourceLayer:e.sourceLayer,id:e.id},{select:!1}),this.removeTooltip(e),(e=this.queryRenderedFeatures({layers:[e.layer.id],filter:["==",["id"],e.id]})[0])&&this.fire("SelectedFeatureChange",{detail:e}),this.selectedFeature=null)},this.selectFeature=function(e){this.selectedFeature=e,this.setFeatureState({source:this.selectedFeature.source,sourceLayer:this.selectedFeature.sourceLayer,id:this.selectedFeature.id},{select:!0}),this.selectedFeature=this.queryRenderedFeatures({layers:[this.selectedFeature.layer.id],filter:["==",["id"],this.selectedFeature.id]})[0],this.addTooltip(this.selectedFeature),this.fire("SelectedFeatureChange",{detail:this.selectedFeature})},this.unoverFeature=function(t){this.overedFeature&&void 0!==this.overedFeature&&this.overedFeature.id!=t&&(e.setFeatureState({source:this.overedFeature.source,sourceLayer:this.overedFeature.sourceLayer,id:this.overedFeature.id},{hover:!1}),this.removeTooltip(this.overedFeature),this.overedFeature=null)},this.addTooltip=function(e){if(!this.tb.enableTooltips)return;let t=this.tb.getFeatureCenter(e),i=this.tb.tooltip({text:e.properties.name||e.id||e.type,mapboxStyle:!0,feature:e});i.setCoords(t),this.tb.add(i,e.layer.id),e.tooltip=i,e.tooltip.tooltip.visible=!0},this.removeTooltip=function(e){e.tooltip&&(e.tooltip.visibility=!1,this.tb.remove(e.tooltip),e.tooltip=null)},e.onContextMenu=function(e){alert("contextMenu")},this.onClick=function(t){let i,s=[];if(e.tb.enableSelectingObjects&&(s=this.tb.queryRenderedFeatures(t.point)),i="object"==typeof s[0]){let e=Threebox.prototype.findParent3DObject(s[0]);if(e){if(this.selectedFeature&&this.unselectFeature(this.selectedFeature),this.selectedObject){if(this.selectedObject.uuid!=e.uuid)this.selectedObject.selected=!1,e.selected=!0,this.selectedObject=e;else if(this.selectedObject.uuid==e.uuid)return void this.unselectObject(this.selectedObject)}else this.selectedObject=e,this.selectedObject.selected=!0;this.selectedObject.dispatchEvent(new CustomEvent("Wireframed",{detail:this.selectedObject,bubbles:!0,cancelable:!0})),this.selectedObject.dispatchEvent(new CustomEvent("IsPlayingChanged",{detail:this.selectedObject,bubbles:!0,cancelable:!0})),this.repaint=!0,t.preventDefault()}}else{let i=[];if(e.tb.enableSelectingFeatures&&(i=this.queryRenderedFeatures(t.point)),i.length>0&&"fill-extrusion"==i[0].layer.type&&void 0!==i[0].id)if(this.selectedObject&&this.unselectObject(this.selectedObject),this.selectedFeature){if(this.selectedFeature.id!=i[0].id)this.unselectFeature(this.selectedFeature),this.selectFeature(i[0]);else if(this.selectedFeature.id==i[0].id)return void this.unselectFeature(this.selectedFeature)}else this.selectFeature(i[0])}},this.onMouseMove=function(s){let h,d=l(s);if(this.getCanvasContainer().style.cursor="default",s.originalEvent.altKey&&this.draggedObject){if(!e.tb.enableRotatingObjects)return;t="rotate",this.getCanvasContainer().style.cursor="move";Math.min(i.x,d.x),Math.max(i.x,d.x),Math.min(i.y,d.y),Math.max(i.y,d.y);let s={x:0,y:0,z:Math.round(a[2]+~~((d.x-i.x)/this.tb.rotationStep)%360*this.tb.rotationStep%360)};return this.draggedObject.setRotation(s),void this.draggedObject.addHelp("rot: "+s.z+"°")}if(s.originalEvent.shiftKey&&this.draggedObject){if(!e.tb.enableDraggingObjects)return;t="translate",this.getCanvasContainer().style.cursor="move";let i=s.lngLat,o=[Number((i.lng+r).toFixed(this.tb.gridStep)),Number((i.lat+n).toFixed(this.tb.gridStep)),this.draggedObject.modelHeight];return this.draggedObject.setCoords(o),void this.draggedObject.addHelp("lng: "+o[0]+"°, lat: "+o[1]+"°")}if(s.originalEvent.ctrlKey&&this.draggedObject){if(!e.tb.enableDraggingObjects)return;t="altitude",this.getCanvasContainer().style.cursor="move";let i=s.point.y*this.tb.altitudeStep,r=[this.draggedObject.coordinates[0],this.draggedObject.coordinates[1],Number((-i-o).toFixed(this.tb.gridStep))];return this.draggedObject.setCoords(r),void this.draggedObject.addHelp("alt: "+r[2]+"m")}let u=[];if(e.tb.enableSelectingObjects&&(u=this.tb.queryRenderedFeatures(s.point)),h="object"==typeof u[0]){let e=Threebox.prototype.findParent3DObject(u[0]);e&&(this.unoverFeature(this.overedFeature),this.getCanvasContainer().style.cursor="pointer",this.selectedObject&&e.uuid==this.selectedObject.uuid||(this.overedObject&&(this.overedObject.over=!1,this.overedObject=null),e.over=!0,this.overedObject=e),this.repaint=!0,s.preventDefault())}else{this.overedObject&&(this.overedObject.over=!1,this.overedObject=null);let t=[];e.tb.enableSelectingFeatures&&(t=this.queryRenderedFeatures(s.point)),t.length>0&&(this.unoverFeature(t[0]),"fill-extrusion"==t[0].layer.type&&void 0!==t[0].id&&(this.selectedFeature&&this.selectedFeature.id==t[0].id||(this.getCanvasContainer().style.cursor="pointer",this.overedFeature=t[0],this.setFeatureState({source:this.overedFeature.source,sourceLayer:this.overedFeature.sourceLayer,id:this.overedFeature.id},{hover:!0}),this.overedFeature=e.queryRenderedFeatures({layers:[this.overedFeature.layer.id],filter:["==",["id"],this.overedFeature.id]})[0],this.addTooltip(this.overedFeature))))}},this.onMouseDown=function(t){(t.originalEvent.shiftKey||t.originalEvent.altKey||t.originalEvent.ctrlKey)&&0===t.originalEvent.button&&this.selectedObject&&(e.tb.enableDraggingObjects||e.tb.enableRotatingObjects)&&(t.preventDefault(),e.getCanvasContainer().style.cursor="move",e.once("mouseup",this.onMouseUp),this.draggedObject=this.selectedObject,i=l(t),h=this.draggedObject.coordinates,a=utils.degreeify(this.draggedObject.rotation),r=h[0]-t.lngLat.lng,n=h[1]-t.lngLat.lat,o=-this.draggedObject.modelHeight-t.point.y*this.tb.altitudeStep)},this.onMouseUp=function(e){this.getCanvasContainer().style.cursor="default",this.off("mouseup",this.onMouseUp),this.off("mouseout",this.onMouseUp),this.dragPan.enable(),this.draggedObject&&(this.draggedObject.dispatchEvent(new CustomEvent("ObjectDragged",{detail:{draggedObject:this.draggedObject,draggedAction:t},bubbles:!0,cancelable:!0})),this.draggedObject.removeHelp(),this.draggedObject=null,t=null)},this.onMouseOut=function(e){if(this.overedFeature){let t=this.queryRenderedFeatures(e.point);t.length>0&&this.overedFeature.id!=t[0].id&&(this.getCanvasContainer().style.cursor="default",this.unoverFeature(t[0]))}},this.onZoomEnd=function(e){this.tb.zoomLayers.forEach(e=>{this.tb.toggleLayer(e)})},this.on("click",this.onClick),this.on("mousemove",this.onMouseMove),this.on("mouseout",this.onMouseOut),this.on("mousedown",this.onMouseDown),this.on("zoom",this.onZoomEnd)})},sphere:function(e){return this.setDefaultView(e,this.options),sphere(e,this.world)},line:line,label:label,tooltip:tooltip,tube:function(e){return this.setDefaultView(e,this.options),tube(e,this.world)},extrusion:function(e){return this.setDefaultView(e,this.options),extrusion(e)},Object3D:function(e){return this.setDefaultView(e,this.options),Object3D(e)},loadObj:async function(e,t){this.setDefaultView(e,this.options);let i=this.objectsCache.get(e.obj);i?i.promise.then(i=>{t(i.duplicate(e))}).catch(t=>{this.objectsCache.delete(e.obj),console.error("Could not load model file: "+e.obj)}):this.objectsCache.set(e.obj,{promise:new Promise(async(i,s)=>{loader(e,t,async e=>{e.duplicate?i(e.duplicate()):s(e)})})})},material:function(e){return material(e)},initLights:{ambientLight:null,dirLight:null,dirLightBack:null,dirLightHelper:null,hemiLight:null,pointLight:null},utils:utils,SunCalc:SunCalc,Constants:ThreeboxConstants,projectToWorld:function(e){return this.utils.projectToWorld(e)},unprojectFromWorld:function(e){return this.utils.unprojectFromWorld(e)},projectedUnitsPerMeter:function(e){return this.utils.projectedUnitsPerMeter(e)},getFeatureCenter:function(e,t,i){return utils.getFeatureCenter(e,t,i)},getObjectHeightOnFloor:function(e,t,i){return utils.getObjectHeightOnFloor(e,t,i)},queryRenderedFeatures:function(e){let t=new THREE.Vector2;return t.x=e.x/this.map.transform.width*2-1,t.y=1-e.y/this.map.transform.height*2,this.raycaster.setFromCamera(t,this.camera),this.raycaster.intersectObjects(this.world.children,!0)},findParent3DObject:function(e){var t;return e.object.traverseAncestors(function(e){e.parent&&"Group"==e.parent.type&&e.userData.obj&&(t=e)}),t},setLayoutProperty:function(e,t,i){this.map.setLayoutProperty(e,t,i),null==i||"visibility"!==t||this.world.children.forEach(function(t){t.layer===e&&(t.visibility=i)})},setLayerZoomRange:function(e,t,i){this.map.getLayer(e)&&(this.map.setLayerZoomRange(e,t,i),this.zoomLayers.includes(e)||this.zoomLayers.push(e),this.toggleLayer(e))},setLayerHeigthProperty:function(e,t){let i=this.map.getLayer(e);if(i)if("fill-extrusion"==i.type){let e=this.map.getStyle().sources[i.source].data;e.features.forEach(function(e){e.properties.level=t}),this.map.getSource(i.source).setData(e)}else"custom"==i.type&&this.world.children.forEach(function(i){let s=i.userData.feature;if(s&&s.layer===e){let e=this.tb.getFeatureCenter(s,i,t);i.setCoords(e)}})},setStyle:function(e,t){this.clear().then(()=>{this.map.setStyle(e,t)})},toggleLayer:function(e,t=!0){let i=this.map.getLayer(e);if(i){if(!t)return void this.toggle(i.id,!1);let e=this.map.getZoom();if(i.minzoom&&e=i.maxzoom)return console.log(">= maxzoom"),void this.toggle(i.id,!1);this.toggle(i.id,!0)}},toggle:function(e,t){this.setLayoutProperty(e,"visibility",t?"visible":"none"),this.labelRenderer.toggleLabels(e,t)},update:function(){this.map.repaint&&(this.map.repaint=!1);var e=Date.now();this.objects.animationManager.update(e),this.updateLightHelper(),this.renderer.state.reset(),this.renderer.render(this.scene,this.camera),this.labelRenderer.render(this.scene,this.camera),!1===this.options.passiveRendering&&this.map.triggerRepaint()},add:function(e,t,i){if(!this.enableTooltips&&e.tooltip&&(e.tooltip.visibility=!1),this.world.add(e),t){e.layer=t,e.source=i;let s=this.map.getLayer(t);if(s){let t=s.visibility,i=void 0===t;e.visibility=!(!i&&"visible"!==t)}}},remove:function(e){e.dispose&&e.dispose(),this.world.remove(e),e=null},clear:async function(e=null,t=!1){return new Promise((i,s)=>{let r=[];this.world.children.forEach(function(e){r.push(e)});for(let t=0;t{e.promise.then(e=>{e.dispose(),e=null})}),i("clear")})},removeLayer:function(e){this.clear(e,!0).then(()=>{this.map.removeLayer(e)})},getSunPosition:function(e,t){return SunCalc.getPosition(e,t[1],t[0])},getSunTimes:function(e,t){return SunCalc.getTimes(e,t[1],t[0],t[2]?t[2]:0)},setBuildingShadows:function(e){if(this.map.getLayer(e.buildingsLayerId)){let t=new BuildingShadows(e,this);this.map.addLayer(t,e.buildingsLayerId)}else console.warn("The layer '"+e.buildingsLayerId+"' does not exist in the map.")},setSunlight:function(e=new Date,t){if(!this.lights.dirLight||!this.options.realSunlight)return void console.warn("To use setSunlight it's required to set realSunlight : true in Threebox initial options.");var i=new Date(e.getTime());if(t?t.lng&&t.lat?this.mapCenter=t:this.mapCenter={lng:t[0],lat:t[1]}:this.mapCenter=this.map.getCenter(),this.lightDateTime&&this.lightDateTime.getTime()===i.getTime()&&this.lightLng===this.mapCenter.lng&&this.lightLat===this.mapCenter.lat)return;this.lightDateTime=i,this.lightLng=this.mapCenter.lng,this.lightLat=this.mapCenter.lat,this.sunPosition=this.getSunPosition(i,[this.mapCenter.lng,this.mapCenter.lat]);let s=this.sunPosition.altitude,r=Math.PI+this.sunPosition.azimuth,n=ThreeboxConstants.WORLD_SIZE/2,o=Math.sin(s),a=Math.cos(s),h=Math.cos(r)*a,l=Math.sin(r)*a;this.lights.dirLight.position.set(l,h,o),this.lights.dirLight.position.multiplyScalar(n),this.lights.dirLight.intensity=Math.max(o,-.15),this.lights.dirLight.updateMatrixWorld(),this.updateLightHelper(),this.map.loaded()&&this.map.setLight({anchor:"map",position:[1.5,180+180*this.sunPosition.azimuth/Math.PI,90-180*this.sunPosition.altitude/Math.PI],"position-transition":{duration:0},color:`hsl(40, ${50*Math.cos(this.sunPosition.altitude)}%, ${96*Math.sin(this.sunPosition.altitude)}%)`},{duration:0})},updateLightHelper:function(){this.lights.dirLightHelper&&(this.lights.dirLightHelper.position.setFromMatrixPosition(this.lights.dirLight.matrixWorld),this.lights.dirLightHelper.updateMatrix(),this.lights.dirLightHelper.update())},dispose:async function(){return console.log(this.memory()),new Promise(e=>{e(this.clear(null,!0).then(e=>(this.map.remove(),this.map={},this.scene.remove(this.world),this.scene.dispose(),this.world.children=[],this.world=null,this.objectsCache.clear(),this.labelRenderer.dispose(),console.log(this.memory()),this.renderer.dispose(),e)))})},defaultLights:function(){this.lights.ambientLight=new THREE.AmbientLight(new THREE.Color("hsl(0, 0%, 100%)"),.75),this.scene.add(this.lights.ambientLight),this.lights.dirLightBack=new THREE.DirectionalLight(new THREE.Color("hsl(0, 0%, 100%)"),.25),this.lights.dirLightBack.position.set(30,100,100),this.scene.add(this.lights.dirLightBack),this.lights.dirLight=new THREE.DirectionalLight(new THREE.Color("hsl(0, 0%, 100%)"),.25),this.lights.dirLight.position.set(-30,100,-100),this.scene.add(this.lights.dirLight)},realSunlight:function(e=!1){this.renderer.shadowMap.enabled=!0,this.lights.dirLight=new THREE.DirectionalLight(16777215,1),this.scene.add(this.lights.dirLight),e&&(this.lights.dirLightHelper=new THREE.DirectionalLightHelper(this.lights.dirLight,5),this.scene.add(this.lights.dirLightHelper));this.lights.dirLight.castShadow=!0,this.lights.dirLight.shadow.radius=2,this.lights.dirLight.shadow.mapSize.width=8192,this.lights.dirLight.shadow.mapSize.height=8192,this.lights.dirLight.shadow.camera.top=this.lights.dirLight.shadow.camera.right=1e3,this.lights.dirLight.shadow.camera.bottom=this.lights.dirLight.shadow.camera.left=-1e3,this.lights.dirLight.shadow.camera.near=1,this.lights.dirLight.shadow.camera.visible=!0,this.lights.dirLight.shadow.camera.far=4e8,this.lights.hemiLight=new THREE.HemisphereLight(new THREE.Color(16777215),new THREE.Color(16777215),.6),this.lights.hemiLight.color.setHSL(.661,.96,.12),this.lights.hemiLight.groundColor.setHSL(.11,.96,.14),this.lights.hemiLight.position.set(0,0,50),this.scene.add(this.lights.hemiLight),this.setSunlight()},setDefaultView:function(e,t){e.bbox=e.bbox||t.enableSelectingObjects,e.tooltip=e.tooltip||t.enableTooltips},memory:function(){return this.renderer.info.memory},programs:function(){return this.renderer.info.programs.length},version:"2.1.2"};var defaultOptions={defaultLights:!1,realSunlight:!1,realSunlightHelper:!1,passiveRendering:!0,enableSelectingFeatures:!1,enableSelectingObjects:!1,enableDraggingObjects:!1,enableRotatingObjects:!1,enableTooltips:!1,multiLayer:!1};module.exports=exports=Threebox; +const THREE=require("./three.js"),CameraSync=require("./camera/CameraSync.js"),utils=require("./utils/utils.js"),SunCalc=require("./utils/suncalc.js"),ThreeboxConstants=require("./utils/constants.js"),Objects=require("./objects/objects.js"),material=require("./utils/material.js"),sphere=require("./objects/sphere.js"),extrusion=require("./objects/extrusion.js"),label=require("./objects/label.js"),tooltip=require("./objects/tooltip.js"),loader=require("./objects/loadObj.js"),Object3D=require("./objects/Object3D.js"),line=require("./objects/line.js"),tube=require("./objects/tube.js"),LabelRenderer=require("./objects/LabelRenderer.js"),BuildingShadows=require("./objects/effects/BuildingShadows.js");function Threebox(e,t,i){this.init(e,t,i)}Threebox.prototype={repaint:function(){this.map.repaint=!0},init:function(e,t,i){this.options=utils._validate(i||{},defaultOptions),this.map=e,this.map.tb=this,this.objects=new Objects,this.renderer=new THREE.WebGLRenderer({alpha:!0,antialias:!0,canvas:e.getCanvas(),context:t}),this.renderer.setPixelRatio(window.devicePixelRatio),this.renderer.setSize(this.map.getCanvas().clientWidth,this.map.getCanvas().clientHeight),this.renderer.outputEncoding=THREE.sRGBEncoding,this.renderer.autoClear=!1,this.labelRenderer=new LabelRenderer(this.map),this.scene=new THREE.Scene,this.camera=new THREE.PerspectiveCamera(ThreeboxConstants.FOV_DEGREES,this.map.getCanvas().clientWidth/this.map.getCanvas().clientHeight,1,1e21),this.camera.layers.enable(0),this.camera.layers.enable(1),this.world=new THREE.Group,this.world.name="world",this.scene.add(this.world),this.objectsCache=new Map,this.zoomLayers=[],this.cameraSync=new CameraSync(this.map,this.camera,this.world),this.raycaster=new THREE.Raycaster,this.raycaster.layers.set(0),this.mapCenter=this.map.getCenter(),this.mapCenterUnits=utils.projectToWorld([this.mapCenter.lng,this.mapCenter.lat]),this.lightDateTime=new Date,this.lightLng=this.mapCenter.lng,this.lightLat=this.mapCenter.lat,this.sunPosition,this.rotationStep=5,this.gridStep=6,this.altitudeStep=.1,this.lights=this.initLights,this.options.defaultLights&&this.defaultLights(),this.options.realSunlight&&this.realSunlight(this.options.realSunlightHelper),this.enableSelectingFeatures=this.options.enableSelectingFeatures||!1,this.enableSelectingObjects=this.options.enableSelectingObjects||!1,this.enableDraggingObjects=this.options.enableDraggingObjects||!1,this.enableRotatingObjects=this.options.enableRotatingObjects||!1,this.enableTooltips=this.options.enableTooltips||!1,this.multiLayer=this.options.multiLayer||!1,this.map.on("style.load",function(){this.tb.zoomLayers=[],this.tb.options.multiLayer&&this.addLayer({id:"threebox_layer",type:"custom",renderingMode:"3d",map:this,onAdd:function(e,t){},render:function(e,t){this.map.tb.update()}})}),this.map.on("load",function(){let t;this.selectedObject,this.selectedFeature,this.draggedObject,this.overedObject,this.overedFeature;let i,s=this.getCanvasContainer();this.getCanvasContainer().style.cursor="default";let r,n,o,a,h=[];function l(e){var t=s.getBoundingClientRect();return{x:e.originalEvent.clientX-t.left-s.clientLeft,y:e.originalEvent.clientY-t.top-s.clientTop}}this.unselectObject=function(e){e.selected=!1,this.selectedObject=null},this.unselectFeature=function(e){void 0!==e.id&&(this.setFeatureState({source:e.source,sourceLayer:e.sourceLayer,id:e.id},{select:!1}),this.removeTooltip(e),(e=this.queryRenderedFeatures({layers:[e.layer.id],filter:["==",["id"],e.id]})[0])&&this.fire("SelectedFeatureChange",{detail:e}),this.selectedFeature=null)},this.selectFeature=function(e){this.selectedFeature=e,this.setFeatureState({source:this.selectedFeature.source,sourceLayer:this.selectedFeature.sourceLayer,id:this.selectedFeature.id},{select:!0}),this.selectedFeature=this.queryRenderedFeatures({layers:[this.selectedFeature.layer.id],filter:["==",["id"],this.selectedFeature.id]})[0],this.addTooltip(this.selectedFeature),this.fire("SelectedFeatureChange",{detail:this.selectedFeature})},this.unoverFeature=function(t){this.overedFeature&&void 0!==this.overedFeature&&this.overedFeature.id!=t&&(e.setFeatureState({source:this.overedFeature.source,sourceLayer:this.overedFeature.sourceLayer,id:this.overedFeature.id},{hover:!1}),this.removeTooltip(this.overedFeature),this.overedFeature=null)},this.addTooltip=function(e){if(!this.tb.enableTooltips)return;let t=this.tb.getFeatureCenter(e),i=this.tb.tooltip({text:e.properties.name||e.id||e.type,mapboxStyle:!0,feature:e});i.setCoords(t),this.tb.add(i,e.layer.id),e.tooltip=i,e.tooltip.tooltip.visible=!0},this.removeTooltip=function(e){e.tooltip&&(e.tooltip.visibility=!1,this.tb.remove(e.tooltip),e.tooltip=null)},e.onContextMenu=function(e){alert("contextMenu")},this.onClick=function(t){let i,s=[];if(e.tb.enableSelectingObjects&&(s=this.tb.queryRenderedFeatures(t.point)),i="object"==typeof s[0]){let e=Threebox.prototype.findParent3DObject(s[0]);if(e){if(this.selectedFeature&&this.unselectFeature(this.selectedFeature),this.selectedObject){if(this.selectedObject.uuid!=e.uuid)this.selectedObject.selected=!1,e.selected=!0,this.selectedObject=e;else if(this.selectedObject.uuid==e.uuid)return void this.unselectObject(this.selectedObject)}else this.selectedObject=e,this.selectedObject.selected=!0;this.selectedObject.dispatchEvent(new CustomEvent("Wireframed",{detail:this.selectedObject,bubbles:!0,cancelable:!0})),this.selectedObject.dispatchEvent(new CustomEvent("IsPlayingChanged",{detail:this.selectedObject,bubbles:!0,cancelable:!0})),this.repaint=!0,t.preventDefault()}}else{let i=[];if(e.tb.enableSelectingFeatures&&(i=this.queryRenderedFeatures(t.point)),i.length>0&&"fill-extrusion"==i[0].layer.type&&void 0!==i[0].id)if(this.selectedObject&&this.unselectObject(this.selectedObject),this.selectedFeature){if(this.selectedFeature.id!=i[0].id)this.unselectFeature(this.selectedFeature),this.selectFeature(i[0]);else if(this.selectedFeature.id==i[0].id)return void this.unselectFeature(this.selectedFeature)}else this.selectFeature(i[0])}},this.onMouseMove=function(s){let h,d=l(s);if(this.getCanvasContainer().style.cursor="default",s.originalEvent.altKey&&this.draggedObject){if(!e.tb.enableRotatingObjects)return;t="rotate",this.getCanvasContainer().style.cursor="move";Math.min(i.x,d.x),Math.max(i.x,d.x),Math.min(i.y,d.y),Math.max(i.y,d.y);let s={x:0,y:0,z:Math.round(a[2]+~~((d.x-i.x)/this.tb.rotationStep)%360*this.tb.rotationStep%360)};return this.draggedObject.setRotation(s),void this.draggedObject.addHelp("rot: "+s.z+"°")}if(s.originalEvent.shiftKey&&this.draggedObject){if(!e.tb.enableDraggingObjects)return;t="translate",this.getCanvasContainer().style.cursor="move";let i=s.lngLat,o=[Number((i.lng+r).toFixed(this.tb.gridStep)),Number((i.lat+n).toFixed(this.tb.gridStep)),this.draggedObject.modelHeight];return this.draggedObject.setCoords(o),void this.draggedObject.addHelp("lng: "+o[0]+"°, lat: "+o[1]+"°")}if(s.originalEvent.ctrlKey&&this.draggedObject){if(!e.tb.enableDraggingObjects)return;t="altitude",this.getCanvasContainer().style.cursor="move";let i=s.point.y*this.tb.altitudeStep,r=[this.draggedObject.coordinates[0],this.draggedObject.coordinates[1],Number((-i-o).toFixed(this.tb.gridStep))];return this.draggedObject.setCoords(r),void this.draggedObject.addHelp("alt: "+r[2]+"m")}let u=[];if(e.tb.enableSelectingObjects&&(u=this.tb.queryRenderedFeatures(s.point)),h="object"==typeof u[0]){let e=Threebox.prototype.findParent3DObject(u[0]);e&&(this.unoverFeature(this.overedFeature),this.getCanvasContainer().style.cursor="pointer",this.selectedObject&&e.uuid==this.selectedObject.uuid||(this.overedObject&&(this.overedObject.over=!1,this.overedObject=null),e.over=!0,this.overedObject=e),this.repaint=!0,s.preventDefault())}else{this.overedObject&&(this.overedObject.over=!1,this.overedObject=null);let t=[];e.tb.enableSelectingFeatures&&(t=this.queryRenderedFeatures(s.point)),t.length>0&&(this.unoverFeature(t[0]),"fill-extrusion"==t[0].layer.type&&void 0!==t[0].id&&(this.selectedFeature&&this.selectedFeature.id==t[0].id||(this.getCanvasContainer().style.cursor="pointer",this.overedFeature=t[0],this.setFeatureState({source:this.overedFeature.source,sourceLayer:this.overedFeature.sourceLayer,id:this.overedFeature.id},{hover:!0}),this.overedFeature=e.queryRenderedFeatures({layers:[this.overedFeature.layer.id],filter:["==",["id"],this.overedFeature.id]})[0],this.addTooltip(this.overedFeature))))}},this.onMouseDown=function(t){(t.originalEvent.shiftKey||t.originalEvent.altKey||t.originalEvent.ctrlKey)&&0===t.originalEvent.button&&this.selectedObject&&(e.tb.enableDraggingObjects||e.tb.enableRotatingObjects)&&(t.preventDefault(),e.getCanvasContainer().style.cursor="move",e.once("mouseup",this.onMouseUp),this.draggedObject=this.selectedObject,i=l(t),h=this.draggedObject.coordinates,a=utils.degreeify(this.draggedObject.rotation),r=h[0]-t.lngLat.lng,n=h[1]-t.lngLat.lat,o=-this.draggedObject.modelHeight-t.point.y*this.tb.altitudeStep)},this.onMouseUp=function(e){this.getCanvasContainer().style.cursor="default",this.off("mouseup",this.onMouseUp),this.off("mouseout",this.onMouseUp),this.dragPan.enable(),this.draggedObject&&(this.draggedObject.dispatchEvent(new CustomEvent("ObjectDragged",{detail:{draggedObject:this.draggedObject,draggedAction:t},bubbles:!0,cancelable:!0})),this.draggedObject.removeHelp(),this.draggedObject=null,t=null)},this.onMouseOut=function(e){if(this.overedFeature){let t=this.queryRenderedFeatures(e.point);t.length>0&&this.overedFeature.id!=t[0].id&&(this.getCanvasContainer().style.cursor="default",this.unoverFeature(t[0]))}},this.onZoomEnd=function(e){this.tb.zoomLayers.forEach(e=>{this.tb.toggleLayer(e)})},this.on("click",this.onClick),this.on("mousemove",this.onMouseMove),this.on("mouseout",this.onMouseOut),this.on("mousedown",this.onMouseDown),this.on("zoom",this.onZoomEnd)})},sphere:function(e){return this.setDefaultView(e,this.options),sphere(e,this.world)},line:line,label:label,tooltip:tooltip,tube:function(e){return this.setDefaultView(e,this.options),tube(e,this.world)},extrusion:function(e){return this.setDefaultView(e,this.options),extrusion(e)},Object3D:function(e){return this.setDefaultView(e,this.options),Object3D(e)},loadObj:async function(e,t){this.setDefaultView(e,this.options);let i=this.objectsCache.get(e.obj);i?i.promise.then(i=>{t(i.duplicate(e))}).catch(t=>{this.objectsCache.delete(e.obj),console.error("Could not load model file: "+e.obj)}):this.objectsCache.set(e.obj,{promise:new Promise(async(i,s)=>{loader(e,t,async e=>{e.duplicate?i(e.duplicate()):s(e)})})})},material:function(e){return material(e)},initLights:{ambientLight:null,dirLight:null,dirLightBack:null,dirLightHelper:null,hemiLight:null,pointLight:null},utils:utils,SunCalc:SunCalc,Constants:ThreeboxConstants,projectToWorld:function(e){return this.utils.projectToWorld(e)},unprojectFromWorld:function(e){return this.utils.unprojectFromWorld(e)},projectedUnitsPerMeter:function(e){return this.utils.projectedUnitsPerMeter(e)},getFeatureCenter:function(e,t,i){return utils.getFeatureCenter(e,t,i)},getObjectHeightOnFloor:function(e,t,i){return utils.getObjectHeightOnFloor(e,t,i)},queryRenderedFeatures:function(e){let t=new THREE.Vector2;return t.x=e.x/this.map.transform.width*2-1,t.y=1-e.y/this.map.transform.height*2,this.raycaster.setFromCamera(t,this.camera),this.raycaster.intersectObjects(this.world.children,!0)},findParent3DObject:function(e){var t;return e.object.traverseAncestors(function(e){e.parent&&"Group"==e.parent.type&&e.userData.obj&&(t=e)}),t},setLayoutProperty:function(e,t,i){this.map.setLayoutProperty(e,t,i),null==i||"visibility"!==t||this.world.children.forEach(function(t){t.layer===e&&(t.visibility=i)})},setLayerZoomRange:function(e,t,i){this.map.getLayer(e)&&(this.map.setLayerZoomRange(e,t,i),this.zoomLayers.includes(e)||this.zoomLayers.push(e),this.toggleLayer(e))},setLayerHeigthProperty:function(e,t){let i=this.map.getLayer(e);if(i)if("fill-extrusion"==i.type){let e=this.map.getStyle().sources[i.source].data;e.features.forEach(function(e){e.properties.level=t}),this.map.getSource(i.source).setData(e)}else"custom"==i.type&&this.world.children.forEach(function(i){let s=i.userData.feature;if(s&&s.layer===e){let e=this.tb.getFeatureCenter(s,i,t);i.setCoords(e)}})},setStyle:function(e,t){this.clear().then(()=>{this.map.setStyle(e,t)})},toggleLayer:function(e,t=!0){let i=this.map.getLayer(e);if(i){if(!t)return void this.toggle(i.id,!1);let e=this.map.getZoom();if(i.minzoom&&e=i.maxzoom)return void this.toggle(i.id,!1);this.toggle(i.id,!0)}},toggle:function(e,t){this.setLayoutProperty(e,"visibility",t?"visible":"none"),this.labelRenderer.toggleLabels(e,t)},update:function(){this.map.repaint&&(this.map.repaint=!1);var e=Date.now();this.objects.animationManager.update(e),this.updateLightHelper(),this.renderer.state.reset(),this.renderer.render(this.scene,this.camera),this.labelRenderer.render(this.scene,this.camera),!1===this.options.passiveRendering&&this.map.triggerRepaint()},add:function(e,t,i){if(!this.enableTooltips&&e.tooltip&&(e.tooltip.visibility=!1),this.world.add(e),t){e.layer=t,e.source=i;let s=this.map.getLayer(t);if(s){let t=s.visibility,i=void 0===t;e.visibility=!(!i&&"visible"!==t)}}},remove:function(e){e.dispose&&e.dispose(),this.world.remove(e),e=null},clear:async function(e=null,t=!1){return new Promise((i,s)=>{let r=[];this.world.children.forEach(function(e){r.push(e)});for(let t=0;t{e.promise.then(e=>{e.dispose(),e=null})}),i("clear")})},removeLayer:function(e){this.clear(e,!0).then(()=>{this.map.removeLayer(e)})},getSunPosition:function(e,t){return SunCalc.getPosition(e,t[1],t[0])},getSunTimes:function(e,t){return SunCalc.getTimes(e,t[1],t[0],t[2]?t[2]:0)},setBuildingShadows:function(e){if(this.map.getLayer(e.buildingsLayerId)){let t=new BuildingShadows(e,this);this.map.addLayer(t,e.buildingsLayerId)}else console.warn("The layer '"+e.buildingsLayerId+"' does not exist in the map.")},setSunlight:function(e=new Date,t){if(!this.lights.dirLight||!this.options.realSunlight)return void console.warn("To use setSunlight it's required to set realSunlight : true in Threebox initial options.");var i=new Date(e.getTime());if(t?t.lng&&t.lat?this.mapCenter=t:this.mapCenter={lng:t[0],lat:t[1]}:this.mapCenter=this.map.getCenter(),this.lightDateTime&&this.lightDateTime.getTime()===i.getTime()&&this.lightLng===this.mapCenter.lng&&this.lightLat===this.mapCenter.lat)return;this.lightDateTime=i,this.lightLng=this.mapCenter.lng,this.lightLat=this.mapCenter.lat,this.sunPosition=this.getSunPosition(i,[this.mapCenter.lng,this.mapCenter.lat]);let s=this.sunPosition.altitude,r=Math.PI+this.sunPosition.azimuth,n=ThreeboxConstants.WORLD_SIZE/2,o=Math.sin(s),a=Math.cos(s),h=Math.cos(r)*a,l=Math.sin(r)*a;this.lights.dirLight.position.set(l,h,o),this.lights.dirLight.position.multiplyScalar(n),this.lights.dirLight.intensity=Math.max(o,-.15),this.lights.dirLight.updateMatrixWorld(),this.updateLightHelper(),this.map.loaded()&&this.map.setLight({anchor:"map",position:[1.5,180+180*this.sunPosition.azimuth/Math.PI,90-180*this.sunPosition.altitude/Math.PI],"position-transition":{duration:0},color:`hsl(40, ${50*Math.cos(this.sunPosition.altitude)}%, ${96*Math.sin(this.sunPosition.altitude)}%)`},{duration:0})},updateLightHelper:function(){this.lights.dirLightHelper&&(this.lights.dirLightHelper.position.setFromMatrixPosition(this.lights.dirLight.matrixWorld),this.lights.dirLightHelper.updateMatrix(),this.lights.dirLightHelper.update())},dispose:async function(){return console.log(this.memory()),new Promise(e=>{e(this.clear(null,!0).then(e=>(this.map.remove(),this.map={},this.scene.remove(this.world),this.scene.dispose(),this.world.children=[],this.world=null,this.objectsCache.clear(),this.labelRenderer.dispose(),console.log(this.memory()),this.renderer.dispose(),e)))})},defaultLights:function(){this.lights.ambientLight=new THREE.AmbientLight(new THREE.Color("hsl(0, 0%, 100%)"),.75),this.scene.add(this.lights.ambientLight),this.lights.dirLightBack=new THREE.DirectionalLight(new THREE.Color("hsl(0, 0%, 100%)"),.25),this.lights.dirLightBack.position.set(30,100,100),this.scene.add(this.lights.dirLightBack),this.lights.dirLight=new THREE.DirectionalLight(new THREE.Color("hsl(0, 0%, 100%)"),.25),this.lights.dirLight.position.set(-30,100,-100),this.scene.add(this.lights.dirLight)},realSunlight:function(e=!1){this.renderer.shadowMap.enabled=!0,this.lights.dirLight=new THREE.DirectionalLight(16777215,1),this.scene.add(this.lights.dirLight),e&&(this.lights.dirLightHelper=new THREE.DirectionalLightHelper(this.lights.dirLight,5),this.scene.add(this.lights.dirLightHelper));this.lights.dirLight.castShadow=!0,this.lights.dirLight.shadow.radius=2,this.lights.dirLight.shadow.mapSize.width=8192,this.lights.dirLight.shadow.mapSize.height=8192,this.lights.dirLight.shadow.camera.top=this.lights.dirLight.shadow.camera.right=1e3,this.lights.dirLight.shadow.camera.bottom=this.lights.dirLight.shadow.camera.left=-1e3,this.lights.dirLight.shadow.camera.near=1,this.lights.dirLight.shadow.camera.visible=!0,this.lights.dirLight.shadow.camera.far=4e8,this.lights.hemiLight=new THREE.HemisphereLight(new THREE.Color(16777215),new THREE.Color(16777215),.6),this.lights.hemiLight.color.setHSL(.661,.96,.12),this.lights.hemiLight.groundColor.setHSL(.11,.96,.14),this.lights.hemiLight.position.set(0,0,50),this.scene.add(this.lights.hemiLight),this.setSunlight()},setDefaultView:function(e,t){e.bbox=e.bbox||t.enableSelectingObjects,e.tooltip=e.tooltip||t.enableTooltips},memory:function(){return this.renderer.info.memory},programs:function(){return this.renderer.info.programs.length},version:"2.1.2"};var defaultOptions={defaultLights:!1,realSunlight:!1,realSunlightHelper:!1,passiveRendering:!0,enableSelectingFeatures:!1,enableSelectingObjects:!1,enableDraggingObjects:!1,enableRotatingObjects:!1,enableTooltips:!1,multiLayer:!1};module.exports=exports=Threebox; },{"./camera/CameraSync.js":4,"./objects/LabelRenderer.js":6,"./objects/Object3D.js":7,"./objects/effects/BuildingShadows.js":9,"./objects/extrusion.js":10,"./objects/label.js":11,"./objects/line.js":12,"./objects/loadObj.js":13,"./objects/objects.js":19,"./objects/sphere.js":20,"./objects/tooltip.js":21,"./objects/tube.js":22,"./three.js":23,"./utils/constants.js":24,"./utils/material.js":25,"./utils/suncalc.js":26,"./utils/utils.js":27}],3:[function(require,module,exports){ const THREE=require("../three.js"),utils=require("../utils/utils.js");function AnimationManager(t){this.map=t,this.enrolledObjects=[],this.previousFrameTime}AnimationManager.prototype={unenroll:function(t){this.enrolledObjects.splice(this.enrolledObjects.indexOf(t),1)},enroll:function(t){if(t.clock=new THREE.Clock,t.hasDefaultAnimation=!1,t.defaultAction,t.actions=[],t.mixer,t.animations&&t.animations.length>0){t.hasDefaultAnimation=!0;let i=t.userData.defaultAnimation?t.userData.defaultAnimation:0;t.mixer=new THREE.AnimationMixer(t),e(i)}function e(e){for(let i=0;it.animations.length&&console.log("The animation index "+e+" doesn't exist for this object");let a=t.animations[i],n=t.mixer.clipAction(a);t.actions.push(n),e===i?(t.defaultAction=n,n.setEffectiveWeight(1)):n.setEffectiveWeight(0),n.play()}}let i=!1;Object.defineProperty(t,"isPlaying",{get:()=>i,set(e){i!=e&&(i=e,t.dispatchEvent(new CustomEvent("IsPlayingChanged",{detail:t,bubbles:!0,cancelable:!0})))}}),this.enrolledObjects.push(t),t.animationQueue=[],t.set=function(e){if(e.duration>0){let i={start:Date.now(),expiration:Date.now()+e.duration,endState:{}};utils.extend(e,i);let a=e.coords,n=e.rotation,o=e.scale||e.scaleX||e.scaleY||e.scaleZ;if(n){let i=t.rotation;e.startRotation=[i.x,i.y,i.z],e.endState.rotation=utils.types.rotation(e.rotation,e.startRotation),e.rotationPerMs=e.endState.rotation.map(function(t,i){return(t-e.startRotation[i])/e.duration})}if(o){let i=t.scale;e.startScale=[i.x,i.y,i.z],e.endState.scale=utils.types.scale(e.scale,e.startScale),e.scalePerMs=e.endState.scale.map(function(t,i){return(t-e.startScale[i])/e.duration})}a&&(e.pathCurve=new THREE.CatmullRomCurve3(utils.lnglatsToWorld([t.coordinates,e.coords])));let s={type:"set",parameters:e};this.animationQueue.push(s),tb.map.repaint=!0}else this.stop(),e.rotation=utils.radify(e.rotation),this._setObject(e);return this},t.animationMethod=null,t.stop=function(e){return t.mixer&&(t.isPlaying=!1,cancelAnimationFrame(t.animationMethod)),this.animationQueue=[],this},t.followPath=function(t,e){let i={type:"followPath",parameters:utils._validate(t,defaults.followPath)};return utils.extend(i.parameters,{pathCurve:new THREE.CatmullRomCurve3(utils.lnglatsToWorld(t.path)),start:Date.now(),expiration:Date.now()+i.parameters.duration,cb:e}),this.animationQueue.push(i),tb.map.repaint=!0,this},t._setObject=function(t){let e=t.position,i=t.rotation,a=t.scale,n=t.worldCoordinates,o=t.quaternion,s=t.translate;if(e){this.coordinates=e;let t=utils.projectToWorld(e);this.position.copy(t)}if(s){this.coordinates=[this.coordinates[0]+s[0],this.coordinates[1]+s[1],this.coordinates[2]+s[2]];let t=utils.projectToWorld(s);this.translateX(t.x),this.translateY(t.y),this.translateZ(t.z)}i&&this.rotation.set(i[0],i[1],i[2]),a&&this.scale.set(a[0],a[1],a[2]),o&&this.quaternion.setFromAxisAngle(o[0],o[1]),n&&this.position.copy(n),this.updateMatrixWorld(),tb.map.repaint=!0},t.playDefault=function(e){if(t.mixer&&t.hasDefaultAnimation){let i={start:Date.now(),expiration:Date.now()+e.duration,endState:{}};utils.extend(e,i),t.mixer.timeScale=e.speed||1;let a={type:"playDefault",parameters:e};return this.animationQueue.push(a),tb.map.repaint=!0,this}},t.playAnimation=function(i){t.mixer&&(i.animation&&e(i.animation),t.playDefault(i))},t.pauseAllActions=function(){t.mixer&&t.actions.forEach(function(t){t.paused=!0})},t.unPauseAllActions=function(){t.mixer&&t.actions.forEach(function(t){t.paused=!1})},t.deactivateAllActions=function(){t.mixer&&t.actions.forEach(function(t){t.stop()})},t.activateAllActions=function(){t.mixer&&t.actions.forEach(function(t){t.play()})},t.idle=function(){return t.mixer&&t.mixer.update(.01),tb.map.repaint=!0,this}},update:function(t){void 0===this.previousFrameTime&&(this.previousFrameTime=t);if(!this.enrolledObjects)return!1;for(let e=this.enrolledObjects.length-1;e>=0;e--){let i=this.enrolledObjects[e];if(i.animationQueue&&0!==i.animationQueue.length)for(let e=i.animationQueue.length-1;e>=0;e--){let a=i.animationQueue[e];if(!a)continue;let n=a.parameters;if(!n.expiration)return i.animationQueue.splice(e,1),void(i.animationQueue[e]&&(i.animationQueue[e].parameters.start=t));if(t>=n.expiration)n.expiration=!1,"playDefault"===a.type?i.stop():(n.endState&&i._setObject(n.endState),void 0!==n.cb&&n.cb());else{let e=(t-n.start)/n.duration;if("set"===a.type){let t={};n.pathCurve&&(t.worldCoordinates=n.pathCurve.getPoint(e)),n.rotationPerMs&&(t.rotation=n.startRotation.map(function(t,i){return t+n.rotationPerMs[i]*e*n.duration})),n.scalePerMs&&(t.scale=n.startScale.map(function(t,i){return t+n.scalePerMs[i]*e*n.duration})),i._setObject(t)}if("followPath"===a.type){let t=n.pathCurve.getPointAt(e);if(objectState={worldCoordinates:t},n.trackHeading){let t=n.pathCurve.getTangentAt(e).normalize(),i=new THREE.Vector3(0,0,0),a=new THREE.Vector3(0,1,0);i.crossVectors(a,t).normalize();let o=Math.acos(a.dot(t));objectState.quaternion=[i,o]}i._setObject(objectState)}"playDefault"===a.type&&(i.activateAllActions(),i.isPlaying=!0,i.animationMethod=requestAnimationFrame(this.update),i.mixer.update(i.clock.getDelta()),tb.map.repaint=!0)}}}this.previousFrameTime=t}};const defaults={followPath:{path:null,duration:1e3,trackHeading:!0}};module.exports=exports=AnimationManager; @@ -74,7 +74,7 @@ const WORLD_SIZE=1024e3,MERCATOR_A=6378137,FOV=Math.atan(.75);module.exports=exp var utils=require("../utils/utils.js"),THREE=require("../three.js"),defaults={material:"MeshBasicMaterial",color:"black",opacity:1};function material(a){var t;function r(){return new THREE[defaults.material]({color:defaults.color})}return a?(t=(a=utils._validate(a,defaults)).material&&a.material.isMaterial?a.material:a.material||a.color||a.opacity?new THREE[a.material]({color:a.color,transparent:a.opacity<1}):r()).opacity=a.opacity:t=r(),t}module.exports=exports=material; },{"../three.js":23,"../utils/utils.js":27}],26:[function(require,module,exports){ -!function(){"use strict";var n=Math.PI,t=Math.sin,e=Math.cos,r=Math.tan,a=Math.asin,u=Math.atan2,o=Math.acos,i=n/180,c=864e5,s=2440588,d=2451545;function f(n){return new Date((n+.5-s)*c)}function h(n){return function(n){return n.valueOf()/c-.5+s}(n)-d}var l=23.4397*i;function M(n,a){return u(t(n)*e(l)-r(a)*t(l),e(n))}function g(n,r){return a(t(r)*e(l)+e(r)*t(l)*t(n))}function v(n,a,o){return u(t(n),e(n)*t(a)-r(o)*e(a))}function w(n,r,u){return a(t(r)*t(u)+e(r)*e(u)*e(n))}function m(n,t){return i*(280.16+360.9856235*n)-t}function D(n){return i*(357.5291+.98560028*n)}function P(e){return e+i*(1.9148*t(e)+.02*t(2*e)+3e-4*t(3*e))+102.9372*i+n}function p(n){var t=P(D(n));return{dec:g(t,0),ra:M(t,0)}}var H={getPosition:function(n,t,e){var r=i*-e,a=i*t,u=h(n),o=p(u),c=m(u,r)-o.ra;return{azimuth:v(c,a,o.dec),altitude:w(c,a,o.dec)}}},T=H.times=[[-.833,"sunrise","sunset"],[-.3,"sunriseEnd","sunsetStart"],[-6,"dawn","dusk"],[-12,"nauticalDawn","nauticalDusk"],[-18,"nightEnd","night"],[6,"goldenHourEnd","goldenHour"]];H.addTime=function(n,t,e){T.push([n,t,e])};var b=9e-4;function E(t,e,r){return b+(t+e)/(2*n)+r}function I(n,e,r){return d+n+.0053*t(e)-.0069*t(2*r)}function k(n,r,a,u,i,c,s){return I(E(function(n,r,a){return o((t(n)-t(r)*t(a))/(e(r)*e(a)))}(n,a,u),r,i),c,s)}function q(n){var r=i*(134.963+13.064993*n),a=i*(93.272+13.22935*n),u=i*(218.316+13.176396*n)+6.289*i*t(r),o=5.128*i*t(a),c=385001-20905*e(r);return{ra:M(u,o),dec:g(u,o),dist:c}}function x(n,t){return new Date(n.valueOf()+t*c/24)}H.getTimes=function(t,e,r,a){var u,o,c,s,d,l=i*-r,M=i*e,v=function(n){return-2.076*Math.sqrt(n)/60}(a=a||0),w=function(t,e){return Math.round(t-b-e/(2*n))}(h(t),l),m=E(0,l,w),p=D(m),H=P(p),q=g(H,0),x=I(m,p,H),y={solarNoon:f(x),nadir:f(x-.5)};for(u=0,o=T.length;u=0&&(v=h-(m=Math.sqrt(M)/(2*Math.abs(d))),w=h+m,Math.abs(v)<=1&&g++,Math.abs(w)<=1&&g++,v<-1&&(v=w)),1===g?P<0?c=p+v:s=p+v:2===g&&(c=p+(l<0?w:v),s=p+(l<0?v:w)),!c||!s);p+=2)P=o;var T={};return c&&(T.rise=x(a,c)),s&&(T.set=x(a,s)),c||s||(T[l>0?"alwaysUp":"alwaysDown"]=!0),T},module.exports=exports=H}(); +!function(){"use strict";var n=Math.PI,t=Math.sin,e=Math.cos,r=Math.tan,a=Math.asin,u=Math.atan2,o=Math.acos,i=n/180,c=864e5,s=2440588,d=2451545;function f(n){return n.valueOf()/c-.5+s}function l(n){return new Date((n+.5-s)*c)}function h(n){return f(n)-d}T.toJulian=function(n){return f(n)};var M=23.4397*i;function g(n,a){return u(t(n)*e(M)-r(a)*t(M),e(n))}function v(n,r){return a(t(r)*e(M)+e(r)*t(M)*t(n))}function w(n,a,o){return u(t(n),e(n)*t(a)-r(o)*e(a))}function m(n,r,u){return a(t(r)*t(u)+e(r)*e(u)*e(n))}function D(n,t){return i*(280.16+360.9856235*n)-t}function P(n){return i*(357.5291+.98560028*n)}function p(e){return e+i*(1.9148*t(e)+.02*t(2*e)+3e-4*t(3*e))+102.9372*i+n}function H(n){var t=p(P(n));return{dec:v(t,0),ra:g(t,0)}}var T={getPosition:function(n,t,e){var r=i*-e,a=i*t,u=h(n),o=H(u),c=D(u,r)-o.ra;return{azimuth:w(c,a,o.dec),altitude:m(c,a,o.dec)}}},b=T.times=[[-.833,"sunrise","sunset"],[-.3,"sunriseEnd","sunsetStart"],[-6,"dawn","dusk"],[-12,"nauticalDawn","nauticalDusk"],[-18,"nightEnd","night"],[6,"goldenHourEnd","goldenHour"]];T.addTime=function(n,t,e){b.push([n,t,e])};var E=9e-4;function I(t,e,r){return E+(t+e)/(2*n)+r}function k(n,e,r){return d+n+.0053*t(e)-.0069*t(2*r)}function q(n,r,a,u,i,c,s){return k(I(function(n,r,a){return o((t(n)-t(r)*t(a))/(e(r)*e(a)))}(n,a,u),r,i),c,s)}function x(n){var r=i*(134.963+13.064993*n),a=i*(93.272+13.22935*n),u=i*(218.316+13.176396*n)+6.289*i*t(r),o=5.128*i*t(a),c=385001-20905*e(r);return{ra:g(u,o),dec:v(u,o),dist:c}}function y(n,t){return new Date(n.valueOf()+t*c/24)}T.getTimes=function(t,e,r,a){var u,o,c,s,d,f=i*-r,M=i*e,g=function(n){return-2.076*Math.sqrt(n)/60}(a=a||0),w=function(t,e){return Math.round(t-E-e/(2*n))}(h(t),f),m=I(0,f,w),D=P(m),H=p(D),T=v(H,0),x=k(m,D,H),y={solarNoon:l(x),nadir:l(x-.5)};for(u=0,o=b.length;u=0&&(v=l-(m=Math.sqrt(M)/(2*Math.abs(d))),w=l+m,Math.abs(v)<=1&&g++,Math.abs(w)<=1&&g++,v<-1&&(v=w)),1===g?P<0?c=p+v:s=p+v:2===g&&(c=p+(h<0?w:v),s=p+(h<0?v:w)),!c||!s);p+=2)P=o;var H={};return c&&(H.rise=y(a,c)),s&&(H.set=y(a,s)),c||s||(H[h>0?"alwaysUp":"alwaysDown"]=!0),H},module.exports=exports=T}(); },{}],27:[function(require,module,exports){ var THREE=require("../three.js"),Constants=require("./constants.js"),validate=require("./validate.js"),utils={prettyPrintMatrix:function(t){for(var e=0;e<4;e++){var n=[t[e],t[e+4],t[e+8],t[e+12]];console.log(n.map(function(t){return t.toFixed(4)}))}},makePerspectiveMatrix:function(t,e,n,r){var o=new THREE.Matrix4,i=1/Math.tan(t/2),s=1/(n-r),a=[i/e,0,0,0,0,i,0,0,0,0,(r+n)*s,-1,0,0,2*r*n*s,0];return o.elements=a,o},radify:function(t){function e(t){return t=t||0,2*Math.PI*t/360}return"object"==typeof t?t.length>0?t.map(function(t){return e(t)}):[e(t.x),e(t.y),e(t.z)]:e(t)},degreeify:function(t){function e(t){return 360*(t=t||0)/(2*Math.PI)}return"object"==typeof t?[e(t.x),e(t.y),e(t.z)]:e(t)},projectToWorld:function(t){var e=[-Constants.MERCATOR_A*Constants.DEG2RAD*t[0]*Constants.PROJECTION_WORLD_SIZE,-Constants.MERCATOR_A*Math.log(Math.tan(.25*Math.PI+.5*Constants.DEG2RAD*t[1]))*Constants.PROJECTION_WORLD_SIZE];if(t[2]){var n=this.projectedUnitsPerMeter(t[1]);e.push(t[2]*n)}else e.push(0);return new THREE.Vector3(e[0],e[1],e[2])},projectedUnitsPerMeter:function(t){return Math.abs(Constants.WORLD_SIZE/Math.cos(Constants.DEG2RAD*t)/Constants.EARTH_CIRCUMFERENCE)},_scaleVerticesToMeters:function(t,e){for(var n=this.projectedUnitsPerMeter(t[1]),r=(this.projectToWorld(t),0);r diff --git a/examples/18-extrusions.html b/examples/18-extrusions.html index 8393a00d..ff7cd751 100644 --- a/examples/18-extrusions.html +++ b/examples/18-extrusions.html @@ -89,7 +89,7 @@ }); star.addTooltip("A animated extruded star over Columbus Park", true); star.setCoords(origin2); - star.set({ rotation: {x: 0, y: 0, z: 720}, duration: 10000 }) + star.set({ rotation: {x: 0, y: 0, z: 720}, duration: 20000 }) tb.add(star); //[jscastro] we read a geoJson that is filled with 3 real features from the composite source diff --git a/src/Threebox.js b/src/Threebox.js index 38164716..202efadd 100644 --- a/src/Threebox.js +++ b/src/Threebox.js @@ -687,8 +687,8 @@ Threebox.prototype = { return; } let z = this.map.getZoom(); - if (l.minzoom && z < l.minzoom) { console.log("< minzoom"); this.toggle(l.id, false); return; }; - if (l.maxzoom && z >= l.maxzoom) { console.log(">= maxzoom"); this.toggle(l.id, false); return; }; + if (l.minzoom && z < l.minzoom) { this.toggle(l.id, false); return; }; + if (l.maxzoom && z >= l.maxzoom) { this.toggle(l.id, false); return; }; this.toggle(l.id, true); }; }, diff --git a/src/utils/suncalc.js b/src/utils/suncalc.js index 4df8c12c..9cc8697e 100644 --- a/src/utils/suncalc.js +++ b/src/utils/suncalc.js @@ -31,6 +31,9 @@ function fromJulian(j) { return new Date((j + 0.5 - J1970) * dayMs); } function toDays(date) { return toJulian(date) - J2000; } + SunCalc.toJulian = function (date) { + return toJulian(date); + }; // general calculations for position diff --git a/tests/threebox-tests-bundle.js b/tests/threebox-tests-bundle.js index 20004842..4363c134 100644 --- a/tests/threebox-tests-bundle.js +++ b/tests/threebox-tests-bundle.js @@ -9630,8 +9630,8 @@ Threebox.prototype = { return; } let z = this.map.getZoom(); - if (l.minzoom && z < l.minzoom) { console.log("< minzoom"); this.toggle(l.id, false); return; }; - if (l.maxzoom && z >= l.maxzoom) { console.log(">= maxzoom"); this.toggle(l.id, false); return; }; + if (l.minzoom && z < l.minzoom) { this.toggle(l.id, false); return; }; + if (l.maxzoom && z >= l.maxzoom) { this.toggle(l.id, false); return; }; this.toggle(l.id, true); }; }, @@ -27559,6 +27559,9 @@ module.exports = exports = material; function fromJulian(j) { return new Date((j + 0.5 - J1970) * dayMs); } function toDays(date) { return toJulian(date) - J2000; } + SunCalc.toJulian = function (date) { + return toJulian(date); + }; // general calculations for position