UNPKG

qwc2

Version:

QGIS Web Client

https//qwc-services.github.io/

qgis/qwc2

11 lines • 22.9 kB
1
2
3
4
5
6
7
8
9
10
11
function _typeof(o){"@babel/helpers - typeof";return _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(o){return typeof o}:function(o){return o&&"function"==typeof Symbol&&o.constructor===Symbol&&o!==Symbol.prototype?"symbol":typeof o},_typeof(o)}function ownKeys(e,r){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);r&&(o=o.filter(function(r){return Object.getOwnPropertyDescriptor(e,r).enumerable})),t.push.apply(t,o)}return t}function _objectSpread(e){for(var r=1;r<arguments.length;r++){var t=null!=arguments[r]?arguments[r]:{};r%2?ownKeys(Object(t),!0).forEach(function(r){_defineProperty(e,r,t[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):ownKeys(Object(t)).forEach(function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(t,r))})}return e}function _classCallCheck(a,n){if(!(a instanceof n))throw new TypeError("Cannot call a class as a function")}function _defineProperties(e,r){for(var t=0;t<r.length;t++){var o=r[t];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(e,_toPropertyKey(o.key),o)}}function _createClass(e,r,t){return r&&_defineProperties(e.prototype,r),t&&_defineProperties(e,t),Object.defineProperty(e,"prototype",{writable:!1}),e}function _callSuper(t,o,e){return o=_getPrototypeOf(o),_possibleConstructorReturn(t,_isNativeReflectConstruct()?Reflect.construct(o,e||[],_getPrototypeOf(t).constructor):o.apply(t,e))}function _possibleConstructorReturn(t,e){if(e&&("object"==_typeof(e)||"function"==typeof e))return e;if(void 0!==e)throw new TypeError("Derived constructors may only return object or undefined");return _assertThisInitialized(t)}function _assertThisInitialized(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}function _isNativeReflectConstruct(){try{var t=!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}))}catch(t){}return(_isNativeReflectConstruct=function _isNativeReflectConstruct(){return!!t})()}function _getPrototypeOf(t){return _getPrototypeOf=Object.setPrototypeOf?Object.getPrototypeOf.bind():function(t){return t.__proto__||Object.getPrototypeOf(t)},_getPrototypeOf(t)}function _inherits(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function");t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,writable:!0,configurable:!0}}),Object.defineProperty(t,"prototype",{writable:!1}),e&&_setPrototypeOf(t,e)}function _setPrototypeOf(t,e){return _setPrototypeOf=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(t,e){return t.__proto__=e,t},_setPrototypeOf(t,e)}function _defineProperty(e,r,t){return(r=_toPropertyKey(r))in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t,e}function _toPropertyKey(t){var i=_toPrimitive(t,"string");return"symbol"==_typeof(i)?i:i+""}function _toPrimitive(t,r){if("object"!=_typeof(t)||!t)return t;var e=t[Symbol.toPrimitive];if(void 0!==e){var i=e.call(t,r||"default");if("object"!=_typeof(i))return i;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===r?String:Number)(t)}/** * Copyright 2024 Sourcepole AG * 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 React from"react";import Sun from"@giro3d/giro3d/core/geographic/Sun.js";import{MapLightingMode}from"@giro3d/giro3d/entities/MapLightingOptions";import PropTypes from"prop-types";import suncalc from"suncalc";import{AmbientLight,BasicShadowMap,CameraHelper,DirectionalLight,DirectionalLightHelper,PCFShadowMap,PCFSoftShadowMap,VSMShadowMap}from"three";import CoordinatesUtils from"../../utils/CoordinatesUtils";import LocaleUtils from"../../utils/LocaleUtils";import Icon from"../Icon";import SideBar from"../SideBar";import Input from"../widgets/Input";import NumberInput from"../widgets/NumberInput";import ToggleSwitch from"../widgets/ToggleSwitch";import"./style/Map3DLight.css";var Map3DLight=/*#__PURE__*/function(_React$Component){function Map3DLight(props){var _this;_classCallCheck(this,Map3DLight);_this=_callSuper(this,Map3DLight,[props]);_defineProperty(_this,"state",{showAdvanced:false,lightParams:{day:182,time:720,helpersVisible:false,moonLightIntensity:0.02,sunLightIntensity:3.5,zFactor:1,lightElevationLayersOnly:false,shadowsEnabled:true,shadowType:PCFShadowMap,shadowMapSize:4096,shadowBias:-0.0001,sunDistance:80000,normalBias:0,shadowIntensity:1,shadowVolumeNear:60000,shadowVolumeFar:100000},dayAnimation:false,dayAnimationSettings:false,dayStep:30,timeAnimation:false,timeAnimationSettings:false,timeStep:30});_defineProperty(_this,"onHide",function(){clearInterval(_this.animationInterval);_this.setState({dayAnimation:false,timeAnimation:false})});_defineProperty(_this,"renderBody",function(){var lightParams=_this.state.lightParams;var dateValue=new Date(new Date().getFullYear(),0,1+lightParams.day).toISOString().split("T")[0];var dateToDay=function dateToDay(date){var d=new Date(date);return 1+(d-new Date(Date.UTC(d.getUTCFullYear(),0,1)))/(1000*60*60*24)};var isLeapYear=function isLeapYear(year){return new Date(year,1,29).getDate()===29};var timeValue="".concat(String(Math.trunc(lightParams.time/60)).padStart(2,"0"),":").concat(String(Math.floor(lightParams.time%60)).padStart(2,"0"));var timeToMin=function timeToMin(time){var parts=time.split(":");return parseInt(parts[0],10)*60+parseInt(parts[1],10)};return/*#__PURE__*/React.createElement("div",{className:"maplight3d-body"},/*#__PURE__*/React.createElement("table",null,/*#__PURE__*/React.createElement("tbody",null,/*#__PURE__*/React.createElement("tr",null,/*#__PURE__*/React.createElement("td",null,LocaleUtils.tr("maplight3d.date")),/*#__PURE__*/React.createElement("td",null,/*#__PURE__*/React.createElement("div",{className:"map3d-animation-slider"},/*#__PURE__*/React.createElement(Icon,{icon:_this.state.dayAnimation?"square":"triangle-right",onClick:_this.toggleDayAnimation}),/*#__PURE__*/React.createElement("div",{className:"maplight3d-slider"},/*#__PURE__*/React.createElement("input",{max:365+isLeapYear(),min:1,onChange:function onChange(ev){return _this.updateLightParams("day",parseInt(ev.target.value,10))},step:1,type:"range",value:lightParams.day}),/*#__PURE__*/React.createElement(Input,{allowEmpty:false,onChange:function onChange(value){return _this.updateLightParams("day",dateToDay(value))},type:"date",value:dateValue})),/*#__PURE__*/React.createElement(Icon,{className:_this.state.dayAnimationSettings?"map3d-animation-settings-active":"",icon:"cog",onClick:function onClick(){return _this.setState(function(state){return{dayAnimationSettings:!state.dayAnimationSettings}})}})))),_this.state.dayAnimationSettings?/*#__PURE__*/React.createElement("tr",null,/*#__PURE__*/React.createElement("td",{colSpan:"2"},/*#__PURE__*/React.createElement("div",{className:"maplight3d-animation-settings"},/*#__PURE__*/React.createElement("span",null,LocaleUtils.tr("maplight3d.animationstep"),":"),/*#__PURE__*/React.createElement(NumberInput,{max:60,min:1,onChange:function onChange(dayStep){return _this.setState({dayStep:dayStep})},suffix:" "+LocaleUtils.tr("maplight3d.dayspersec"),value:_this.state.dayStep})))):null,/*#__PURE__*/React.createElement("tr",null,/*#__PURE__*/React.createElement("td",null,LocaleUtils.tr("maplight3d.time")),/*#__PURE__*/React.createElement("td",null,/*#__PURE__*/React.createElement("div",{className:"map3d-animation-slider"},/*#__PURE__*/React.createElement(Icon,{icon:_this.state.timeAnimation?"square":"triangle-right",onClick:_this.toggleTimeAnimation}),/*#__PURE__*/React.createElement("div",{className:"maplight3d-slider"},/*#__PURE__*/React.createElement("input",{max:1439,min:0,onChange:function onChange(ev){return _this.updateLightParams("time",parseInt(ev.target.value,10))},step:1,type:"range",value:lightParams.time}),/*#__PURE__*/React.createElement(Input,{allowEmpty:false,onChange:function onChange(value){return _this.updateLightParams("time",timeToMin(value))},type:"time",value:timeValue})),/*#__PURE__*/React.createElement(Icon,{className:_this.state.timeAnimationSettings?"map3d-animation-settings-active":"",icon:"cog",onClick:function onClick(){return _this.setState(function(state){return{timeAnimationSettings:!state.timeAnimationSettings}})}})))),_this.state.timeAnimationSettings?/*#__PURE__*/React.createElement("tr",null,/*#__PURE__*/React.createElement("td",{colSpan:"2"},/*#__PURE__*/React.createElement("div",{className:"maplight3d-animation-settings"},/*#__PURE__*/React.createElement("span",null,LocaleUtils.tr("maplight3d.animationstep"),":"),/*#__PURE__*/React.createElement(NumberInput,{max:60,min:1,onChange:function onChange(timeStep){return _this.setState({timeStep:timeStep})},suffix:" "+LocaleUtils.tr("maplight3d.minspersec"),value:_this.state.timeStep})))):null,/*#__PURE__*/React.createElement("tr",null,/*#__PURE__*/React.createElement("td",null,LocaleUtils.tr("maplight3d.sunLightIntensity")),/*#__PURE__*/React.createElement("td",null,_this.renderSlider("sunLightIntensity",0,10,0.1))),/*#__PURE__*/React.createElement("tr",null,/*#__PURE__*/React.createElement("td",null,LocaleUtils.tr("maplight3d.moonLightIntensity")),/*#__PURE__*/React.createElement("td",null,_this.renderSlider("moonLightIntensity",0,0.5,0.01))),/*#__PURE__*/React.createElement("tr",null,/*#__PURE__*/React.createElement("td",null,LocaleUtils.tr("maplight3d.shadows")),/*#__PURE__*/React.createElement("td",null,/*#__PURE__*/React.createElement(ToggleSwitch,{active:lightParams.shadowsEnabled,onChange:function onChange(value){return _this.updateLightParams("shadowsEnabled",value)}}))),/*#__PURE__*/React.createElement("tr",null,/*#__PURE__*/React.createElement("td",null,LocaleUtils.tr("maplight3d.shadowintensity")),/*#__PURE__*/React.createElement("td",null,_this.renderSlider("shadowIntensity",0,2,0.1))),/*#__PURE__*/React.createElement("tr",null,/*#__PURE__*/React.createElement("td",{className:"maplight3d-advanced",colSpan:"2"},/*#__PURE__*/React.createElement("label",null,/*#__PURE__*/React.createElement("input",{checked:_this.state.showAdvanced,onChange:function onChange(ev){return _this.setState(function(state){return{showAdvanced:!state.showAdvanced}})},type:"checkbox"})," ",LocaleUtils.tr("maplight3d.showadvanced")))),_this.state.showAdvanced?[/*#__PURE__*/React.createElement("tr",{key:"helpersVisible"},/*#__PURE__*/React.createElement("td",null,LocaleUtils.tr("maplight3d.helpersVisible")),/*#__PURE__*/React.createElement("td",null,/*#__PURE__*/React.createElement(ToggleSwitch,{active:lightParams.helpersVisible,onChange:function onChange(value){return _this.updateLightParams("helpersVisible",value)}}))),/*#__PURE__*/React.createElement("tr",{key:"zFactor"},/*#__PURE__*/React.createElement("td",null,LocaleUtils.tr("maplight3d.zFactor")),/*#__PURE__*/React.createElement("td",null,/*#__PURE__*/React.createElement("input",{max:10,min:0,onChange:function onChange(ev){return _this.updateLightParams("zFactor",ev.target.value)},step:0.1,type:"range",value:lightParams.zFactor}))),/*#__PURE__*/React.createElement("tr",{key:"shadowType"},/*#__PURE__*/React.createElement("td",null,LocaleUtils.tr("maplight3d.shadowType")),/*#__PURE__*/React.createElement("td",null,/*#__PURE__*/React.createElement("select",{onChange:function onChange(ev){return _this.updateLightParams("shadowType",parseInt(ev.target.value,10))},value:lightParams.shadowType},/*#__PURE__*/React.createElement("option",{value:BasicShadowMap},"BasicShadowMap"),/*#__PURE__*/React.createElement("option",{value:PCFShadowMap},"PCFShadowMap"),/*#__PURE__*/React.createElement("option",{value:PCFSoftShadowMap},"PCFSoftShadowMap"),/*#__PURE__*/React.createElement("option",{value:VSMShadowMap},"VSMShadowMap")))),/*#__PURE__*/React.createElement("tr",{key:"shadowMapSize"},/*#__PURE__*/React.createElement("td",null,LocaleUtils.tr("maplight3d.shadowMapSize")),/*#__PURE__*/React.createElement("td",null,/*#__PURE__*/React.createElement(NumberInput,{decimals:0,max:8192,min:64,onChange:function onChange(value){return _this.updateLightParams("shadowMapSize",value)},value:lightParams.shadowMapSize}))),/*#__PURE__*/React.createElement("tr",{key:"shadowBias"},/*#__PURE__*/React.createElement("td",null,LocaleUtils.tr("maplight3d.shadowBias")),/*#__PURE__*/React.createElement("td",null,/*#__PURE__*/React.createElement(NumberInput,{decimals:5,max:0.01,min:-0.01,onChange:function onChange(value){return _this.updateLightParams("shadowBias",value)},value:lightParams.shadowBias}))),/*#__PURE__*/React.createElement("tr",{key:"normalBias"},/*#__PURE__*/React.createElement("td",null,LocaleUtils.tr("maplight3d.normalBias")),/*#__PURE__*/React.createElement("td",null,/*#__PURE__*/React.createElement(NumberInput,{decimals:1,max:10,min:-10,onChange:function onChange(value){return _this.updateLightParams("normalBias",value)},value:lightParams.normalBias}))),/*#__PURE__*/React.createElement("tr",{key:"shadowVolumeNear"},/*#__PURE__*/React.createElement("td",null,LocaleUtils.tr("maplight3d.shadowVolumeNear")),/*#__PURE__*/React.createElement("td",null,/*#__PURE__*/React.createElement(NumberInput,{decimals:0,max:100000,min:100,onChange:function onChange(value){return _this.updateLightParams("shadowVolumeNear",value)},value:lightParams.shadowVolumeNear}))),/*#__PURE__*/React.createElement("tr",{key:"shadowVolumeFar"},/*#__PURE__*/React.createElement("td",null,LocaleUtils.tr("maplight3d.shadowVolumeFar")),/*#__PURE__*/React.createElement("td",null,/*#__PURE__*/React.createElement(NumberInput,{decimals:0,max:100000,min:100,onChange:function onChange(value){return _this.updateLightParams("shadowVolumeFar",value)},value:lightParams.shadowVolumeFar})))]:null)))});_defineProperty(_this,"toggleDayAnimation",function(){_this.setState(function(state){return{dayAnimation:!state.dayAnimation,timeAnimation:false}},function(){clearInterval(_this.animationInterval);if(_this.state.dayAnimation){_this.animationInterval=setInterval(function(){_this.updateLightParams("day",(_this.state.lightParams.day+_this.state.dayStep/10)%365)},100)}})});_defineProperty(_this,"toggleTimeAnimation",function(){_this.setState(function(state){return{timeAnimation:!state.timeAnimation,dayAnimation:false}},function(){clearInterval(_this.animationInterval);if(_this.state.timeAnimation){_this.animationInterval=setInterval(function(){_this.updateLightParams("time",(_this.state.lightParams.time+_this.state.timeStep/10)%1440)},100)}})});_defineProperty(_this,"renderSlider",function(key,min,max,step){var labelFormatter=arguments.length>4&&arguments[4]!==undefined?arguments[4]:undefined;var value=_this.state.lightParams[key];var parseValue=function parseValue(x){return Number.isInteger(step)?parseInt(x,10):parseFloat(x)};labelFormatter=labelFormatter!==null&&labelFormatter!==void 0?labelFormatter:function(x){return x.toFixed(-Math.log10(step))};return/*#__PURE__*/React.createElement("div",{className:"maplight3d-slider"},/*#__PURE__*/React.createElement("input",{max:max,min:min,onChange:function onChange(ev){return _this.updateLightParams(key,parseValue(ev.target.value))},step:step,type:"range",value:value}),/*#__PURE__*/React.createElement("div",{className:"maplight3d-slider-label"},/*#__PURE__*/React.createElement("span",{style:{left:(value-min)*100/(max-min)+"%"}},labelFormatter(value))))});_defineProperty(_this,"updateLightParams",function(key,value){_this.setState(function(state){return{lightParams:_objectSpread(_objectSpread({},state.lightParams),{},_defineProperty({},key,value))}})});_defineProperty(_this,"configureShadows",function(sunLight,lightParams,shadowIntensityK){if(!lightParams.shadowsEnabled){_this.props.sceneContext.scene.renderer.shadowMap.enabled=false;sunLight.castShadow=false;return}var cameraHeight=_this.props.sceneContext.scene.view.camera.position.z;var targetHeight=_this.props.sceneContext.scene.view.controls.target.z;var volumeSize=Math.min(20000,Math.max(1000,cameraHeight-targetHeight));sunLight.shadow.camera.top=volumeSize;sunLight.shadow.camera.bottom=-volumeSize;sunLight.shadow.camera.left=-volumeSize;sunLight.shadow.camera.right=volumeSize;sunLight.shadow.camera.near=lightParams.shadowVolumeNear;sunLight.shadow.camera.far=lightParams.shadowVolumeFar;sunLight.shadow.camera.updateProjectionMatrix();sunLight.shadow.mapSize.set(lightParams.shadowMapSize,lightParams.shadowMapSize);sunLight.shadow.bias=lightParams.shadowBias;sunLight.shadow.normalBias=lightParams.normalBias;sunLight.shadow.intensity=lightParams.shadowIntensity*shadowIntensityK;_this.props.sceneContext.scene.renderer.shadowMap.enabled=true;sunLight.castShadow=true});_defineProperty(_this,"setLighting",function(){var sceneContext=_this.props.sceneContext;var lightParams=_this.state.lightParams;var ambientLight=sceneContext.getSceneObject("__ambientLight");var sunLight=sceneContext.getSceneObject("__sunLight");var moonLight=sceneContext.getSceneObject("__moonLight");var lightTarget=sceneContext.scene.view.controls.target.clone();lightTarget.z=0;// Compute azimuth / zenith and sun position var date=new Date(new Date().getFullYear(),0,lightParams.day,Math.trunc(lightParams.time/60),lightParams.time%60);var latlon=CoordinatesUtils.reproject([lightTarget.x,lightTarget.y],sceneContext.mapCrs,"EPSG:4326");var sunPos=suncalc.getPosition(date,latlon[1],latlon[0]);var zenith=90-sunPos.altitude/Math.PI*180;var azimuth=180+sunPos.azimuth/Math.PI*180;var sunLocalPos=Sun.getLocalPosition({point:lightTarget,zenith:Math.min(90,zenith),azimuth:azimuth,distance:lightParams.sunDistance});// Compute dynamic params var noonColor={r:1,g:0.98,b:0.98};var horizonColor={r:1,g:0.5,b:0.3};var duskColor={r:0.15,g:0.22,b:0.35};var lerpColor=function lerpColor(a,b,t){return{r:(1-t)*a.r+t*b.r,g:(1-t)*a.g+t*b.g,b:(1-t)*a.b+t*b.b}};var sunColor=noonColor;var ambientIntensity=0;var shadowIntensityK=0;var sunLightIntensityK=Math.min(1,(98-Math.min(98,zenith))/16);var moonLightIntensityK=1-Math.min(1,(90-Math.min(90,zenith))/16);if(zenith<90){var k=Math.pow(zenith/90,3);sunColor=lerpColor(noonColor,horizonColor,k);ambientIntensity=(1-zenith/90)*1.5;shadowIntensityK=(1-k)*0.9+0.2*k}else if(zenith<102){var _k=(zenith-90)/12;sunColor=lerpColor(horizonColor,duskColor,_k);shadowIntensityK=0.2*(1-_k)}// Set lighting params sceneContext.map.lighting.enabled=true;sceneContext.map.lighting.mode=lightParams.shadowsEnabled?MapLightingMode.LightBased:MapLightingMode.Hillshade;sceneContext.map.lighting.elevationLayersOnly=lightParams.lightElevationLayersOnly;sceneContext.map.lighting.hillshadeAzimuth=azimuth;sceneContext.map.lighting.hillshadeZenith=Math.min(90,zenith);sceneContext.map.lighting.zFactor=lightParams.zFactor;sceneContext.scene.notifyChange(sceneContext.map);sceneContext.scene.renderer.shadowMap.type=lightParams.shadowType;ambientLight.intensity=ambientIntensity;sunLight.position.copy(sunLocalPos);sunLight.intensity=lightParams.sunLightIntensity*sunLightIntensityK;sunLight.color=sunColor;sunLight.target.position.copy(lightTarget);sunLight.updateMatrixWorld(true);sunLight.target.updateMatrixWorld(true);_this.configureShadows(sunLight,lightParams,shadowIntensityK);// NOTE: just a top-down light moonLight.position.set(lightTarget.x,lightTarget.y,8000);moonLight.intensity=lightParams.moonLightIntensity*moonLightIntensityK;moonLight.target.position.copy(lightTarget);moonLight.updateMatrixWorld(true);moonLight.target.updateMatrixWorld(true);if(lightParams.helpersVisible){var sunLightHelper=sceneContext.getSceneObject("__sunLightHelper");sunLightHelper.update();sunLightHelper.updateMatrixWorld(true);var shadowCameraHelper=sceneContext.getSceneObject("__shadowCameraHelper");shadowCameraHelper.update();shadowCameraHelper.updateMatrixWorld(true)}sceneContext.scene.notifyChange()});_this.state.lightParams.day=props.sceneContext.options.defaultDay;var _parts=props.sceneContext.options.defaultTime.split(":").slice(0,2).map(Number);_this.state.lightParams.time=_parts[0]*60+_parts[1];return _this}_inherits(Map3DLight,_React$Component);return _createClass(Map3DLight,[{key:"componentDidMount",value:function componentDidMount(){this.animationInterval=null;this.componentDidUpdate({})}},{key:"componentDidUpdate",value:function componentDidUpdate(prevProps,prevState){var _prevProps$sceneConte;if(this.props.sceneContext.scene!==((_prevProps$sceneConte=prevProps.sceneContext)===null||_prevProps$sceneConte===void 0?void 0:_prevProps$sceneConte.scene)){var ambientLight=new AmbientLight(16777215,1);this.props.sceneContext.addSceneObject("__ambientLight",ambientLight);var sunLight=new DirectionalLight(16777215,this.state.sunLightIntensity);this.props.sceneContext.addSceneObject("__sunLight",sunLight);var moonLight=new DirectionalLight(16777215,this.state.moonLightIntensity);this.props.sceneContext.addSceneObject("__moonLight",moonLight);if(this.state.lightParams.helpersVisible){var sunLightHelper=new DirectionalLightHelper(sunLight,200,"white");this.props.sceneContext.addSceneObject("__sunLightHelper",sunLightHelper);var shadowCameraHelper=new CameraHelper(sunLight.shadow.camera);this.props.sceneContext.addSceneObject("__shadowCameraHelper",shadowCameraHelper)}this.props.sceneContext.scene.view.controls.addEventListener("change",this.setLighting);this.setLighting()}else if(this.state.lightParams!==prevState.lightParams){if(this.state.lightParams.helpersVisible&&!prevState.lightParams.helpersVisible){var _sunLight=this.props.sceneContext.getSceneObject("__sunLight");var _sunLightHelper=new DirectionalLightHelper(_sunLight,200,"white");this.props.sceneContext.addSceneObject("__sunLightHelper",_sunLightHelper);var _shadowCameraHelper=new CameraHelper(_sunLight.shadow.camera);this.props.sceneContext.addSceneObject("__shadowCameraHelper",_shadowCameraHelper)}else if(prevState.lightParams.helpersVisible&&!this.state.lightParams.helpersVisible){this.props.sceneContext.removeSceneObject("__sunLightHelper");this.props.sceneContext.removeSceneObject("__shadowCameraHelper")}this.setLighting()}}},{key:"componentWillUnmount",value:function componentWillUnmount(){clearInterval(this.lightPositionInterval);this.props.sceneContext.removeSceneObject("__sunLight");this.props.sceneContext.removeSceneObject("__moonLight");this.props.sceneContext.removeSceneObject("__sunLightHelper");this.props.sceneContext.removeSceneObject("__shadowCameraHelper")}},{key:"render",value:function render(){var _this2=this;return/*#__PURE__*/React.createElement(SideBar,{icon:"light",id:"MapLight3D",onHide:this.onHide,title:LocaleUtils.tr("appmenu.items.MapLight3D"),width:"25em"},function(){return{body:_this2.renderBody()}})}}])}(React.Component);_defineProperty(Map3DLight,"propTypes",{sceneContext:PropTypes.object});export{Map3DLight as default};