qwc2 2025.7.3 → 2025.7.10
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/actions/layers.js +1 -1
- package/components/AttributeForm.js +1 -1
- package/components/QtDesignerForm.js +1 -1
- package/components/map3d/Identify3D.js +1 -1
- package/components/map3d/ImportObjects3D.js +1 -1
- package/components/map3d/LayerTree3D.js +1 -1
- package/components/map3d/Map3D.js +9 -8
- package/components/map3d/Map3DLight.js +5 -5
- package/components/map3d/MapControls3D.js +3 -2
- package/components/map3d/drawtool/EditTool3D.js +4 -6
- package/components/map3d/style/LayerTree3D.css +1 -0
- package/components/map3d/utils/FirstPersonControls3D.js +1 -1
- package/components/map3d/utils/MiscUtils3D.js +1 -1
- package/components/map3d/utils/Tiles3DStyle.js +3 -3
- package/components/widgets/NumberInput.js +1 -1
- package/package.json +2 -1
- package/plugins/API.js +4 -4
- package/plugins/FeatureForm.js +1 -1
- package/plugins/Map.js +1 -1
- package/plugins/View3D.js +25 -7
- package/plugins/style/LayerTree.css +1 -0
- package/utils/LayerUtils.js +1 -1
- package/utils/MiscUtils.js +2 -1
- package/components/map3d/drawtool/TransformControls.js +0 -259
package/actions/layers.js
CHANGED
|
@@ -5,4 +5,4 @@
|
|
|
5
5
|
* This source code is licensed under the BSD-style license found in the
|
|
6
6
|
* LICENSE file in the root directory of this source tree.
|
|
7
7
|
*/import ReducerIndex from"../reducers/index";import layersReducer from"../reducers/layers";ReducerIndex.register("layers",layersReducer);import ConfigUtils from"../utils/ConfigUtils";export var SET_LAYER_LOADING="SET_LAYER_LOADING";export var ADD_LAYER="ADD_LAYER";export var ADD_LAYER_SEPARATOR="ADD_LAYER_SEPARATOR";export var REMOVE_LAYER="REMOVE_LAYER";export var REORDER_LAYER="REORDER_LAYER";export var ADD_LAYER_FEATURES="ADD_LAYER_FEATURES";export var ADD_THEME_SUBLAYER="ADD_THEME_SUBLAYER";export var REMOVE_LAYER_FEATURES="REMOVE_LAYER_FEATURES";export var CLEAR_LAYER="CLEAR_LAYER";export var CHANGE_LAYER_PROPERTY="CHANGE_LAYER_PROPERTY";export var SET_LAYER_DIMENSIONS="SET_LAYER_DIMENSIONS";export var REFRESH_LAYER="REFRESH_LAYER";export var REMOVE_ALL_LAYERS="REMOVE_ALL_LAYERS";export var REPLACE_PLACEHOLDER_LAYER="REPLACE_PLACEHOLDER_LAYER";export var SET_SWIPE="SET_SWIPE";export var SET_FILTER="SET_FILTER";export var SET_THEME_LAYERS_VISIBILITY_PRESET="SET_THEME_LAYERS_VISIBILITY_PRESET";export var LayerRole={BACKGROUND:1,THEME:2,USERLAYER:3,SELECTION:4,MARKER:5};export function addLayer(layer){var pos=arguments.length>1&&arguments[1]!==undefined?arguments[1]:null;var options=arguments.length>2&&arguments[2]!==undefined?arguments[2]:null;return{type:ADD_LAYER,layer:layer,pos:pos,options:options}}export function addLayerSeparator(title,afterLayerId,afterSublayerPath){return{type:ADD_LAYER_SEPARATOR,title:title,afterLayerId:afterLayerId,afterSublayerPath:afterSublayerPath}}export function removeLayer(layerId){var sublayerpath=arguments.length>1&&arguments[1]!==undefined?arguments[1]:[];return{type:REMOVE_LAYER,layerId:layerId,sublayerpath:sublayerpath}}export function reorderLayer(layer,sublayerpath,direction){return function(dispatch,getState){dispatch({type:REORDER_LAYER,layer:layer,sublayerpath:sublayerpath,direction:direction,preventSplittingGroups:ConfigUtils.getConfigProp("preventSplittingGroupsWhenReordering",getState().theme.current)})}}export function addLayerFeatures(layer,features){var clear=arguments.length>2&&arguments[2]!==undefined?arguments[2]:false;return{type:ADD_LAYER_FEATURES,layer:layer,features:features,clear:clear}}export function removeLayerFeatures(layerId,featureIds){var keepEmptyLayer=arguments.length>2&&arguments[2]!==undefined?arguments[2]:false;return{type:REMOVE_LAYER_FEATURES,layerId:layerId,featureIds:featureIds,keepEmptyLayer:keepEmptyLayer}}export function clearLayer(layerId){return{type:CLEAR_LAYER,layerId:layerId}}export function addThemeSublayer(layer){return{type:ADD_THEME_SUBLAYER,layer:layer}}// recurseDirection: null (don't recurse), 'parents', 'children', 'both'
|
|
8
|
-
export function changeLayerProperty(layerId,property,newvalue){var sublayerpath=arguments.length>3&&arguments[3]!==undefined?arguments[3]:[];var recurseDirection=arguments.length>4&&arguments[4]!==undefined?arguments[4]:null;return{type:CHANGE_LAYER_PROPERTY,layerId:layerId,property:property,newvalue:newvalue,sublayerpath:sublayerpath,recurseDirection:recurseDirection}}export function setLayerDimensions(layerId,dimensions){return{type:SET_LAYER_DIMENSIONS,layerId:layerId,dimensions:dimensions}}export function setLayerLoading(layerId,loading){return{type:SET_LAYER_LOADING,layerId:layerId,loading:loading}}export function addMarker(id,point){var label=arguments.length>2&&arguments[2]!==undefined?arguments[2]:"";var crs=arguments.length>3&&arguments[3]!==undefined?arguments[3]:"EPSG:4326";var zIndex=arguments.length>4&&arguments[4]!==undefined?arguments[4]:null;var layer={id:"markers",role:LayerRole.MARKER,zIndex:zIndex};var feature={id:id,geometry:{type:"Point",coordinates:point},properties:{label:label},crs:crs,styleName:"marker"};return addLayerFeatures(layer,[feature])}export function removeMarker(id){return removeLayerFeatures("markers",[id])}export function refreshLayer(filter){return{type:REFRESH_LAYER,filter:filter}}export function removeAllLayers(){return{type:REMOVE_ALL_LAYERS}}export function replacePlaceholderLayer(id,layer){return{type:REPLACE_PLACEHOLDER_LAYER,id:id,layer:layer}}export function setSwipe(swipe){return{type:SET_SWIPE,swipe:swipe}}export function setFilter(filter,filterGeom,timeRange){return{type:SET_FILTER,filter:filter,filterGeom:filterGeom,timeRange:timeRange}}export function setThemeLayersVisibilityPreset(preset){return{type:SET_THEME_LAYERS_VISIBILITY_PRESET,preset:preset}}
|
|
8
|
+
export function changeLayerProperty(layerId,property,newvalue){var sublayerpath=arguments.length>3&&arguments[3]!==undefined?arguments[3]:[];var recurseDirection=arguments.length>4&&arguments[4]!==undefined?arguments[4]:null;return{type:CHANGE_LAYER_PROPERTY,layerId:layerId,property:property,newvalue:newvalue,sublayerpath:sublayerpath,recurseDirection:recurseDirection}}export function setLayerDimensions(layerId,dimensions){return{type:SET_LAYER_DIMENSIONS,layerId:layerId,dimensions:dimensions}}export function setLayerLoading(layerId,loading){return{type:SET_LAYER_LOADING,layerId:layerId,loading:loading}}export function addMarker(id,point){var label=arguments.length>2&&arguments[2]!==undefined?arguments[2]:"";var crs=arguments.length>3&&arguments[3]!==undefined?arguments[3]:"EPSG:4326";var zIndex=arguments.length>4&&arguments[4]!==undefined?arguments[4]:null;var layer={id:"markers",role:LayerRole.MARKER,zIndex:zIndex};var feature={id:id,geometry:{type:"Point",coordinates:point},properties:{label:label},crs:crs,styleName:"marker"};return addLayerFeatures(layer,[feature])}export function removeMarker(id){return removeLayerFeatures("markers",[id])}export function refreshLayer(filter){return{type:REFRESH_LAYER,filter:filter}}export function removeAllLayers(){return{type:REMOVE_ALL_LAYERS}}export function replacePlaceholderLayer(id,layer){return{type:REPLACE_PLACEHOLDER_LAYER,id:id,layer:layer}}export function setSwipe(swipe){return{type:SET_SWIPE,swipe:swipe}}export function setFilter(filter,filterGeom,timeRange){return{type:SET_FILTER,filter:filter,filterGeom:filterGeom,timeRange:timeRange}}export function setThemeLayersVisibilityPreset(preset){return{type:SET_THEME_LAYERS_VISIBILITY_PRESET,preset:preset}}
|
|
@@ -11,7 +11,7 @@ if(["new","empty"].includes(fieldStatus)){newRelationValues[table].features.spli
|
|
|
11
11
|
var changed=_this.props.editContext.changed;var fk=_this.state.relationTables[table].fk;if(_this.props.editContext.action!=="Draw"&&feature.properties[fk]!==_this.props.editContext.feature.id){newRelationValues[table].features[idx].properties[fk]=_this.props.editContext.feature.id;newRelationValues[table].features[idx].__status__="changed";changed=true}var newFeature=_objectSpread(_objectSpread({},_this.props.editContext.feature),{},{relationValues:newRelationValues});_this.props.setEditContext(_this.props.editContext.id,{feature:newFeature,changed:changed})}_this.setState({childEdit:null})});_defineProperty(_this,"onDiscard",function(action){if(action==="Discard"){_this.props.setCurrentTaskBlocked(false);if(!_this.props.onDiscard||!_this.props.onDiscard()){if(_this.props.editContext.action==="Pick"){// Re-query the original feature
|
|
12
12
|
_this.setState({busy:true});_this.props.iface.getFeatureById(_this.props.editConfig.editDataset,_this.props.editContext.feature.id,_this.props.map.projection,function(feature){_this.setState({busy:false});if(!isEmpty(_this.state.relationTables)){// Re-load relation values
|
|
13
13
|
_this.loadRelationValues(feature,function(newFeature){_this.props.setEditContext(_this.props.editContext.id,{feature:newFeature,changed:false})});// Re-validate feature field constraints
|
|
14
|
-
_this.validateFieldConstraints(feature)}else{_this.props.setEditContext(_this.props.editContext.id,{feature:feature,changed:false})}})}else{var featureSkel={type:"Feature",properties:{}};var mapPrefix=(_this.props.editConfig.editDataset.match(/^[^.]+\./)||[""])[0];getFeatureTemplate(_this.props.editConfig,featureSkel,_this.props.iface,mapPrefix,_this.props.map.projection,function(feature){_this.props.setEditContext(_this.props.editContext.id,{feature:feature,changed:false})})}}}});_defineProperty(_this,"setupChangedObserver",function(form){_this.form=form;if(form){form.observer=new MutationObserver(function(){_this.setState({formValid:form.checkValidity()})});form.observer.observe(form,{subtree:true,childList:true,attributes:true})}});_defineProperty(_this,"formChanged",function(ev){var _ev$target;var form=ev.currentTarget;if((_ev$target=ev.target)!==null&&_ev$target!==void 0&&_ev$target.setCustomValidity){ev.target.setCustomValidity("")}if(form){_this.setState({formValid:form.checkValidity()});_this.props.setEditContext(_this.props.editContext.id,{changed:true})}});_defineProperty(_this,"validateFieldConstraints",function(feature){var validCallback=arguments.length>1&&arguments[1]!==undefined?arguments[1]:null;var invalidCallback=arguments.length>2&&arguments[2]!==undefined?arguments[2]:null;var constraintExpressions=_this.props.editConfig.fields.reduce(function(res,cur){var _cur$constraints;if((_cur$constraints=cur.constraints)!==null&&_cur$constraints!==void 0&&_cur$constraints.expression){var _cur$constraints2;return _objectSpread(_objectSpread({},res),{},_defineProperty({},cur.id,(_cur$constraints2=cur.constraints)===null||_cur$constraints2===void 0?void 0:_cur$constraints2.expression))}return res},{});parseExpressionsAsync(constraintExpressions,feature,_this.props.editConfig.editDataset,_this.props.iface,_this.editMapPrefix(),_this.props.map.projection,false).then(function(result){var valid=true;Object.entries(result).forEach(function(_ref5){var _ref6=_slicedToArray(_ref5,2),key=_ref6[0],value=_ref6[1];var element=_this.form.elements.namedItem(key);if(value===false){var _this$props$editConfi,_this$props$editConfi2;valid=false;element.setCustomValidity((_this$props$editConfi=(_this$props$editConfi2=_this.props.editConfig.fields.find(function(field){return field.id===key}))===null||_this$props$editConfi2===void 0||(_this$props$editConfi2=_this$props$editConfi2.constraints)===null||_this$props$editConfi2===void 0?void 0:_this$props$editConfi2.placeholder)!==null&&_this$props$editConfi!==void 0?_this$props$editConfi:LocaleUtils.tr("editing.contraintviolation"))}else{element.setCustomValidity("")}});if(!valid){_this.setState({formValid:false});if(invalidCallback){invalidCallback()}}else{if(validCallback){validCallback()}}})});_defineProperty(_this,"onSubmit",function(ev){ev.preventDefault();_this.validateFieldConstraints(_this.props.editContext.feature,_this.doSubmit,function(){/* eslint-disable-next-line */alert(LocaleUtils.tr("editing.contraintviolation"))})});_defineProperty(_this,"doSubmit",function(){_this.setState({busy:true});var feature=_this.props.editContext.feature;// Ensure properties is not null
|
|
14
|
+
_this.validateFieldConstraints(feature)}else{_this.props.setEditContext(_this.props.editContext.id,{feature:feature,changed:false})}})}else{var featureSkel={type:"Feature",properties:{}};var mapPrefix=(_this.props.editConfig.editDataset.match(/^[^.]+\./)||[""])[0];getFeatureTemplate(_this.props.editConfig,featureSkel,_this.props.iface,mapPrefix,_this.props.map.projection,function(feature){_this.props.setEditContext(_this.props.editContext.id,{feature:feature,changed:false})})}}}});_defineProperty(_this,"setupChangedObserver",function(form){_this.form=form;if(form){form.observer=new MutationObserver(function(){_this.setState({formValid:form.checkValidity()})});form.observer.observe(form,{subtree:true,childList:true,attributes:true})}});_defineProperty(_this,"formChanged",function(ev){var _ev$target;var form=ev.currentTarget;if((_ev$target=ev.target)!==null&&_ev$target!==void 0&&_ev$target.setCustomValidity){ev.target.setCustomValidity("")}if(form){_this.setState({formValid:form.checkValidity()});_this.props.setEditContext(_this.props.editContext.id,{changed:true})}});_defineProperty(_this,"validateFieldConstraints",function(feature){var validCallback=arguments.length>1&&arguments[1]!==undefined?arguments[1]:null;var invalidCallback=arguments.length>2&&arguments[2]!==undefined?arguments[2]:null;var constraintExpressions=_this.props.editConfig.fields.reduce(function(res,cur){var _cur$constraints;if((_cur$constraints=cur.constraints)!==null&&_cur$constraints!==void 0&&_cur$constraints.expression){var _cur$constraints2;return _objectSpread(_objectSpread({},res),{},_defineProperty({},cur.id,(_cur$constraints2=cur.constraints)===null||_cur$constraints2===void 0?void 0:_cur$constraints2.expression))}return res},{});parseExpressionsAsync(constraintExpressions,feature,_this.props.editConfig.editDataset,_this.props.iface,_this.editMapPrefix(),_this.props.map.projection,false).then(function(result){var valid=true;Object.entries(result).forEach(function(_ref5){var _ref6=_slicedToArray(_ref5,2),key=_ref6[0],value=_ref6[1];var element=_this.form.elements.namedItem(key);if(element){if(value===false){var _this$props$editConfi,_this$props$editConfi2;valid=false;element.setCustomValidity((_this$props$editConfi=(_this$props$editConfi2=_this.props.editConfig.fields.find(function(field){return field.id===key}))===null||_this$props$editConfi2===void 0||(_this$props$editConfi2=_this$props$editConfi2.constraints)===null||_this$props$editConfi2===void 0?void 0:_this$props$editConfi2.placeholder)!==null&&_this$props$editConfi!==void 0?_this$props$editConfi:LocaleUtils.tr("editing.contraintviolation"))}else{element.setCustomValidity("")}}});if(!valid){_this.setState({formValid:false});if(invalidCallback){invalidCallback()}}else{if(validCallback){validCallback()}}})});_defineProperty(_this,"onSubmit",function(ev){ev.preventDefault();_this.validateFieldConstraints(_this.props.editContext.feature,_this.doSubmit,function(){/* eslint-disable-next-line */alert(LocaleUtils.tr("editing.contraintviolation"))})});_defineProperty(_this,"doSubmit",function(){_this.setState({busy:true});var feature=_this.props.editContext.feature;// Ensure properties is not null
|
|
15
15
|
feature=_objectSpread(_objectSpread({},feature),{},{type:"Feature",properties:_objectSpread({},feature.properties||{}),crs:{type:"name",properties:{name:CoordinatesUtils.toOgcUrnCrs(_this.props.map.projection)}}});// Omit geometry if it is read-only
|
|
16
16
|
if(_this.props.editContext.geomReadOnly){delete feature.geometry}var curConfig=_this.props.editConfig;var mapPrefix=_this.editMapPrefix();var textNullValue=ConfigUtils.getConfigProp("editTextNullValue");// Keep relation values separate
|
|
17
17
|
var relationValues=clone(feature.relationValues||{});delete feature.relationValues;var relationUploads={};var featureUploads={};// Collect all values from form fields
|
|
@@ -16,7 +16,7 @@ preprocessor: function(formData, feature, callback)
|
|
|
16
16
|
*/export function registerFormPreprocessor(editLayerId,preprocessor){FormPreprocessors[editLayerId]=preprocessor}export function removeFormPreprocessor(editLayerId){delete FormPreprocessors[editLayerId]}var hFitWidgets=["QLabel","QCheckBox","QRadioButton","Line","QDateTimeEdit","QDateEdit","QTimeEdit"];var vFitWidgets=["QLabel","QCheckBox","QRadioButton","Line","QDateTimeEdit","QDateEdit","QTimeEdit","QPushButton","QComboBox","QLineEdit","QSpinBox","QDoubleSpinBox","QSlider"];var QtDesignerForm=/*#__PURE__*/function(_React$Component){function QtDesignerForm(props){var _this;_classCallCheck(this,QtDesignerForm);_this=_callSuper(this,QtDesignerForm,[props]);_defineProperty(_this,"state",{reevaluate:0});_defineProperty(_this,"renderLayout",function(layout,feature,dataset,updateField){var nametransform=arguments.length>4&&arguments[4]!==undefined?arguments[4]:function(name){return name};var visible=arguments.length>5&&arguments[5]!==undefined?arguments[5]:true;var containerClass="";var itemStyle=function itemStyle(){return{}};var sortKey=function sortKey(item,idx){return idx};var containerStyle={};if(!layout){return null}else if(layout["class"]==="QGridLayout"||layout["class"]==="QFormLayout"){containerClass="qt-designer-layout-grid";containerStyle={gridTemplateColumns:_this.computeLayoutColumns(layout.item).join(" "),gridTemplateRows:_this.computeLayoutRows(layout.item).join(" ")};itemStyle=function itemStyle(item){return{gridArea:1+parseInt(item.row,10)+"/"+(1+parseInt(item.column,10))+"/ span "+parseInt(item.rowspan||1,10)+"/ span "+parseInt(item.colspan||1,10)}};sortKey=function sortKey(item){return item.row}}else if(layout["class"]==="QVBoxLayout"){containerClass="qt-designer-layout-grid";itemStyle=function itemStyle(item,idx){return{gridArea:1+idx+"/1/ span 1/ span 1"}};sortKey=function sortKey(item,idx){return idx}}else if(layout["class"]==="QHBoxLayout"){containerClass="qt-designer-layout-grid";containerStyle={gridTemplateColumns:_this.computeLayoutColumns(layout.item,true).join(" ")};itemStyle=function itemStyle(item,idx){return{gridArea:"1/"+(1+idx)+"/ span 1/ span 1"}};sortKey=function sortKey(item,idx){return idx}}else{return null}if(!visible){containerStyle.display="none"}if(layout.item.find(function(item){return item.spacer&&(item.spacer.property||{}).orientation==="Qt::Vertical"})){containerStyle.height="100%"}return/*#__PURE__*/React.createElement("div",{className:containerClass,key:layout.name,style:containerStyle},layout.item.sort(function(a,b){return sortKey(a)-sortKey(b)}).map(function(item,idx){var child=null;if(item.widget){child=_this.renderWidget(item.widget,feature,dataset,updateField,nametransform)}else if(item.layout){child=_this.renderLayout(item.layout,feature,dataset,updateField,nametransform)}else if(item.spacer){child=/*#__PURE__*/React.createElement("div",null)}else{return null}return/*#__PURE__*/React.createElement("div",{key:"i"+idx,style:itemStyle(item,idx)},child)}))});_defineProperty(_this,"computeLayoutColumns",function(items){var useIndex=arguments.length>1&&arguments[1]!==undefined?arguments[1]:false;var columns=[];var hasAuto=false;var hasSpacer=items.find(function(item){var _item$spacer;return((_item$spacer=item.spacer)===null||_item$spacer===void 0||(_item$spacer=_item$spacer.property)===null||_item$spacer===void 0?void 0:_item$spacer.orientation)==="Qt::Horizontal"});items.forEach(function(item,index){var _item$spacer2,_item$widget;var col=useIndex?index:parseInt(item.column,10)||0;var colSpan=useIndex?1:parseInt(item.colspan,10)||1;if(((_item$spacer2=item.spacer)===null||_item$spacer2===void 0||(_item$spacer2=_item$spacer2.property)===null||_item$spacer2===void 0?void 0:_item$spacer2.orientation)==="Qt::Horizontal"){columns[col]="auto";hasAuto=true}else if(!hasSpacer&&!hFitWidgets.includes((_item$widget=item.widget)===null||_item$widget===void 0?void 0:_item$widget["class"])&&colSpan===1){columns[col]="auto";hasAuto=true}else{var _columns$col;columns[col]=(_columns$col=columns[col])!==null&&_columns$col!==void 0?_columns$col:null;// Placeholder replaced by fit-content below
|
|
17
17
|
}});var fit="fit-content("+Math.round(1/columns.length*100)+"%)";for(var col=0;col<columns.length;++col){columns[col]=hasAuto?columns[col]||fit:"auto"}return columns});_defineProperty(_this,"computeLayoutRows",function(items){var useIndex=arguments.length>1&&arguments[1]!==undefined?arguments[1]:false;var rows=[];var hasSpacer=items.find(function(item){var _item$spacer3;return((_item$spacer3=item.spacer)===null||_item$spacer3===void 0||(_item$spacer3=_item$spacer3.property)===null||_item$spacer3===void 0?void 0:_item$spacer3.orientation)==="Qt::Vertical"});items.forEach(function(item,index){var _item$spacer4,_item$widget2,_item$widget2$startsW,_item$widget$layout,_item$widget3,_item$widget5;var row=useIndex?index:parseInt(item.row,10)||0;var rowSpan=useIndex?1:parseInt(item.rowspan,10)||1;if(((_item$spacer4=item.spacer)===null||_item$spacer4===void 0||(_item$spacer4=_item$spacer4.property)===null||_item$spacer4===void 0?void 0:_item$spacer4.orientation)==="Qt::Vertical"||(_item$widget2=item.widget)!==null&&_item$widget2!==void 0&&(_item$widget2=_item$widget2.name)!==null&&_item$widget2!==void 0&&(_item$widget2$startsW=_item$widget2.startsWith)!==null&&_item$widget2$startsW!==void 0&&_item$widget2$startsW.call(_item$widget2,"nrel_")){rows[row]="auto"}else if((_item$widget$layout=(_item$widget3=item.widget)===null||_item$widget3===void 0?void 0:_item$widget3.layout)!==null&&_item$widget$layout!==void 0?_item$widget$layout:item.layout){var _item$widget4,_item$layout;rows[row]=(_item$widget4=item.widget)!==null&&_item$widget4!==void 0&&(_item$widget4=_item$widget4.layout)!==null&&_item$widget4!==void 0&&_item$widget4.verticalFill||(_item$layout=item.layout)!==null&&_item$layout!==void 0&&_item$layout.verticalFill?"auto":null;// Placeholder replaced by fit-content below
|
|
18
18
|
}else if(!hasSpacer&&!vFitWidgets.includes((_item$widget5=item.widget)===null||_item$widget5===void 0?void 0:_item$widget5["class"])&&rowSpan===1){rows[row]="auto"}else{var _rows$row;rows[row]=(_rows$row=rows[row])!==null&&_rows$row!==void 0?_rows$row:null;// Placeholder replaced by fit-content below
|
|
19
|
-
}});var fit="fit-content("+Math.round(1/rows.length*100)+"%)";for(var row=0;row<rows.length;++row){rows[row]=rows[row]||fit}return rows});_defineProperty(_this,"renderWidget",function(widget,feature,dataset,updateField){var _widget$name,_this$props$fields$wi;var nametransform=arguments.length>4&&arguments[4]!==undefined?arguments[4]:function(name){return name};var disabled=arguments.length>5&&arguments[5]!==undefined?arguments[5]:false;var value=(_widget$name=(feature.properties||{})[widget.name])!==null&&_widget$name!==void 0?_widget$name:"";var prop=widget.property||{};if(String(prop.visible)==="false"){return null}var attr=widget.attribute||{};var fieldConstraints=((_this$props$fields$wi=_this.props.fields[widget.name])===null||_this$props$fields$wi===void 0?void 0:_this$props$fields$wi.constraints)||{};var inputConstraints={};inputConstraints.readOnly=_this.props.readOnly||String(prop.readOnly)==="true"||String(prop.enabled)==="false"||fieldConstraints.readOnly===true||disabled;inputConstraints.required=!inputConstraints.readOnly&&(String(prop.required)==="true"||String(fieldConstraints.required)==="true");inputConstraints.placeholder=prop.placeholderText||fieldConstraints.placeholder||"";var fontProps=prop.font||{};var fontStyle={fontWeight:String(fontProps.bold)==="true"?"bold":"normal",fontStyle:String(fontProps.italic)==="true"?"italic":"normal",textDecoration:[String(fontProps.underline)==="true"?"underline":"",String(fontProps.strikeout)==="true"?"line-through":""].join(" "),fontSize:Math.round((fontProps.pointsize||9)/9*100)+"%",textAlign:"left"};if(prop.alignment){if(prop.alignment.includes("Qt::AlignRight")){fontStyle.textAlign="right"}else if(prop.alignment.includes("Qt::AlignCenter")){fontStyle.textAlign="center"}}var elname=undefined;if(widget.name.startsWith("ext__")){updateField=null;value=_this.state.formData.externalFields[widget.name.slice(5)];inputConstraints.readOnly=true}else{elname=nametransform(widget.name)}if(widget["class"]==="QLabel"){if(widget.name.startsWith("img__")){var _widget$name$split$;value=(_widget$name$split$=(feature.properties||[])[widget.name.split("__")[1]])!==null&&_widget$name$split$!==void 0?_widget$name$split$:widget.property.text;return/*#__PURE__*/React.createElement("div",{className:"qt-designer-form-image"},/*#__PURE__*/React.createElement("a",{href:value,rel:"noreferrer",target:"_blank"},/*#__PURE__*/React.createElement("img",{src:value})))}else{var text=widget.name.startsWith("ext__")?value:widget.property.text;return/*#__PURE__*/React.createElement("div",{style:fontStyle},text)}}else if(widget["class"]==="Line"){var _widget$property;var linetype=((_widget$property=widget.property)===null||_widget$property===void 0?void 0:_widget$property.orientation)==="Qt::Vertical"?"vline":"hline";return/*#__PURE__*/React.createElement("div",{className:"qt-designer-form-"+linetype})}else if(widget["class"]==="QFrame"){if(widget.property.visibilityExpression){var exprResult=parseExpression(widget.property.visibilityExpression,feature,dataset,_this.props.iface,_this.props.mapPrefix,_this.props.mapCrs,function(){return _this.setState({reevaluate:+new Date})});if(exprResult===false||exprResult===0){return null}}return/*#__PURE__*/React.createElement("div",{className:"qt-designer-form-container"},/*#__PURE__*/React.createElement("div",{className:"qt-designer-form-frame"},widget.name.startsWith("nrel__")?_this.renderNRelation(widget):_this.renderLayout(widget.layout,feature,dataset,updateField,nametransform)))}else if(widget["class"]==="QGroupBox"){if(widget.property.visibilityExpression){var _exprResult=parseExpression(widget.property.visibilityExpression,feature,dataset,_this.props.iface,_this.props.mapPrefix,_this.props.mapCrs,function(){return _this.setState({reevaluate:+new Date})});if(_exprResult===false||_exprResult===0){return null}}return/*#__PURE__*/React.createElement("div",{className:"qt-designer-form-container"},/*#__PURE__*/React.createElement("div",{className:"qt-designer-form-frame-title",style:fontStyle},prop.title),/*#__PURE__*/React.createElement("div",{className:"qt-designer-form-frame"},widget.name.startsWith("nrel__")?_this.renderNRelation(widget):_this.renderLayout(widget.layout,feature,dataset,updateField,nametransform)))}else if(widget["class"]==="QTabWidget"){
|
|
19
|
+
}});var fit="fit-content("+Math.round(1/rows.length*100)+"%)";for(var row=0;row<rows.length;++row){rows[row]=rows[row]||fit}return rows});_defineProperty(_this,"renderWidget",function(widget,feature,dataset,updateField){var _widget$name,_this$props$fields$wi;var nametransform=arguments.length>4&&arguments[4]!==undefined?arguments[4]:function(name){return name};var disabled=arguments.length>5&&arguments[5]!==undefined?arguments[5]:false;var value=(_widget$name=(feature.properties||{})[widget.name])!==null&&_widget$name!==void 0?_widget$name:"";var prop=widget.property||{};if(String(prop.visible)==="false"){return null}var attr=widget.attribute||{};var fieldConstraints=((_this$props$fields$wi=_this.props.fields[widget.name])===null||_this$props$fields$wi===void 0?void 0:_this$props$fields$wi.constraints)||{};var inputConstraints={};inputConstraints.readOnly=_this.props.readOnly||String(prop.readOnly)==="true"||String(prop.enabled)==="false"||fieldConstraints.readOnly===true||disabled;inputConstraints.required=!inputConstraints.readOnly&&(String(prop.required)==="true"||String(fieldConstraints.required)==="true");inputConstraints.placeholder=prop.placeholderText||fieldConstraints.placeholder||"";var fontProps=prop.font||{};var fontStyle={fontWeight:String(fontProps.bold)==="true"?"bold":"normal",fontStyle:String(fontProps.italic)==="true"?"italic":"normal",textDecoration:[String(fontProps.underline)==="true"?"underline":"",String(fontProps.strikeout)==="true"?"line-through":""].join(" "),fontSize:Math.round((fontProps.pointsize||9)/9*100)+"%",textAlign:"left"};if(prop.alignment){if(prop.alignment.includes("Qt::AlignRight")){fontStyle.textAlign="right"}else if(prop.alignment.includes("Qt::AlignCenter")){fontStyle.textAlign="center"}}var elname=undefined;if(widget.name.startsWith("ext__")){updateField=null;value=_this.state.formData.externalFields[widget.name.slice(5)];inputConstraints.readOnly=true}else{elname=nametransform(widget.name)}if(widget["class"]==="QLabel"){if(widget.name.startsWith("img__")){var _widget$name$split$;value=(_widget$name$split$=(feature.properties||[])[widget.name.split("__")[1]])!==null&&_widget$name$split$!==void 0?_widget$name$split$:widget.property.text;return/*#__PURE__*/React.createElement("div",{className:"qt-designer-form-image"},/*#__PURE__*/React.createElement("a",{href:value,rel:"noreferrer",target:"_blank"},/*#__PURE__*/React.createElement("img",{src:value})))}else{var text=widget.name.startsWith("ext__")?value:widget.property.text;return/*#__PURE__*/React.createElement("div",{style:fontStyle},text)}}else if(widget["class"]==="Line"){var _widget$property;var linetype=((_widget$property=widget.property)===null||_widget$property===void 0?void 0:_widget$property.orientation)==="Qt::Vertical"?"vline":"hline";return/*#__PURE__*/React.createElement("div",{className:"qt-designer-form-"+linetype})}else if(widget["class"]==="QFrame"){if(widget.property.visibilityExpression){var exprResult=parseExpression(widget.property.visibilityExpression,feature,dataset,_this.props.iface,_this.props.mapPrefix,_this.props.mapCrs,function(){return _this.setState({reevaluate:+new Date})});if(exprResult===false||exprResult===0){return null}}return/*#__PURE__*/React.createElement("div",{className:"qt-designer-form-container"},/*#__PURE__*/React.createElement("div",{className:"qt-designer-form-frame"},widget.name.startsWith("nrel__")?_this.renderNRelation(widget):_this.renderLayout(widget.layout,feature,dataset,updateField,nametransform)))}else if(widget["class"]==="QGroupBox"){if(widget.property.visibilityExpression){var _exprResult=parseExpression(widget.property.visibilityExpression,feature,dataset,_this.props.iface,_this.props.mapPrefix,_this.props.mapCrs,function(){return _this.setState({reevaluate:+new Date})});if(_exprResult===false||_exprResult===0){return null}}return/*#__PURE__*/React.createElement("div",{className:"qt-designer-form-container"},/*#__PURE__*/React.createElement("div",{className:"qt-designer-form-frame-title",style:fontStyle},prop.title),/*#__PURE__*/React.createElement("div",{className:"qt-designer-form-frame"},widget.name.startsWith("nrel__")?_this.renderNRelation(widget):_this.renderLayout(widget.layout,feature,dataset,updateField,nametransform)))}else if(widget["class"]==="QTabWidget"){var tabwidgets=(widget.widget||[]).filter(function(child){var exprResult=parseExpression(child.property.visibilityExpression,feature,dataset,_this.props.iface,_this.props.mapPrefix,_this.props.mapCrs,function(){return _this.setState({reevaluate:+new Date})});return exprResult!==false&&exprResult!==0});if(isEmpty(tabwidgets)){return null}var activetab=_this.state.activetabs[widget.name]||tabwidgets[0].name;var tabs=tabwidgets.map(function(tab){return{key:tab.name,label:tab.attribute.title}});return/*#__PURE__*/React.createElement("div",{className:"qt-designer-form-container"},/*#__PURE__*/React.createElement(ButtonBar,{active:activetab,buttons:tabs,className:"qt-designer-form-tabbar",onClick:function onClick(key){return _this.setState(function(state){return{activetabs:_objectSpread(_objectSpread({},state.activetabs),{},_defineProperty({},widget.name,key))}})}}),/*#__PURE__*/React.createElement("div",{className:"qt-designer-form-frame"},tabwidgets.filter(function(child){return child.layout}).map(function(child){return _this.renderLayout(child.layout,feature,dataset,updateField,nametransform,child.name===activetab)})))}else if(widget["class"]==="QTextEdit"||widget["class"]==="QTextBrowser"||widget["class"]==="QPlainTextEdit"){var _feature$properties$w,_feature$properties;if(((_feature$properties$w=(_feature$properties=feature.properties)===null||_feature$properties===void 0?void 0:_feature$properties[widget.name])!==null&&_feature$properties$w!==void 0?_feature$properties$w:null)===null){var _ConfigUtils$getConfi;value=(_ConfigUtils$getConfi=ConfigUtils.getConfigProp("editTextNullValue"))!==null&&_ConfigUtils$getConfi!==void 0?_ConfigUtils$getConfi:""}if(_this.props.report){return/*#__PURE__*/React.createElement("div",{className:"qt-designer-form-textarea"},value)}else{var addLinkAnchors=ConfigUtils.getConfigProp("editingAddLinkAnchors")!==false;return/*#__PURE__*/React.createElement(TextInput,_extends({addLinkAnchors:addLinkAnchors,multiline:true,name:elname,onChange:function onChange(val){return updateField(widget.name,val)}},inputConstraints,{style:fontStyle,value:String(value)}))}}else if(widget["class"]==="QLineEdit"){if(widget.name.endsWith("__upload")){var _feature$properties2;var fieldId=widget.name.replace(/__upload/,"");var uploadValue=((_feature$properties2=feature.properties)===null||_feature$properties2===void 0?void 0:_feature$properties2[fieldId])||"";var uploadElName=elname.replace(/__upload/,"");var constraints={accept:prop.text||"",required:inputConstraints.required};return/*#__PURE__*/React.createElement(EditUploadField,{constraints:constraints,dataset:dataset,disabled:inputConstraints.readOnly,fieldId:fieldId,iface:_this.props.iface,name:uploadElName,report:_this.props.report,updateField:updateField,value:uploadValue})}else{var _feature$properties$w2,_feature$properties3;if(fieldConstraints.prec!==undefined&&typeof value==="number"){value=value.toFixed(fieldConstraints.prec)}else if(((_feature$properties$w2=(_feature$properties3=feature.properties)===null||_feature$properties3===void 0?void 0:_feature$properties3[widget.name])!==null&&_feature$properties$w2!==void 0?_feature$properties$w2:null)===null){var _ConfigUtils$getConfi2;value=(_ConfigUtils$getConfi2=ConfigUtils.getConfigProp("editTextNullValue"))!==null&&_ConfigUtils$getConfi2!==void 0?_ConfigUtils$getConfi2:""}if(_this.props.report){return/*#__PURE__*/React.createElement("div",{style:fontStyle},value||inputConstraints.placeholder)}else{var _addLinkAnchors=ConfigUtils.getConfigProp("editingAddLinkAnchors")!==false;var editTextNullValue=ConfigUtils.getConfigProp("editTextNullValue");return/*#__PURE__*/React.createElement(TextInput,_extends({addLinkAnchors:_addLinkAnchors,clearValue:editTextNullValue,name:elname,onChange:function onChange(val){return updateField(widget.name,val)}},inputConstraints,{style:fontStyle,value:String(value)}))}}}else if(widget["class"]==="QCheckBox"||widget["class"]==="QRadioButton"){var _this$props$feature$p;var type=widget["class"]==="QCheckBox"?"checkbox":"radio";var inGroup=attr.buttonGroup;var checked=inGroup?((_this$props$feature$p=_this.props.feature.properties)===null||_this$props$feature$p===void 0?void 0:_this$props$feature$p[_this.groupOrName(widget)])===widget.name:value;return/*#__PURE__*/React.createElement("label",{style:fontStyle},/*#__PURE__*/React.createElement("input",_extends({checked:checked,disabled:inputConstraints.readOnly,name:nametransform(_this.groupOrName(widget)),onChange:function onChange(ev){return updateField(_this.groupOrName(widget),inGroup?widget.name:ev.target.checked)}},inputConstraints,{type:type,value:widget.name})),widget.property.text)}else if(widget["class"]==="QComboBox"){var parts=widget.name.split("__");if((parts.length===5||parts.length===6)&&parts[0]==="kvrel"){var _fieldId2,_this$props$editConfi,_this$props$editConfi2;// kvrel__attrname__datatable__keyfield__valuefield
|
|
20
20
|
// kvrel__reltablename__attrname__datatable__keyfield__valuefield
|
|
21
21
|
var count=parts.length;var isRelAttr=count===6;var attrname=parts[isRelAttr?2:1];var _fieldId=parts.slice(1,count-3).join("__");value=(_fieldId2=(feature.properties||[])[_fieldId])!==null&&_fieldId2!==void 0?_fieldId2:"";var keyvalrel=_this.props.mapPrefix+parts[count-3]+":"+parts[count-2]+":"+parts[count-1];var filterExpr=null;var field=isRelAttr?(_this$props$editConfi=_this.props.editConfig[parts[1]])===null||_this$props$editConfi===void 0||(_this$props$editConfi=_this$props$editConfi.fields)===null||_this$props$editConfi===void 0||(_this$props$editConfi2=_this$props$editConfi.find)===null||_this$props$editConfi2===void 0?void 0:_this$props$editConfi2.call(_this$props$editConfi,function(f){return f.id===attrname}):_this.props.fields[_fieldId];var comboFieldConstraints=(field===null||field===void 0?void 0:field.constraints)||{};if(field!==null&&field!==void 0&&field.filterExpression){filterExpr=parseExpression(field.filterExpression,feature,dataset,_this.props.iface,_this.props.mapPrefix,_this.props.mapCrs,function(){return _this.setState({reevaluate:+new Date})},true)}return/*#__PURE__*/React.createElement(EditComboField,{editIface:_this.props.iface,fieldId:_fieldId,filterExpr:filterExpr,key:_fieldId,keyvalrel:keyvalrel,multiSelect:widget.allowMulti==="true",name:nametransform(_fieldId),placeholder:inputConstraints.placeholder,readOnly:inputConstraints.readOnly||comboFieldConstraints.readOnly,required:inputConstraints.required||comboFieldConstraints.required,style:fontStyle,updateField:updateField,value:value})}else{var values=MiscUtils.ensureArray(widget.item||[]).map(function(item){var _item$property$value;return{label:item.property.text,value:(_item$property$value=item.property.value)!==null&&_item$property$value!==void 0?_item$property$value:item.property.text}});return/*#__PURE__*/React.createElement(EditComboField,{editIface:_this.props.iface,fieldId:widget.name,key:widget.name,name:elname,placeholder:inputConstraints.placeholder,readOnly:inputConstraints.readOnly||inputConstraints.readOnly,required:inputConstraints.required||inputConstraints.required,style:fontStyle,updateField:updateField,value:value,values:values})}}else if(widget["class"]==="QSpinBox"||widget["class"]==="QDoubleSpinBox"||widget["class"]==="QSlider"){var _prop$minimum,_prop$maximum,_ref,_prop$singleStep,_prop$decimals;var floatConstraint=function floatConstraint(x){var f=parseFloat(x);return isNaN(f)?undefined:f};var min=floatConstraint((_prop$minimum=prop.minimum)!==null&&_prop$minimum!==void 0?_prop$minimum:fieldConstraints.min);var max=floatConstraint((_prop$maximum=prop.maximum)!==null&&_prop$maximum!==void 0?_prop$maximum:fieldConstraints.max);var step=(_ref=(_prop$singleStep=prop.singleStep)!==null&&_prop$singleStep!==void 0?_prop$singleStep:fieldConstraints.step)!==null&&_ref!==void 0?_ref:1;var precision=(_prop$decimals=prop.decimals)!==null&&_prop$decimals!==void 0?_prop$decimals:0;if(widget["class"]==="QSlider"){return/*#__PURE__*/React.createElement("input",_extends({max:max,min:min,name:elname,onChange:function onChange(ev){return updateField(widget.name,ev.target.value)}},inputConstraints,{size:5,step:step,style:fontStyle,type:"range",value:value}))}else{var _feature$properties$w3,_feature$properties4;value=(_feature$properties$w3=(_feature$properties4=feature.properties)===null||_feature$properties4===void 0?void 0:_feature$properties4[widget.name])!==null&&_feature$properties$w3!==void 0?_feature$properties$w3:null;return/*#__PURE__*/React.createElement(NumberInput,_extends({decimals:precision,max:max,min:min,name:elname,onChange:function onChange(val){return updateField(widget.name,val)}},inputConstraints,{step:step,style:fontStyle,value:value}))}}else if(widget["class"]==="QDateEdit"){var _min=prop.minimumDate?_this.dateConstraint(prop.minimumDate):"1600-01-01";var _max=prop.maximumDate?_this.dateConstraint(prop.maximumDate):"9999-12-31";return/*#__PURE__*/React.createElement("input",_extends({max:_max,min:_min,name:elname,onChange:function onChange(ev){return updateField(widget.name,ev.target.value)}},inputConstraints,{style:fontStyle,type:"date",value:value}))}else if(widget["class"]==="QTimeEdit"){return/*#__PURE__*/React.createElement("input",_extends({name:elname,onChange:function onChange(ev){return updateField(widget.name,ev.target.value)}},inputConstraints,{style:fontStyle,type:"time",value:value}))}else if(widget["class"]==="QDateTimeEdit"){var _min2=prop.minimumDate?_this.dateConstraint(prop.minimumDate):"1600-01-01";var _max2=prop.maximumDate?_this.dateConstraint(prop.maximumDate):"9999-12-31";return/*#__PURE__*/React.createElement(DateTimeInput,{maxDate:_max2,minDate:_min2,name:elname,onChange:function onChange(val){return updateField(widget.name,val)},readOnly:inputConstraints.readOnly,required:inputConstraints.required,style:fontStyle,value:value})}else if(widget["class"]==="QWidget"){if(widget.name.startsWith("nrel__")){return _this.renderNRelation(widget)}else if(widget.name.startsWith("ext__")){return value}else{return _this.renderLayout(widget.layout,feature,dataset,updateField,nametransform)}}else if(widget["class"]==="QPushButton"){if(widget.name.startsWith("btn__")&&widget.onClick){return/*#__PURE__*/React.createElement("button",{className:"button",disabled:inputConstraints.readOnly,onClick:function onClick(){return widget.onClick(_this.props.setFormBusy)},type:"button"},widget.property.text)}else if(widget.name.startsWith("featurelink__")){var _parts=widget.name.split("__");// featurelink__layer__attrname
|
|
22
22
|
// featurelink__layer__reltable__attrname
|
|
@@ -5,7 +5,7 @@ function _typeof(o){"@babel/helpers - typeof";return _typeof="function"==typeof
|
|
|
5
5
|
* This source code is licensed under the BSD-style license found in the
|
|
6
6
|
* LICENSE file in the root directory of this source tree.
|
|
7
7
|
*/import React from"react";import{connect}from"react-redux";import axios from"axios";import isEmpty from"lodash.isempty";import PropTypes from"prop-types";import{BufferGeometry,Float32BufferAttribute,Mesh,MeshStandardMaterial,Raycaster,Vector2}from"three";import LocaleUtils from"../../utils/LocaleUtils";import ResizeableWindow from"../ResizeableWindow";import"../style/IdentifyViewer.css";var Identify3D=/*#__PURE__*/function(_React$Component){function Identify3D(){var _this;_classCallCheck(this,Identify3D);for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key]}_this=_callSuper(this,Identify3D,[].concat(args));_defineProperty(_this,"state",{pickAttrs:null});_defineProperty(_this,"clear",function(){_this.setState({pickAttrs:null});_this.props.sceneContext.removeSceneObject("__identify3d_highlight")});_defineProperty(_this,"identifyOnRelease",function(ev){if(ev.button!==0){return}ev.view.addEventListener("pointerup",_this.identify,{once:true});ev.view.addEventListener("pointermove",function(){ev.view.removeEventListener("pointerup",_this.identify)},{once:true})});_defineProperty(_this,"identify",function(ev){if(_this.props.identifyEnabled!==true){return}_this.clear();// Setup raycaster
|
|
8
|
-
var raycaster=new Raycaster;raycaster.firstHitOnly=true;var camera=_this.props.sceneContext.scene.view.camera;var rect=ev.target.getBoundingClientRect();var x=(ev.clientX-rect.left)/rect.width*2-1;var y=-((ev.clientY-rect.top)/rect.height)*2+1;raycaster.setFromCamera(new Vector2(x,y),camera);var picks=[];Object.entries(_this.props.sceneContext.sceneObjects).forEach(function(_ref){var _object$tiles;var _ref2=_slicedToArray(_ref,2),objId=_ref2[0],options=_ref2[1];if(!options.layertree||!options.visibility){return}var object=_this.props.sceneContext.getSceneObject(objId);if((_object$tiles=object.tiles)!==null&&_object$tiles!==void 0&&_object$tiles.raycast){var intersections=[];object.tiles.raycast(raycaster,intersections);intersections.forEach(function(entry){entry.isTilePick=true});picks.push.apply(picks,intersections)}else{picks.push.apply(picks,_toConsumableArray(raycaster.intersectObjects([object],true)))}});picks.sort(function(a,b){return a.distance-b.distance});if(isEmpty(picks)){return}else if(picks[0].isTilePick){_this.identifyTilePick(picks[0])}else{_this.identifyObjectPick(picks[0])}});_defineProperty(_this,"identifyTilePick",function(pick){var batchidAttr=pick.object.geometry.getAttribute("_batchid");var posAttr=pick.object.geometry.getAttribute("position");var norAttr=pick.object.geometry.getAttribute("normal");var pickBatchId=batchidAttr.getX(pick.face.a);// Extract batch geometry
|
|
8
|
+
var raycaster=new Raycaster;raycaster.firstHitOnly=true;var camera=_this.props.sceneContext.scene.view.camera;var rect=ev.target.getBoundingClientRect();var x=(ev.clientX-rect.left)/rect.width*2-1;var y=-((ev.clientY-rect.top)/rect.height)*2+1;raycaster.setFromCamera(new Vector2(x,y),camera);var picks=[];Object.entries(_this.props.sceneContext.sceneObjects).forEach(function(_ref){var _object$tiles;var _ref2=_slicedToArray(_ref,2),objId=_ref2[0],options=_ref2[1];if(!options.layertree||!options.visibility){return}var object=_this.props.sceneContext.getSceneObject(objId);if((_object$tiles=object.tiles)!==null&&_object$tiles!==void 0&&_object$tiles.raycast){var intersections=[];object.tiles.raycast(raycaster,intersections);intersections.forEach(function(entry){entry.isTilePick=true});picks.push.apply(picks,intersections)}else{picks.push.apply(picks,_toConsumableArray(raycaster.intersectObjects([object],true)))}});picks.sort(function(a,b){return a.distance-b.distance});if(isEmpty(picks)){return}else if(picks[0].isTilePick){_this.identifyTilePick(picks[0])}else{_this.identifyObjectPick(picks[0])}});_defineProperty(_this,"identifyTilePick",function(pick){var batchidAttr=pick.object.geometry.getAttribute("_batchid");if(!batchidAttr){return}var posAttr=pick.object.geometry.getAttribute("position");var norAttr=pick.object.geometry.getAttribute("normal");var pickBatchId=batchidAttr.getX(pick.face.a);// Extract batch geometry
|
|
9
9
|
var pickPosition=[];var pickNormal=[];batchidAttr.array.forEach(function(batchId,idx){if(batchId===pickBatchId){pickPosition.push.apply(pickPosition,_toConsumableArray(posAttr.array.slice(3*idx,3*idx+3)));pickNormal.push.apply(pickNormal,_toConsumableArray(norAttr.array.slice(3*idx,3*idx+3)))}});// Add selection object
|
|
10
10
|
_this.addHiglightGeometry(pick.object.matrixWorld,pickPosition,pickNormal);// Extract attributes from batch table and set pick attrs
|
|
11
11
|
var batchTableObject=pick.object;while(!batchTableObject.batchTable){batchTableObject=batchTableObject.parent}var batchTable=batchTableObject.batchTable;var batchAttrs=batchTable.getDataFromId(pickBatchId);if(_this.props.sceneContext.options.tileInfoServiceUrl){var url=_this.props.sceneContext.options.tileInfoServiceUrl.replace("{tileset}",batchTableObject.userData.tilesetName).replace("{objectid}",batchAttrs[batchTableObject.userData.batchIdAttr]);axios.get(url).then(function(response){_this.setState({pickAttrs:_objectSpread(_objectSpread({},batchAttrs),response.data)})})["catch"](function(){_this.setState({pickAttrs:batchAttrs})})}else{_this.setState({pickAttrs:batchAttrs})}});_defineProperty(_this,"identifyObjectPick",function(pick){var posAttr=pick.object.geometry.getAttribute("position");var norAttr=pick.object.geometry.getAttribute("normal");var index=pick.object.geometry.getIndex();// Add selection object
|
|
@@ -4,4 +4,4 @@ function _typeof(o){"@babel/helpers - typeof";return _typeof="function"==typeof
|
|
|
4
4
|
*
|
|
5
5
|
* This source code is licensed under the BSD-style license found in the
|
|
6
6
|
* LICENSE file in the root directory of this source tree.
|
|
7
|
-
*/import React from"react";import{connect}from"react-redux";import axios from"axios";import PropTypes from"prop-types";import{v1 as uuidv1}from"uuid";import{processStarted,processFinished}from"../../actions/processNotifications";import ConfigUtils from"../../utils/ConfigUtils";import LocaleUtils from"../../utils/LocaleUtils";import FileSelector from"../widgets/FileSelector";import Spinner from"../widgets/Spinner";import{importGltf}from"./utils/MiscUtils3D";import"./style/ImportObjects3D.css";var ImportObjects3D=/*#__PURE__*/function(_React$Component){function ImportObjects3D(){var _this;_classCallCheck(this,ImportObjects3D);for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key]}_this=_callSuper(this,ImportObjects3D,[].concat(args));_defineProperty(_this,"state",{importing:false,selectedfile:null});_defineProperty(_this,"importFile",function(){if(!_this.state.selectedfile){return}var file=_this.state.selectedfile;var taskid=uuidv1();_this.setState({importing:true});_this.props.processStarted(taskid,LocaleUtils.tr("import3d.importing",file.name));if(file.name.endsWith(".gltf")){_this.importGltf(file,taskid)}else{_this.importTo3DTiles(file,taskid)}});_defineProperty(_this,"importGltf",function(file,taskid){var reader=new FileReader;reader.onload=function(ev){importGltf(ev.target.result,file.name,_this.props.sceneContext,{drawGroup:true,imported:true});_this.setState({selectedfile:null,importing:false});_this.props.processFinished(taskid,true)};reader.onerror=function(){_this.setState({selectedfile:null,importing:false});_this.props.processFinished(taskid,false)};reader.readAsArrayBuffer(_this.state.selectedfile)});_defineProperty(_this,"importTo3DTiles",function(file,taskid){var target=_this.props.sceneContext.scene.view.controls.target;var formData=new FormData;var jsonBlob=new Blob([JSON.stringify({inputs:[String(target.x),String(target.y),String(
|
|
7
|
+
*/import React from"react";import{connect}from"react-redux";import axios from"axios";import PropTypes from"prop-types";import{v1 as uuidv1}from"uuid";import{processStarted,processFinished}from"../../actions/processNotifications";import ConfigUtils from"../../utils/ConfigUtils";import LocaleUtils from"../../utils/LocaleUtils";import FileSelector from"../widgets/FileSelector";import Spinner from"../widgets/Spinner";import{importGltf}from"./utils/MiscUtils3D";import"./style/ImportObjects3D.css";var ImportObjects3D=/*#__PURE__*/function(_React$Component){function ImportObjects3D(){var _this;_classCallCheck(this,ImportObjects3D);for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key]}_this=_callSuper(this,ImportObjects3D,[].concat(args));_defineProperty(_this,"state",{importing:false,selectedfile:null});_defineProperty(_this,"importFile",function(){if(!_this.state.selectedfile){return}var file=_this.state.selectedfile;var taskid=uuidv1();_this.setState({importing:true});_this.props.processStarted(taskid,LocaleUtils.tr("import3d.importing",file.name));if(file.name.endsWith(".gltf")){_this.importGltf(file,taskid)}else{_this.importTo3DTiles(file,taskid)}});_defineProperty(_this,"importGltf",function(file,taskid){var reader=new FileReader;reader.onload=function(ev){importGltf(ev.target.result,file.name,_this.props.sceneContext,{drawGroup:true,imported:true});_this.setState({selectedfile:null,importing:false});_this.props.processFinished(taskid,true)};reader.onerror=function(){_this.setState({selectedfile:null,importing:false});_this.props.processFinished(taskid,false)};reader.readAsArrayBuffer(_this.state.selectedfile)});_defineProperty(_this,"importTo3DTiles",function(file,taskid){var target=_this.props.sceneContext.scene.view.controls.target;var height=_this.props.sceneContext.getTerrainHeightFromMap([target.x,target.y]);var formData=new FormData;var jsonBlob=new Blob([JSON.stringify({inputs:[String(target.x),String(target.y),String(height),_this.props.sceneContext.mapCrs]})],{type:"application/json"});formData.set("json",jsonBlob);formData.set("file",file);var headers={"Content-Type":"multipart/form-data"};var ogcProcessesUrl=ConfigUtils.getConfigProp("ogcProcessesUrl");if(!ogcProcessesUrl){_this.setState({selectedfile:null,importing:false});_this.props.processFinished(taskid,false,LocaleUtils.tr("import3d.noprocessesserver"));return}axios.post(ogcProcessesUrl.replace(/\/$/,"")+"/modelimport/execution_multipart",formData,{headers:headers}).then(function(response){var tilesetUrl=_this.props.sceneContext.options.importedTilesBaseUrl+response.data.result.value;_this.props.sceneContext.add3dTiles(tilesetUrl,taskid,{title:file.name},true);_this.setState({selectedfile:null,importing:false});_this.props.processFinished(taskid,true)})["catch"](function(err){_this.setState({selectedfile:null,importing:false});_this.props.processFinished(taskid,false)})});return _this}_inherits(ImportObjects3D,_React$Component);return _createClass(ImportObjects3D,[{key:"render",value:function render(){var _this2=this;return/*#__PURE__*/React.createElement("div",{className:"importobjects3d-widget"},/*#__PURE__*/React.createElement("div",null,/*#__PURE__*/React.createElement(FileSelector,{accept:".gltf,.ifc,.gml,.citygml,.cityjson,.gpkg",file:this.state.selectedfile,onFileSelected:function onFileSelected(file){return _this2.setState({selectedfile:file})},title:LocaleUtils.tr("layertree3d.supportedformats")})),/*#__PURE__*/React.createElement("div",null,/*#__PURE__*/React.createElement("button",{className:"button",disabled:this.state.selectedfile===null||this.state.importing,onClick:this.importFile,type:"button"},this.state.importing?/*#__PURE__*/React.createElement(Spinner,null):null,LocaleUtils.tr("layertree3d.import"))))}}])}(React.Component);_defineProperty(ImportObjects3D,"propTypes",{processFinished:PropTypes.func,processStarted:PropTypes.func,sceneContext:PropTypes.object});export default connect(function(state){return{}},{processFinished:processFinished,processStarted:processStarted})(ImportObjects3D);
|
|
@@ -4,4 +4,4 @@ function _typeof(o){"@babel/helpers - typeof";return _typeof="function"==typeof
|
|
|
4
4
|
*
|
|
5
5
|
* This source code is licensed under the BSD-style license found in the
|
|
6
6
|
* LICENSE file in the root directory of this source tree.
|
|
7
|
-
*/import React from"react";import{connect}from"react-redux";import classNames from"classnames";import isEmpty from"lodash.isempty";import PropTypes from"prop-types";import{
|
|
7
|
+
*/import React from"react";import{connect}from"react-redux";import classNames from"classnames";import isEmpty from"lodash.isempty";import PropTypes from"prop-types";import{setCurrentTask}from"../../actions/task";import LocaleUtils from"../../utils/LocaleUtils";import Icon from"../Icon";import SideBar from"../SideBar";import NumberInput from"../widgets/NumberInput";import ImportObjects3D from"./ImportObjects3D";import"./style/LayerTree3D.css";var LayerTree3D=/*#__PURE__*/function(_React$Component){function LayerTree3D(){var _this;_classCallCheck(this,LayerTree3D);for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key]}_this=_callSuper(this,LayerTree3D,[].concat(args));_defineProperty(_this,"state",{activestylemenu:null,activemenu:null,importvisible:false});_defineProperty(_this,"renderBody",function(){var sceneContext=_this.props.sceneContext;return/*#__PURE__*/React.createElement("div",null,/*#__PURE__*/React.createElement("div",{className:"layertree3d-layers"},/*#__PURE__*/React.createElement("div",{className:"layertree3d-section"},LocaleUtils.tr("layertree3d.objects")),Object.entries(sceneContext.sceneObjects).map(function(_ref){var _ref2=_slicedToArray(_ref,2),objectId=_ref2[0],entry=_ref2[1];return _this.renderLayerEntry(objectId,entry,sceneContext.updateSceneObject,true)}),/*#__PURE__*/React.createElement("div",{className:"layertree3d-section"},LocaleUtils.tr("layertree3d.layers")),Object.entries(sceneContext.colorLayers).map(function(_ref3){var _ref4=_slicedToArray(_ref3,2),layerId=_ref4[0],entry=_ref4[1];return _this.renderLayerEntry(layerId,entry,sceneContext.updateColorLayer,false)}),/*#__PURE__*/React.createElement("div",{className:"layertree3d-option",onClick:function onClick(){return _this.setState(function(state){return{importvisible:!state.importvisible}})}},/*#__PURE__*/React.createElement(Icon,{icon:_this.state.importvisible?"collapse":"expand"})," ",LocaleUtils.tr("layertree3d.importobjects"))),_this.state.importvisible?/*#__PURE__*/React.createElement(ImportObjects3D,{sceneContext:_this.props.sceneContext}):null)});_defineProperty(_this,"renderLayerEntry",function(entryId,entry,updateCallback,isObject){var _entry$title,_entry$title2;if(entry.layertree===false){return null}var classes=classNames({"layertree3d-item":true,"layertree3d-item-disabled":!entry.visibility});var styleMenuClasses=classNames({"layertree3d-item-menubutton":true,"layertree3d-item-menubutton-active":_this.state.activestylemenu===entryId});var optMenuClasses=classNames({"layertree3d-item-menubutton":true,"layertree3d-item-menubutton-active":_this.state.activemenu===entryId});return/*#__PURE__*/React.createElement("div",{className:"layertree3d-item-container",key:entryId},/*#__PURE__*/React.createElement("div",{className:classes},/*#__PURE__*/React.createElement(Icon,{className:"layertree3d-item-checkbox",icon:entry.visibility?"checked":"unchecked",onClick:function onClick(){return updateCallback(entryId,{visibility:!entry.visibility})}}),/*#__PURE__*/React.createElement("span",{className:"layertree3d-item-title",title:(_entry$title=entry.title)!==null&&_entry$title!==void 0?_entry$title:entryId},(_entry$title2=entry.title)!==null&&_entry$title2!==void 0?_entry$title2:entryId),Object.keys(entry.styles||{}).length>1?/*#__PURE__*/React.createElement(Icon,{className:styleMenuClasses,icon:"paint",onClick:function onClick(){return _this.layerStyleMenuToggled(entryId)}}):null,entry.drawGroup||entry.imported?/*#__PURE__*/React.createElement(Icon,{className:"layertree3d-item-remove",icon:"trash",onClick:function onClick(){return _this.props.sceneContext.removeSceneObject(entryId)}}):null,/*#__PURE__*/React.createElement(Icon,{className:optMenuClasses,icon:"cog",onClick:function onClick(){return _this.layerMenuToggled(entryId)}})),_this.state.activemenu===entryId?/*#__PURE__*/React.createElement("div",{className:"layertree3d-item-optionsmenu"},/*#__PURE__*/React.createElement("div",{className:"layertree3d-item-optionsmenu-row"},isObject?/*#__PURE__*/React.createElement(Icon,{icon:"zoom",onClick:function onClick(){return _this.props.sceneContext.zoomToObject(entryId)},title:LocaleUtils.tr("layertree3d.zoomtoobject")}):null,entry.imported?/*#__PURE__*/React.createElement(Icon,{icon:"draw",onClick:function onClick(){return _this.editObject(entryId)}}):null,/*#__PURE__*/React.createElement(Icon,{icon:"transparency"}),/*#__PURE__*/React.createElement("input",{className:"layertree3d-item-transparency-slider",max:"255",min:"0",onChange:function onChange(ev){return updateCallback(entryId,{opacity:parseInt(ev.target.value,10)})},step:"1",type:"range",value:entry.opacity})),entry.extrusionHeight!==undefined?/*#__PURE__*/React.createElement("div",{className:"layertree3d-item-optionsmenu-row"},/*#__PURE__*/React.createElement("span",null,"Extrude:"),/*#__PURE__*/React.createElement(React.Fragment,null,"\xA0"),/*#__PURE__*/React.createElement("select",{onChange:function onChange(ev){return updateCallback(entryId,{extrusionHeight:ev.target.value==="__value"?0:ev.target.value})},value:typeof entry.extrusionHeight==="string"?entry.extrusionHeight:"__value"},/*#__PURE__*/React.createElement("option",{value:"__value"},LocaleUtils.tr("layertree3d.customheight")),(entry.fields||[]).map(function(field){return/*#__PURE__*/React.createElement("option",{key:field,value:field},field)})),typeof entry.extrusionHeight!=="string"?/*#__PURE__*/React.createElement(NumberInput,{max:500,min:0,onChange:function onChange(h){return updateCallback(entryId,{extrusionHeight:h})},value:entry.extrusionHeight}):null):null):null,_this.state.activestylemenu===entryId?/*#__PURE__*/React.createElement("div",{className:"layertree3d-item-stylemenu"},Object.keys(entry.styles).map(function(name){return/*#__PURE__*/React.createElement("div",{key:name,onClick:function onClick(){return updateCallback(entryId,{style:name})}},/*#__PURE__*/React.createElement(Icon,{icon:entry.style===name?"radio_checked":"radio_unchecked"}),/*#__PURE__*/React.createElement("div",null,name))})):null,!isEmpty(entry.sublayers)?/*#__PURE__*/React.createElement("div",{className:"layertree3d-item-sublayers"},entry.sublayers.map(function(sublayer,idx){return _this.renderSublayer(sublayer,entryId,updateCallback,[idx],entry.visibility)})):null)});_defineProperty(_this,"renderSublayer",function(sublayer,entryId,updateCallback,path,parentVisible){var key=entryId+":"+path.join(":");var classes=classNames({"layertree3d-item":true,"layertree3d-item-disabled":!parentVisible||!sublayer.visibility});var optMenuClasses=classNames({"layertree3d-item-menubutton":true,"layertree3d-item-menubutton-active":_this.state.activemenu===key});return/*#__PURE__*/React.createElement("div",{className:"layertree3d-item-container",key:key},/*#__PURE__*/React.createElement("div",{className:classes},/*#__PURE__*/React.createElement(Icon,{className:"layertree3d-item-checkbox",icon:sublayer.visibility?"checked":"unchecked",onClick:function onClick(){return updateCallback(entryId,{visibility:!sublayer.visibility},path)},sublayer:"layertree3d-item-checkbox"}),/*#__PURE__*/React.createElement("span",{className:"layertree3d-item-title",title:sublayer.title},sublayer.title),/*#__PURE__*/React.createElement(Icon,{className:optMenuClasses,icon:"cog",onClick:function onClick(){return _this.layerMenuToggled(key)}})),_this.state.activemenu===key?/*#__PURE__*/React.createElement("div",{className:"layertree3d-item-optionsmenu"},/*#__PURE__*/React.createElement("div",{className:"layertree3d-item-optionsmenu-row"},/*#__PURE__*/React.createElement(Icon,{icon:"transparency"}),/*#__PURE__*/React.createElement("input",{className:"layertree3d-item-transparency-slider",max:"255",min:"0",onChange:function onChange(ev){return updateCallback(entryId,{opacity:parseInt(ev.target.value,10)},path)},step:"1",type:"range",value:sublayer.opacity}))):null,!isEmpty(sublayer.sublayers)?/*#__PURE__*/React.createElement("div",{className:"layertree3d-item-sublayers"},sublayer.sublayers.map(function(child,idx){return _this.renderSublayer(child,entryId,updateCallback,[].concat(_toConsumableArray(path),[idx]),parentVisible&&sublayer.visibility)})):null)});_defineProperty(_this,"layerStyleMenuToggled",function(entryId){_this.setState(function(state){return{activestylemenu:state.activestylemenu===entryId?null:entryId}})});_defineProperty(_this,"layerMenuToggled",function(entryId){_this.setState(function(state){return{activemenu:state.activemenu===entryId?null:entryId}})});_defineProperty(_this,"editObject",function(objectId){_this.props.sceneContext.zoomToObject(objectId);_this.props.setCurrentTask("EditDataset3D",null,null,{objectId:objectId})});return _this}_inherits(LayerTree3D,_React$Component);return _createClass(LayerTree3D,[{key:"render",value:function render(){var _this2=this;return/*#__PURE__*/React.createElement(SideBar,{icon:"layers",id:"LayerTree3D",title:LocaleUtils.tr("appmenu.items.LayerTree3D"),width:"20em"},function(){return{body:_this2.renderBody()}})}}])}(React.Component);_defineProperty(LayerTree3D,"propTypes",{sceneContext:PropTypes.object,setCurrentTask:PropTypes.func});export default connect(function(state){return{}},{setCurrentTask:setCurrentTask})(LayerTree3D);
|
|
@@ -4,12 +4,13 @@ function _typeof(o){"@babel/helpers - typeof";return _typeof="function"==typeof
|
|
|
4
4
|
*
|
|
5
5
|
* This source code is licensed under the BSD-style license found in the
|
|
6
6
|
* LICENSE file in the root directory of this source tree.
|
|
7
|
-
*/import React from"react";import ReactDOM from"react-dom";import{connect}from"react-redux";import Instance from"@giro3d/giro3d/core/Instance.js";import Coordinates from"@giro3d/giro3d/core/geographic/Coordinates";import Extent from"@giro3d/giro3d/core/geographic/Extent.js";import ElevationLayer from"@giro3d/giro3d/core/layer/ElevationLayer.js";import FeatureCollection from"@giro3d/giro3d/entities/FeatureCollection.js";import Map from"@giro3d/giro3d/entities/Map.js";import Tiles3D from"@giro3d/giro3d/entities/Tiles3D.js";import Inspector from"@giro3d/giro3d/gui/Inspector.js";import GeoTIFFSource from"@giro3d/giro3d/sources/GeoTIFFSource.js";import axios from"axios";import{fromUrl}from"geotiff";import isEmpty from"lodash.isempty";import PropTypes from"prop-types";import{Vector2,CubeTextureLoader,Group,Raycaster,Mesh,Box3,Vector3,Matrix4}from"three";import{GLTFExporter}from"three/addons/exporters/GLTFExporter.js";import{GLTFLoader}from"three/addons/loaders/GLTFLoader";import{v4 as uuidv4}from"uuid";import{LayerRole}from"../../actions/layers";import{setCurrentTask}from"../../actions/task";import{BackgroundSwitcher}from"../../plugins/BackgroundSwitcher";import ConfigUtils from"../../utils/ConfigUtils";import CoordinatesUtils from"../../utils/CoordinatesUtils";import LayerUtils from"../../utils/LayerUtils";import MiscUtils from"../../utils/MiscUtils";import{registerPermalinkDataStoreHook,unregisterPermalinkDataStoreHook,UrlParams}from"../../utils/PermaLinkUtils";import{MapContainerPortalContext}from"../PluginsContainer";import BottomBar3D from"./BottomBar3D";import Compare3D from"./Compare3D";import Draw3D from"./Draw3D";import EditDataset3D from"./EditDataset3D";import ExportObjects3D from"./ExportObjects3D";import HideObjects3D from"./HideObjects3D";import Identify3D from"./Identify3D";import LayerTree3D from"./LayerTree3D";import Map3DLight from"./Map3DLight";import MapControls3D from"./MapControls3D";import MapExport3D from"./MapExport3D";import Measure3D from"./Measure3D";import OverviewMap3D from"./OverviewMap3D";import TopBar3D from"./TopBar3D";import View3DSwitcher from"./View3DSwitcher";import LayerRegistry from"./layers/index";import{importGltf,updateObjectLabel}from"./utils/MiscUtils3D";import Tiles3DStyle from"./utils/Tiles3DStyle";import"./style/Map3D.css"
|
|
7
|
+
*/import React from"react";import ReactDOM from"react-dom";import{connect}from"react-redux";import Instance from"@giro3d/giro3d/core/Instance.js";import Coordinates from"@giro3d/giro3d/core/geographic/Coordinates";import Extent from"@giro3d/giro3d/core/geographic/Extent.js";import ElevationLayer from"@giro3d/giro3d/core/layer/ElevationLayer.js";import FeatureCollection from"@giro3d/giro3d/entities/FeatureCollection.js";import Map from"@giro3d/giro3d/entities/Map.js";import Tiles3D from"@giro3d/giro3d/entities/Tiles3D.js";import Inspector from"@giro3d/giro3d/gui/Inspector.js";import GeoTIFFSource from"@giro3d/giro3d/sources/GeoTIFFSource.js";import axios from"axios";import{fromUrl}from"geotiff";import isEmpty from"lodash.isempty";import PropTypes from"prop-types";import{Vector2,CubeTextureLoader,Group,Raycaster,Mesh,Box3,Vector3,Matrix4}from"three";import{GLTFExporter}from"three/addons/exporters/GLTFExporter.js";import{GLTFLoader}from"three/addons/loaders/GLTFLoader";import{v4 as uuidv4}from"uuid";import{LayerRole}from"../../actions/layers";import{setCurrentTask}from"../../actions/task";import{BackgroundSwitcher}from"../../plugins/BackgroundSwitcher";import ConfigUtils from"../../utils/ConfigUtils";import CoordinatesUtils from"../../utils/CoordinatesUtils";import LayerUtils from"../../utils/LayerUtils";import MiscUtils from"../../utils/MiscUtils";import{registerPermalinkDataStoreHook,unregisterPermalinkDataStoreHook,UrlParams}from"../../utils/PermaLinkUtils";import{MapContainerPortalContext}from"../PluginsContainer";import BottomBar3D from"./BottomBar3D";import Compare3D from"./Compare3D";import Draw3D from"./Draw3D";import EditDataset3D from"./EditDataset3D";import ExportObjects3D from"./ExportObjects3D";import HideObjects3D from"./HideObjects3D";import Identify3D from"./Identify3D";import LayerTree3D from"./LayerTree3D";import Map3DLight from"./Map3DLight";import MapControls3D from"./MapControls3D";import MapExport3D from"./MapExport3D";import Measure3D from"./Measure3D";import OverviewMap3D from"./OverviewMap3D";import TopBar3D from"./TopBar3D";import View3DSwitcher from"./View3DSwitcher";import LayerRegistry from"./layers/index";import{importGltf,updateObjectLabel}from"./utils/MiscUtils3D";import Tiles3DStyle from"./utils/Tiles3DStyle";import"./style/Map3D.css";// Ensures unUnload is called *after* all other children have unmounted
|
|
8
|
+
var UnloadWrapper=/*#__PURE__*/function(_React$Component){function UnloadWrapper(){var _this;_classCallCheck(this,UnloadWrapper);for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key]}_this=_callSuper(this,UnloadWrapper,[].concat(args));_defineProperty(_this,"onUnload",function(el){if(!el){_this.props.onUnload(_this.props.sceneId)}});return _this}_inherits(UnloadWrapper,_React$Component);return _createClass(UnloadWrapper,[{key:"render",value:function render(){return/*#__PURE__*/React.createElement("div",null,this.props.children,/*#__PURE__*/React.createElement("span",{ref:this.onUnload}))}}])}(React.Component);_defineProperty(UnloadWrapper,"propTypes",{children:PropTypes.oneOfType([PropTypes.node,PropTypes.func]),onUnload:PropTypes.func,sceneId:PropTypes.string});var Map3D=/*#__PURE__*/function(_React$Component2){function Map3D(props){var _this2;_classCallCheck(this,Map3D);_this2=_callSuper(this,Map3D,[props]);_defineProperty(_this2,"state",{sceneContext:_objectSpread(_objectSpread({},Map3D.defaultSceneState),{},{addLayer:function addLayer(layer){},getLayer:function getLayer(layerId){},removeLayer:function removeLayer(layerId){},updateColorLayer:function updateColorLayer(layerId,options,path){},add3dTiles:function add3dTiles(url,options){},addSceneObject:function addSceneObject(objectId,object){var options=arguments.length>2&&arguments[2]!==undefined?arguments[2]:{}},getSceneObject:function getSceneObject(objectId){},removeSceneObject:function removeSceneObject(objectId){},updateSceneObject:function updateSceneObject(objectId,options){},zoomToObject:function zoomToObject(objectId){},getMap:function getMap(){},setViewToExtent:function setViewToExtent(bounds,angle){},getTerrainHeightFromDTM:function getTerrainHeightFromDTM(scenePos){},getTerrainHeightFromMap:function getTerrainHeightFromMap(scenePos){},getSceneIntersection:function getSceneIntersection(x,y,objects){}}),sceneId:null});_defineProperty(_this2,"applyBaseLayer",function(){var baseLayer=_this2.state.sceneContext.baseLayers.find(function(e){return e.visibility===true});_this2.removeLayer("__baselayer");if(!baseLayer){return}var layerCreator=LayerRegistry[baseLayer.type];if(layerCreator!==null&&layerCreator!==void 0&&layerCreator.create3d){var layer3d=layerCreator.create3d(baseLayer,_this2.state.sceneContext.mapCrs);_this2.addLayer("__baselayer",layer3d);_this2.map.insertLayerAfter(layer3d,null)}});_defineProperty(_this2,"setBaseLayer",function(layer,visibility){_this2.setState(function(state){return{sceneContext:_objectSpread(_objectSpread({},state.sceneContext),{},{baseLayers:state.sceneContext.baseLayers.map(function(entry){return _objectSpread(_objectSpread({},entry),{},{visibility:entry.name===layer.name?visibility:false})})})}});UrlParams.updateParams({bl3d:visibility?layer.name:""})});_defineProperty(_this2,"collectColorLayers",function(prevColorLayers){return _this2.props.layers.reduce(function(colorLayers,layer){var _prevOptions$visibili,_prevOptions$opacity,_prevOptions$extrusio,_prevOptions$fields;if(layer.role!==LayerRole.THEME&&layer.role!==LayerRole.USERLAYER){return colorLayers}var layerCreator=LayerRegistry[layer.type];if(!layerCreator||!layerCreator.create3d){return colorLayers}var prevOptions=prevColorLayers[layer.id];var _preserveSublayerOptions=function preserveSublayerOptions(entry,prevEntry){var _entry$sublayers,_entry$sublayers$map;return(_entry$sublayers=entry.sublayers)===null||_entry$sublayers===void 0||(_entry$sublayers$map=_entry$sublayers.map)===null||_entry$sublayers$map===void 0?void 0:_entry$sublayers$map.call(_entry$sublayers,function(child){var _prevEntry$sublayers,_prevEntry$sublayers$;var prevChild=prevEntry===null||prevEntry===void 0||(_prevEntry$sublayers=prevEntry.sublayers)===null||_prevEntry$sublayers===void 0||(_prevEntry$sublayers$=_prevEntry$sublayers.find)===null||_prevEntry$sublayers$===void 0?void 0:_prevEntry$sublayers$.call(_prevEntry$sublayers,function(x){return x.name===child.name});if((prevChild===null||prevChild===void 0?void 0:prevChild.name)===child.name){return _objectSpread(_objectSpread({},child),{},{visibility:prevChild.visibility,opacity:prevChild.opacity,sublayers:_preserveSublayerOptions(child,prevChild)})}else{return child}})};colorLayers[layer.id]=_objectSpread(_objectSpread({},layer),{},{visibility:(_prevOptions$visibili=prevOptions===null||prevOptions===void 0?void 0:prevOptions.visibility)!==null&&_prevOptions$visibili!==void 0?_prevOptions$visibili:false,opacity:(_prevOptions$opacity=prevOptions===null||prevOptions===void 0?void 0:prevOptions.opacity)!==null&&_prevOptions$opacity!==void 0?_prevOptions$opacity:255,extrusionHeight:(_prevOptions$extrusio=prevOptions===null||prevOptions===void 0?void 0:prevOptions.extrusionHeight)!==null&&_prevOptions$extrusio!==void 0?_prevOptions$extrusio:["vector","wfs"].includes(layer.type)?0:undefined,fields:(_prevOptions$fields=prevOptions===null||prevOptions===void 0?void 0:prevOptions.fields)!==null&&_prevOptions$fields!==void 0?_prevOptions$fields:undefined,sublayers:_preserveSublayerOptions(layer,prevOptions)});Object.assign(colorLayers[layer.id],LayerUtils.buildWMSLayerParams(colorLayers[layer.id]));if(colorLayers[layer.id].fields===undefined&&layerCreator.getFields){layerCreator.getFields(layer).then(function(fields){_this2.updateColorLayer(layer.id,{fields:fields})})}return colorLayers},{})});_defineProperty(_this2,"applyColorLayerUpdates",function(colorLayers,prevColorLayers){// Add-update new layers
|
|
8
9
|
var layerBelow=_this2.getLayer("__baselayer");Object.entries(colorLayers).reverse().forEach(function(_ref){var _ref2=_slicedToArray(_ref,2),layerId=_ref2[0],options=_ref2[1];var prevOptions=prevColorLayers[layerId];var layerCreator=LayerRegistry[options.type];var mapLayer=_this2.getLayer(layerId);if(mapLayer){layerCreator.update3d(mapLayer.source,options,prevOptions,_this2.state.sceneContext.mapCrs)}else{mapLayer=layerCreator.create3d(options,_this2.state.sceneContext.mapCrs);_this2.addLayer(layerId,mapLayer)}_this2.map.insertLayerAfter(mapLayer,layerBelow);mapLayer.visible=options.visibility;mapLayer.opacity=options.opacity/255;layerBelow=mapLayer;if(options.extrusionHeight!==0){_this2.createUpdateExtrudedLayer(mapLayer,options,options.features!==(prevOptions===null||prevOptions===void 0?void 0:prevOptions.features))}else if((prevOptions===null||prevOptions===void 0?void 0:prevOptions.extrusionHeight)!==0){_this2.removeExtrudedLayer(options.id)}});// Remove old layers
|
|
9
|
-
Object.entries(prevColorLayers).forEach(function(_ref3){var _ref4=_slicedToArray(_ref3,2),layerId=_ref4[0],options=_ref4[1];if(!(layerId in colorLayers)){if(options.extrusionHeight!==0){_this2.removeExtrudedLayer(options.id)}_this2.removeLayer(layerId)}});_this2.instance.notifyChange(_this2.map)});_defineProperty(_this2,"createUpdateExtrudedLayer",function(mapLayer,options){var _options$features,_options$features$red;var forceCreate=arguments.length>2&&arguments[2]!==undefined?arguments[2]:false;var bounds=options.bbox.bounds;var extent=new Extent(options.bbox.crs,bounds[0],bounds[2],bounds[1],bounds[3]);var objId=options.id+":extruded";var makeColor=function makeColor(c){if(Array.isArray(c)){return c[0]<<16|c[1]<<8|c[2]}else if(typeof c==="string"){return parseInt(c.replace("#",""),16)}else{return c}};var obj=_this2.objectMap[objId];if(!obj||forceCreate){var _options$color;if(obj){_this2.instance.remove(obj)}var layercolor=makeColor((_options$color=options.color)!==null&&_options$color!==void 0?_options$color:"#FF0000");obj=new FeatureCollection({source:mapLayer.source.source,extent:extent,minLevel:1,maxLevel:1,ignoreZ:true,elevation:function elevation(feature){var _this2$getTerrainHeig;var coordinates=feature.getGeometry().getCoordinates();while(Array.isArray(coordinates[0])){coordinates=coordinates[0]}return(_this2$getTerrainHeig=_this2.getTerrainHeightFromMap(coordinates))!==null&&_this2$getTerrainHeig!==void 0?_this2$getTerrainHeig:0},extrusionOffset:function extrusionOffset(feature){if(typeof obj.userData.extrusionHeight==="string"){return parseFloat(feature.getProperties()[obj.userData.extrusionHeight])||0}else{return obj.userData.extrusionHeight}},style:function style(feature){var _obj$userData$feature,_obj$userData$feature2;return(_obj$userData$feature=(_obj$userData$feature2=obj.userData.featureStyles)===null||_obj$userData$feature2===void 0?void 0:_obj$userData$feature2[feature.getId()])!==null&&_obj$userData$feature!==void 0?_obj$userData$feature:{fill:{color:layercolor,shading:true}}}});obj.castShadow=true;obj.receiveShadow=true;_this2.instance.add(obj);_this2.objectMap[objId]=obj}obj.userData.extrusionHeight=options.extrusionHeight;obj.userData.featureStyles=(_options$features=options.features)===null||_options$features===void 0||(_options$features$red=_options$features.reduce)===null||_options$features$red===void 0?void 0:_options$features$red.call(_options$features,function(res,feature){return _objectSpread(_objectSpread({},res),{},_defineProperty({},feature.id,{fill:{color:makeColor(feature.styleOptions.fillColor),shading:true}}))},{});obj.opacity=mapLayer.opacity;obj.visible=mapLayer.visible;obj.updateStyles()});_defineProperty(_this2,"removeExtrudedLayer",function(layerId){var objId=layerId+":extruded";if(_this2.objectMap[objId]){_this2.instance.remove(_this2.objectMap[objId]);delete _this2.objectMap[objId]}_this2.instance.notifyChange()});_defineProperty(_this2,"applySceneObjectUpdates",function(sceneObjects,prevSceneObjects){Object.entries(sceneObjects).forEach(function(_ref5){var _ref6=_slicedToArray(_ref5,2),objectId=_ref6[0],options=_ref6[1];var prevOptions=prevSceneObjects===null||prevSceneObjects===void 0?void 0:prevSceneObjects[objectId];var object=_this2.objectMap[objectId];if(options.opacity!==(prevOptions===null||prevOptions===void 0?void 0:prevOptions.opacity)||options.visibility!==(prevOptions===null||prevOptions===void 0?void 0:prevOptions.visibility)){object.visible=options.visibility&&options.opacity>0;if(object.opacity!==undefined){object.opacity=options.opacity/255}else{object.traverse(function(child){if(child instanceof Mesh){child.material.transparent=options.opacity<255;child.material.opacity=options.opacity/255;child.material.needsUpdate=true}})}_this2.instance.notifyChange(object)}if(options.style!==(prevOptions===null||prevOptions===void 0?void 0:prevOptions.style)){_this2.loadTilesetStyle(objectId,options)}if(options.tilesetStyle!==(prevOptions===null||prevOptions===void 0?void 0:prevOptions.tilesetStyle)){object.tiles.group.children.forEach(function(group){Tiles3DStyle.applyTileStyle(group,options)});_this2.instance.notifyChange(object)}})});_defineProperty(_this2,"addLayer",function(layerId,layer){layer.userData.layerId=layerId;_this2.map.addLayer(layer)});_defineProperty(_this2,"getLayer",function(layerId){var _this2$map$getLayers$;return(_this2$map$getLayers$=_this2.map.getLayers(function(l){return l.userData.layerId===layerId})[0])!==null&&_this2$map$getLayers$!==void 0?_this2$map$getLayers$:null});_defineProperty(_this2,"removeLayer",function(layerId){_this2.map.getLayers(function(l){return l.userData.layerId===layerId}).forEach(function(layer){_this2.map.removeLayer(layer,{dispose:true})})});_defineProperty(_this2,"updateColorLayer",function(layerId,options){var path=arguments.length>2&&arguments[2]!==undefined?arguments[2]:[];_this2.setState(function(state){var entry=_objectSpread({},state.sceneContext.colorLayers[layerId]);var subentry=entry;path.forEach(function(idx){subentry.sublayers=_toConsumableArray(subentry.sublayers);subentry.sublayers[idx]=_objectSpread({},subentry.sublayers[idx]);subentry=subentry.sublayers[idx]});Object.assign(subentry,options);Object.assign(entry,LayerUtils.buildWMSLayerParams(entry));return{sceneContext:_objectSpread(_objectSpread({},state.sceneContext),{},{colorLayers:_objectSpread(_objectSpread({},state.sceneContext.colorLayers),{},_defineProperty({},layerId,entry))})}})});_defineProperty(_this2,"add3dTiles",function(url,name){var options=arguments.length>2&&arguments[2]!==undefined?arguments[2]:{};var showEditTool=arguments.length>3&&arguments[3]!==undefined?arguments[3]:false;var matrix=arguments.length>4&&arguments[4]!==undefined?arguments[4]:null;var label=arguments.length>5&&arguments[5]!==undefined?arguments[5]:null;var tiles=new Tiles3D({url:MiscUtils.resolveAssetsPath(url)});// Recenter tile group
|
|
10
|
-
tiles.tiles.addEventListener("load-tile-set",function(_ref7){var tileSet=_ref7.tileSet;if(tileSet.root.parent===null){var bbox=new Box3;tiles.tiles.getBoundingBox(bbox);var center=bbox.getCenter(new Vector3);tiles.tiles.group.position.sub(center);if(matrix){tiles.tiles.group.parent.applyMatrix4(matrix)}else{tiles.tiles.group.parent.position.copy(center)}tiles.tiles.group.parent.updateMatrixWorld(true);if(label){tiles.tiles.group.parent.userData.label=label;updateObjectLabel(tiles.tiles.group.parent,_this2.state.sceneContext)}}_this2.instance.notifyChange(tiles);if(showEditTool){_this2.zoomToObject(name);_this2.props.setCurrentTask("EditDataset3D",null,null,{objectId:name})}});// Apply style when loading tile
|
|
11
|
-
tiles.tiles.addEventListener("load-model",function(_ref8){var scene=_ref8.scene;scene.userData.tilesetName=name;scene.userData.batchIdAttr="id";Tiles3DStyle.applyTileStyle(scene,_this2.state.sceneContext.sceneObjects[name],_this2.state.sceneContext)});// Show/hide labels when tile visibility changes
|
|
12
|
-
tiles.tiles.addEventListener("tile-visibility-change",function(_ref9){var scene=_ref9.scene,visible=_ref9.visible;Object.values(scene.userData.tileLabels||{}).forEach(function(
|
|
10
|
+
Object.entries(prevColorLayers).forEach(function(_ref3){var _ref4=_slicedToArray(_ref3,2),layerId=_ref4[0],options=_ref4[1];if(!(layerId in colorLayers)){if(options.extrusionHeight!==0){_this2.removeExtrudedLayer(options.id)}_this2.removeLayer(layerId)}});_this2.instance.notifyChange(_this2.map)});_defineProperty(_this2,"createUpdateExtrudedLayer",function(mapLayer,options){var _options$features,_options$features$red;var forceCreate=arguments.length>2&&arguments[2]!==undefined?arguments[2]:false;var bounds=options.bbox.bounds;var extent=new Extent(options.bbox.crs,bounds[0],bounds[2],bounds[1],bounds[3]);var objId=options.id+":extruded";var makeColor=function makeColor(c){if(Array.isArray(c)){return c[0]<<16|c[1]<<8|c[2]}else if(typeof c==="string"){return parseInt(c.replace("#",""),16)}else{return c}};var obj=_this2.objectMap[objId];if(!obj||forceCreate){var _options$color;if(obj){_this2.instance.remove(obj)}var layercolor=makeColor((_options$color=options.color)!==null&&_options$color!==void 0?_options$color:"#FF0000");obj=new FeatureCollection({source:mapLayer.source.source,extent:extent,minLevel:1,maxLevel:1,ignoreZ:true,elevation:function elevation(feature){var _this2$getTerrainHeig;var coordinates=feature.getGeometry().getCoordinates();while(Array.isArray(coordinates[0])){coordinates=coordinates[0]}return(_this2$getTerrainHeig=_this2.getTerrainHeightFromMap(coordinates))!==null&&_this2$getTerrainHeig!==void 0?_this2$getTerrainHeig:0},extrusionOffset:function extrusionOffset(feature){if(typeof obj.userData.extrusionHeight==="string"){return parseFloat(feature.getProperties()[obj.userData.extrusionHeight])||0}else{return obj.userData.extrusionHeight}},style:function style(feature){var _obj$userData$feature,_obj$userData$feature2;return(_obj$userData$feature=(_obj$userData$feature2=obj.userData.featureStyles)===null||_obj$userData$feature2===void 0?void 0:_obj$userData$feature2[feature.getId()])!==null&&_obj$userData$feature!==void 0?_obj$userData$feature:{fill:{color:layercolor,shading:true}}}});obj.castShadow=true;obj.receiveShadow=true;_this2.instance.add(obj);_this2.objectMap[objId]=obj}obj.userData.extrusionHeight=options.extrusionHeight;obj.userData.featureStyles=(_options$features=options.features)===null||_options$features===void 0||(_options$features$red=_options$features.reduce)===null||_options$features$red===void 0?void 0:_options$features$red.call(_options$features,function(res,feature){return _objectSpread(_objectSpread({},res),{},_defineProperty({},feature.id,{fill:{color:makeColor(feature.styleOptions.fillColor),shading:true}}))},{});obj.opacity=mapLayer.opacity;obj.visible=mapLayer.visible;obj.updateStyles()});_defineProperty(_this2,"removeExtrudedLayer",function(layerId){var objId=layerId+":extruded";if(_this2.objectMap[objId]){_this2.instance.remove(_this2.objectMap[objId]);delete _this2.objectMap[objId]}_this2.instance.notifyChange()});_defineProperty(_this2,"applySceneObjectUpdates",function(sceneObjects,prevSceneObjects){Object.entries(sceneObjects).forEach(function(_ref5){var _ref6=_slicedToArray(_ref5,2),objectId=_ref6[0],options=_ref6[1];var prevOptions=prevSceneObjects===null||prevSceneObjects===void 0?void 0:prevSceneObjects[objectId];var object=_this2.objectMap[objectId];if(options.opacity!==(prevOptions===null||prevOptions===void 0?void 0:prevOptions.opacity)||options.visibility!==(prevOptions===null||prevOptions===void 0?void 0:prevOptions.visibility)){object.visible=options.visibility&&options.opacity>0;if(object.opacity!==undefined){object.opacity=options.opacity/255}else{object.traverse(function(child){if(child instanceof Mesh){child.material.transparent=options.opacity<255;child.material.opacity=options.opacity/255;child.material.needsUpdate=true}})}_this2.instance.notifyChange(object)}if(options.style!==(prevOptions===null||prevOptions===void 0?void 0:prevOptions.style)){_this2.loadTilesetStyle(objectId,options)}if(options.tilesetStyle!==(prevOptions===null||prevOptions===void 0?void 0:prevOptions.tilesetStyle)){object.tiles.group.children.forEach(function(group){Tiles3DStyle.applyTileStyle(group,options,_this2.state.sceneContext)});_this2.instance.notifyChange(object)}})});_defineProperty(_this2,"addLayer",function(layerId,layer){layer.userData.layerId=layerId;_this2.map.addLayer(layer)});_defineProperty(_this2,"getLayer",function(layerId){var _this2$map$getLayers$;return(_this2$map$getLayers$=_this2.map.getLayers(function(l){return l.userData.layerId===layerId})[0])!==null&&_this2$map$getLayers$!==void 0?_this2$map$getLayers$:null});_defineProperty(_this2,"removeLayer",function(layerId){_this2.map.getLayers(function(l){return l.userData.layerId===layerId}).forEach(function(layer){_this2.map.removeLayer(layer,{dispose:true})})});_defineProperty(_this2,"updateColorLayer",function(layerId,options){var path=arguments.length>2&&arguments[2]!==undefined?arguments[2]:[];_this2.setState(function(state){var entry=_objectSpread({},state.sceneContext.colorLayers[layerId]);var subentry=entry;path.forEach(function(idx){subentry.sublayers=_toConsumableArray(subentry.sublayers);subentry.sublayers[idx]=_objectSpread({},subentry.sublayers[idx]);subentry=subentry.sublayers[idx]});Object.assign(subentry,options);Object.assign(entry,LayerUtils.buildWMSLayerParams(entry));return{sceneContext:_objectSpread(_objectSpread({},state.sceneContext),{},{colorLayers:_objectSpread(_objectSpread({},state.sceneContext.colorLayers),{},_defineProperty({},layerId,entry))})}})});_defineProperty(_this2,"add3dTiles",function(url,name){var options=arguments.length>2&&arguments[2]!==undefined?arguments[2]:{};var showEditTool=arguments.length>3&&arguments[3]!==undefined?arguments[3]:false;var matrix=arguments.length>4&&arguments[4]!==undefined?arguments[4]:null;var label=arguments.length>5&&arguments[5]!==undefined?arguments[5]:null;var tiles=new Tiles3D({url:MiscUtils.resolveAssetsPath(url)});// Recenter tile group
|
|
11
|
+
tiles.tiles.addEventListener("load-tile-set",function(_ref7){var tileSet=_ref7.tileSet;if(tileSet.root.parent===null){var bbox=new Box3;tiles.tiles.getBoundingBox(bbox);var center=bbox.getCenter(new Vector3);tiles.tiles.group.position.sub(center);if(matrix){tiles.tiles.group.parent.applyMatrix4(matrix)}else{tiles.tiles.group.parent.position.copy(center)}tiles.tiles.group.parent.updateMatrixWorld(true);if(label){tiles.tiles.group.parent.userData.label=label;updateObjectLabel(tiles.tiles.group.parent,_this2.state.sceneContext)}}_this2.instance.notifyChange(tiles);if(showEditTool){_this2.zoomToObject(name);_this2.props.setCurrentTask("EditDataset3D",null,null,{objectId:name})}});tiles.tiles.addEventListener("needs-update",function(){_this2.instance.notifyChange(tiles)});// Apply style when loading tile
|
|
12
|
+
tiles.tiles.addEventListener("load-model",function(_ref8){var scene=_ref8.scene;scene.userData.tilesetName=name;scene.userData.batchIdAttr="id";Tiles3DStyle.applyTileStyle(scene,_this2.state.sceneContext.sceneObjects[name],_this2.state.sceneContext);_this2.instance.notifyChange(tiles)});// Show/hide labels when tile visibility changes
|
|
13
|
+
tiles.tiles.addEventListener("tile-visibility-change",function(_ref9){var scene=_ref9.scene,visible=_ref9.visible;Object.values(scene.userData.tileLabels||{}).forEach(function(l){l.labelObject.visible=visible;l.labelObject.element.style.display=visible?"initial":"none"})});tiles.castShadow=true;tiles.receiveShadow=true;tiles.userData.layertree=true;_this2.instance.add(tiles);_this2.objectMap[name]=tiles;_this2.setState(function(state){var objectState=_objectSpread({imported:true,visibility:true,opacity:255,layertree:true,title:name},options);return{sceneContext:_objectSpread(_objectSpread({},state.sceneContext),{},{sceneObjects:_objectSpread(_objectSpread({},state.sceneContext.sceneObjects),{},_defineProperty({},name,objectState))})}})});_defineProperty(_this2,"addSceneObject",function(objectId,object){var options=arguments.length>2&&arguments[2]!==undefined?arguments[2]:{};_this2.sceneObjectGroup.add(object);_this2.objectMap[objectId]=object;_this2.instance.notifyChange(object);_this2.setState(function(state){var objectState=_objectSpread({visibility:true,opacity:255,layertree:false},options);return{sceneContext:_objectSpread(_objectSpread({},state.sceneContext),{},{sceneObjects:_objectSpread(_objectSpread({},state.sceneContext.sceneObjects),{},_defineProperty({},objectId,objectState))})}})});_defineProperty(_this2,"getSceneObject",function(objectId){return _this2.objectMap[objectId]});_defineProperty(_this2,"removeSceneObject",function(objectId){var callback=arguments.length>1&&arguments[1]!==undefined?arguments[1]:undefined;var object=_this2.objectMap[objectId];if(!object){return}// Ensure labels are removed
|
|
13
14
|
object.traverse(function(c){if(c.isCSS2DObject){c.element.parentNode.removeChild(c.element)}});if(object.tiles){_this2.instance.remove(object)}else{_this2.sceneObjectGroup.remove(object)}delete _this2.objectMap[objectId];_this2.instance.notifyChange();_this2.setState(function(state){var newSceneObjects=_objectSpread({},state.sceneContext.sceneObjects);delete newSceneObjects[objectId];return{sceneContext:_objectSpread(_objectSpread({},state.sceneContext),{},{sceneObjects:newSceneObjects})}},callback)});_defineProperty(_this2,"updateSceneObject",function(objectId,options){_this2.setState(function(state){return{sceneContext:_objectSpread(_objectSpread({},state.sceneContext),{},{sceneObjects:_objectSpread(_objectSpread({},state.sceneContext.sceneObjects),{},_defineProperty({},objectId,_objectSpread(_objectSpread({},state.sceneContext.sceneObjects[objectId]),options)))})}})});_defineProperty(_this2,"zoomToObject",function(objectId){var margin=arguments.length>1&&arguments[1]!==undefined?arguments[1]:20;var obj=_this2.state.sceneContext.getSceneObject(objectId);var bbox=new Box3;if(obj!==null&&obj!==void 0&&obj.tiles){obj.tiles.getBoundingBox(bbox)}else{bbox.setFromObject(obj)}if(!bbox.isEmpty()){var bounds=[bbox.min.x-margin,bbox.min.y-margin,bbox.max.x+margin,bbox.max.y+margin];_this2.state.sceneContext.setViewToExtent(bounds,0)}});_defineProperty(_this2,"getMap",function(){return _this2.map});_defineProperty(_this2,"setupContainer",function(el){if(el){_this2.container=el;el.resizeObserver=new ResizeObserver(function(entries){var rect=entries[0].contentRect;_this2.state.sceneContext.scene.view.dispatchEvent({type:"view-resized",width:rect.width,height:rect.height})});el.resizeObserver.observe(el);_this2.setupInstance()}});_defineProperty(_this2,"setupInstance",function(){var _this2$props$theme$ma,_this2$props$theme$ma2,_this2$props$theme$ma3,_this2$props$theme$ma6,_this2$props$theme$ma7,_this2$props$theme$ma8;if(_this2.instance){_this2.disposeInstance()}var projection=_this2.props.theme.mapCrs;// Setup instance
|
|
14
15
|
_this2.instance=new Instance({target:_this2.container,crs:projection,renderer:{clearColor:0,preserveDrawingBuffer:true}});_this2.sceneObjectGroup=new Group;_this2.instance.add(_this2.sceneObjectGroup);// Setup map
|
|
15
16
|
var bounds=CoordinatesUtils.reprojectBbox(_this2.props.theme.initialBbox.bounds,_this2.props.theme.initialBbox.crs,projection);var extent=new Extent(projection,bounds[0],bounds[2],bounds[1],bounds[3]);_this2.map=new Map({extent:extent,backgroundColor:"white"});_this2.instance.add(_this2.map);// Setup camera
|
|
@@ -18,8 +19,8 @@ var cubeTextureLoader=new CubeTextureLoader;cubeTextureLoader.setPath(ConfigUtil
|
|
|
18
19
|
var demUrl=MiscUtils.resolveAssetsPath((_this2$props$theme$ma=(_this2$props$theme$ma2=_this2.props.theme.map3d)===null||_this2$props$theme$ma2===void 0||(_this2$props$theme$ma2=_this2$props$theme$ma2.dtm)===null||_this2$props$theme$ma2===void 0?void 0:_this2$props$theme$ma2.url)!==null&&_this2$props$theme$ma!==void 0?_this2$props$theme$ma:"");var demCrs=((_this2$props$theme$ma3=_this2.props.theme.map3d)===null||_this2$props$theme$ma3===void 0||(_this2$props$theme$ma3=_this2$props$theme$ma3.dtm)===null||_this2$props$theme$ma3===void 0?void 0:_this2$props$theme$ma3.crs)||"EPSG:3857";if(demUrl){var _this2$props$theme$ma4,_this2$props$theme$ma5;var demSource=new GeoTIFFSource({url:demUrl,crs:demCrs});var demMin=(_this2$props$theme$ma4=_this2.props.theme.map3d.dtm.min)!==null&&_this2$props$theme$ma4!==void 0?_this2$props$theme$ma4:undefined;var demMax=(_this2$props$theme$ma5=_this2.props.theme.map3d.dtm.max)!==null&&_this2$props$theme$ma5!==void 0?_this2$props$theme$ma5:undefined;var elevationLayer=new ElevationLayer({name:"dem",extent:extent,source:demSource,minmax:demMin!==undefined&&demMax!==undefined?{demMin:demMin,demMax:demMax}:undefined});_this2.addLayer("__dtm",elevationLayer)}// Collect baselayers
|
|
19
20
|
var visibleBaseLayer=null;var baseLayers=(((_this2$props$theme$ma6=_this2.props.theme.map3d)===null||_this2$props$theme$ma6===void 0?void 0:_this2$props$theme$ma6.basemaps)||[]).map(function(e){var baseLayer=_objectSpread(_objectSpread({},_this2.props.layers.find(function(bl){return bl.name===e.name})),{},{visibility:e.visibility===true,overview:e.overview===true});if(baseLayer.visibility){visibleBaseLayer=baseLayer}return baseLayer});if(visibleBaseLayer){_this2.setBaseLayer(visibleBaseLayer,true)}// Collect color layers
|
|
20
21
|
var colorLayers=_this2.collectColorLayers([]);var sceneObjects={};_this2.objectMap={};// Add 3d tiles
|
|
21
|
-
(((_this2$props$theme$ma7=_this2.props.theme.map3d)===null||_this2$props$theme$ma7===void 0?void 0:_this2$props$theme$ma7.tiles3d)||[]).forEach(function(entry){var _entry$title;var tiles=new Tiles3D({url:MiscUtils.resolveAssetsPath(entry.url),errorTarget:32});// Apply style when loading tile
|
|
22
|
-
tiles.tiles.addEventListener("load-model",function(_ref10){var _entry$idAttr;var scene=_ref10.scene;scene.userData.tilesetName=entry.name;scene.userData.batchIdAttr=(_entry$idAttr=entry.idAttr)!==null&&_entry$idAttr!==void 0?_entry$idAttr:"id";Tiles3DStyle.applyTileStyle(scene,_this2.state.sceneContext.sceneObjects[entry.name],_this2.state.sceneContext)});// Show/hide labels when tile visibility changes
|
|
22
|
+
(((_this2$props$theme$ma7=_this2.props.theme.map3d)===null||_this2$props$theme$ma7===void 0?void 0:_this2$props$theme$ma7.tiles3d)||[]).forEach(function(entry){var _entry$title;var tiles=new Tiles3D({url:MiscUtils.resolveAssetsPath(entry.url),errorTarget:32});tiles.tiles.addEventListener("load-tile-set",function(){_this2.instance.notifyChange(tiles)});tiles.tiles.addEventListener("needs-update",function(){_this2.instance.notifyChange(tiles)});// Apply style when loading tile
|
|
23
|
+
tiles.tiles.addEventListener("load-model",function(_ref10){var _entry$idAttr;var scene=_ref10.scene;scene.userData.tilesetName=entry.name;scene.userData.batchIdAttr=(_entry$idAttr=entry.idAttr)!==null&&_entry$idAttr!==void 0?_entry$idAttr:"id";Tiles3DStyle.applyTileStyle(scene,_this2.state.sceneContext.sceneObjects[entry.name],_this2.state.sceneContext);_this2.instance.notifyChange(tiles)});// Show/hide labels when tile visibility changes
|
|
23
24
|
tiles.tiles.addEventListener("tile-visibility-change",function(_ref11){var scene=_ref11.scene,visible=_ref11.visible;Object.values(scene.userData.tileLabels||{}).forEach(function(label){label.labelObject.visible=visible;label.labelObject.element.style.display=visible?"initial":"none"})});tiles.castShadow=true;tiles.receiveShadow=true;tiles.userData.layertree=true;_this2.instance.add(tiles);_this2.objectMap[entry.name]=tiles;sceneObjects[entry.name]={visibility:true,opacity:255,layertree:true,title:(_entry$title=entry.title)!==null&&_entry$title!==void 0?_entry$title:entry.name,baseColor:entry.baseColor,styles:entry.styles,style:entry.style||Object.keys(entry.styles||{})[0]||null,tilesetStyle:null,idAttr:entry.idAttr,colorAttr:entry.colorAttr,alphaAttr:entry.alphaAttr,labelAttr:entry.labelAttr}});// Add other objects
|
|
24
25
|
(((_this2$props$theme$ma8=_this2.props.theme.map3d)===null||_this2$props$theme$ma8===void 0?void 0:_this2$props$theme$ma8.objects3d)||[]).forEach(function(entry){importGltf(MiscUtils.resolveAssetsPath(entry.url),entry.name,_this2.state.sceneContext)});_this2.setState(function(state){return{sceneContext:_objectSpread(_objectSpread({},state.sceneContext),{},{scene:_this2.instance,map:_this2.map,mapCrs:projection,dtmUrl:demUrl,dtmCrs:demCrs,baseLayers:baseLayers,colorLayers:colorLayers,sceneObjects:sceneObjects}),sceneId:uuidv4()}});// Inspector
|
|
25
26
|
if(["1","true"].includes((UrlParams.getParam("inspector")||"").toLowerCase())){var inspectorContainer=document.createElement("div");inspectorContainer.className="map3d-inspector";_this2.container.appendChild(inspectorContainer);_this2.inspector=new Inspector(inspectorContainer,_this2.instance)}});_defineProperty(_this2,"loadTilesetStyle",function(objectId,options){var _options$styles;var url=(_options$styles=options.styles)===null||_options$styles===void 0?void 0:_options$styles[options.style];if(_this2.tilesetStyles[url]){_this2.updateSceneObject(objectId,{tilesetStyle:_this2.tilesetStyles[url]})}else if(url){var fullUrl=MiscUtils.resolveAssetsPath(url);axios.get(fullUrl).then(function(response){_this2.tilesetStyles[url]=response.data;_this2.updateSceneObject(objectId,{tilesetStyle:_this2.tilesetStyles[url]})})["catch"](function(){_this2.tilesetStyles[url]={};_this2.updateSceneObject(objectId,{tilesetStyle:_this2.tilesetStyles[url]})})}else{_this2.tilesetStyles[url]=null;_this2.updateSceneObject(objectId,{tilesetStyle:_this2.tilesetStyles[url]})}});_defineProperty(_this2,"disposeInstance",function(){if(_this2.inspector){_this2.inspector.detach()}_this2.map.dispose({disposeLayers:true});Object.values(_this2.objectMap).forEach(function(object){_this2.instance.remove(object)});_this2.instance.dispose();_this2.inspector=null;_this2.map=null;_this2.objectMap={};_this2.sceneObjectGroup=null;_this2.instance=null;_this2.setState(function(state){return{sceneContext:_objectSpread(_objectSpread({},state.sceneContext),Map3D.defaultSceneState)}});_this2.props.setCurrentTask(null)});_defineProperty(_this2,"onUnload",function(key){// Ensure scene has not already been disposed
|
|
@@ -36,4 +37,4 @@ var terrInter=raycaster.intersectObjects([_this2.map.object3d]).filter(function(
|
|
|
36
37
|
if(objInter&&terrInter){return objInter.distance<terrInter.distance?objInter:terrInter}return objInter!==null&&objInter!==void 0?objInter:terrInter});_defineProperty(_this2,"redrawScene",function(ev){var width=ev.target.innerWidth;var height=ev.target.innerHeight;_this2.instance.renderer.setSize(width,height);_this2.instance.view.camera.aspect=width/height;_this2.instance.view.camera.updateProjectionMatrix();_this2.instance.renderer.render(_this2.instance.scene,_this2.instance.view.camera)});_defineProperty(_this2,"setViewToExtent",function(bounds,rotation){_this2.state.sceneContext.setViewToExtent(bounds,rotation)});_defineProperty(_this2,"store3dState",function(){var promises=Object.entries(_this2.state.sceneContext.sceneObjects).map(function(_ref14){var _ref15=_slicedToArray(_ref14,2),objectId=_ref15[0],entry=_ref15[1];if(!entry.layertree){return null}return new Promise(function(resolve){var object=_this2.state.sceneContext.getSceneObject(objectId);if(entry.drawGroup){var exporter=new GLTFExporter;exporter.parse(object,function(result){resolve({id:objectId,options:entry,data:result})})}else if(entry.imported&&object.tiles){var container=object.tiles.group.parent;var tileset={matrix:container.matrix.elements,label:container.userData.label,url:object.tiles.rootURL};resolve({id:objectId,options:entry,tileset:tileset})}else{resolve({id:objectId,options:entry})}})}).filter(Boolean);return new Promise(function(resolve){Promise.all(promises).then(function(objects){var _this2$state$sceneCon;var camera=_this2.state.sceneContext.scene.view.camera.position;var target=_this2.state.sceneContext.scene.view.controls.target;var layers=Object.entries(_this2.state.sceneContext.colorLayers).map(function(_ref16){var _ref17=_slicedToArray(_ref16,2),layerId=_ref17[0],options=_ref17[1];return{id:layerId,options:{visibility:options.visibility,opacity:options.opacity,extrusionHeight:options.extrusionHeight}}});resolve({objects:objects,colorLayers:layers,personHeight:(_this2$state$sceneCon=_this2.state.sceneContext.scene.view.controls.personHeight)!==null&&_this2$state$sceneCon!==void 0?_this2$state$sceneCon:0,camera:[camera.x,camera.y,camera.z],target:[target.x,target.y,target.z]})})})});_defineProperty(_this2,"restore3dState",function(data){if(isEmpty(data)){return}(data.objects||[]).forEach(function(item){if(item.data){var loader=new GLTFLoader;loader.parse(item.data,ConfigUtils.getAssetsPath(),function(gltf){gltf.scene.traverse(function(c){if(c.isMesh){c.castShadow=true;c.receiveShadow=true}updateObjectLabel(c,_this2.state.sceneContext)});_this2.state.sceneContext.addSceneObject(item.id,gltf.scene,item.options)})}else if(item.tileset){_this2.add3dTiles(item.tileset.url,item.id,item.options,false,new Matrix4().fromArray(item.tileset.matrix),item.tileset.label)}else if(item.id in _this2.state.sceneContext.sceneObjects){_this2.state.sceneContext.updateSceneObject(item.id,item.options)}});(data.colorLayers||[]).forEach(function(item){if(item.id in _this2.state.sceneContext.colorLayers){_this2.state.sceneContext.updateColorLayer(item.id,item.options)}});_this2.state.sceneContext.restoreView(data);if(data.baselayer!==undefined){_this2.setState(function(state){return{sceneContext:_objectSpread(_objectSpread({},state.sceneContext),{},{baseLayers:state.sceneContext.baseLayers.map(function(l){return _objectSpread(_objectSpread({},l),{},{visibility:l.name===data.baselayer})})})}});UrlParams.updateParams({bl3d:data.baselayer})}_this2.state.sceneContext.scene.notifyChange()});_this2.container=null;_this2.inspector=null;_this2.instance=null;_this2.map=null;_this2.sceneObjectGroup=null;_this2.objectMap={};_this2.tilesetStyles={};_this2.state.sceneContext.options=_this2.props.options;_this2.state.sceneContext.addLayer=_this2.addLayer;_this2.state.sceneContext.getLayer=_this2.getLayer;_this2.state.sceneContext.removeLayer=_this2.removeLayer;_this2.state.sceneContext.updateColorLayer=_this2.updateColorLayer;_this2.state.sceneContext.add3dTiles=_this2.add3dTiles;_this2.state.sceneContext.addSceneObject=_this2.addSceneObject;_this2.state.sceneContext.getSceneObject=_this2.getSceneObject;_this2.state.sceneContext.removeSceneObject=_this2.removeSceneObject;_this2.state.sceneContext.updateSceneObject=_this2.updateSceneObject;_this2.state.sceneContext.zoomToObject=_this2.zoomToObject;_this2.state.sceneContext.getMap=_this2.getMap;_this2.state.sceneContext.getTerrainHeightFromDTM=_this2.getTerrainHeightFromDTM;_this2.state.sceneContext.getTerrainHeightFromMap=_this2.getTerrainHeightFromMap;_this2.state.sceneContext.getSceneIntersection=_this2.getSceneIntersection;registerPermalinkDataStoreHook("map3d",_this2.store3dState);return _this2}_inherits(Map3D,_React$Component2);return _createClass(Map3D,[{key:"componentDidMount",value:function componentDidMount(){this.props.innerRef(this)}},{key:"componentWillUnmount",value:function componentWillUnmount(){unregisterPermalinkDataStoreHook("map3d")}},{key:"componentDidUpdate",value:function componentDidUpdate(prevProps,prevState){var _this3=this;if(this.props.theme!==prevProps.theme){this.setupInstance()}else if(this.props.layers!==prevProps.layers){this.setState(function(state){return{sceneContext:_objectSpread(_objectSpread({},state.sceneContext),{},{colorLayers:_this3.collectColorLayers(state.sceneContext.colorLayers)})}})}// Update map layers
|
|
37
38
|
if(this.state.sceneContext.baseLayers!==prevState.sceneContext.baseLayers){this.applyBaseLayer()}if(this.state.sceneContext.colorLayers!==prevState.sceneContext.colorLayers){this.applyColorLayerUpdates(this.state.sceneContext.colorLayers,prevState.sceneContext.colorLayers)}// Update scene objects
|
|
38
39
|
if(this.state.sceneContext.sceneObjects!==prevState.sceneContext.sceneObjects){this.applySceneObjectUpdates(this.state.sceneContext.sceneObjects,prevState.sceneContext.sceneObjects);// Update collision objects
|
|
39
|
-
this.setState(function(state){return{sceneContext:_objectSpread(_objectSpread({},state.sceneContext),{},{collisionObjects:Object.entries(state.sceneContext.sceneObjects).map(function(_ref18){var _ref19=_slicedToArray(_ref18,2),objId=_ref19[0],options=_ref19[1];if(options.layertree&&options.visibility){var _obj$tiles$group,_obj$tiles;var obj=_this3.objectMap[objId];return(_obj$tiles$group=(_obj$tiles=obj.tiles)===null||_obj$tiles===void 0?void 0:_obj$tiles.group)!==null&&_obj$tiles$group!==void 0?_obj$tiles$group:obj}return null}).filter(Boolean)})}})}}},{key:"render",value:function render(){var _this$state$sceneCont;var baseLayer=this.state.sceneContext.baseLayers.find(function(l){return l.visibility===true});var overviewLayer=(_this$state$sceneCont=this.state.sceneContext.baseLayers.find(function(l){return l.overview===true}))!==null&&_this$state$sceneCont!==void 0?_this$state$sceneCont:baseLayer;return[/*#__PURE__*/ReactDOM.createPortal(/*#__PURE__*/React.createElement("div",{className:"map3d-map",id:"map3d",key:"Map3D",ref:this.setupContainer}),this.context),this.state.sceneContext.scene?/*#__PURE__*/React.createElement(UnloadWrapper,{key:this.state.sceneId,onUnload:this.onUnload,sceneId:this.state.sceneId},/*#__PURE__*/React.createElement(MapControls3D,{onCameraChanged:this.props.onCameraChanged,onControlsSet:this.setupControls,sceneContext:this.state.sceneContext}
|
|
40
|
+
this.setState(function(state){return{sceneContext:_objectSpread(_objectSpread({},state.sceneContext),{},{collisionObjects:Object.entries(state.sceneContext.sceneObjects).map(function(_ref18){var _ref19=_slicedToArray(_ref18,2),objId=_ref19[0],options=_ref19[1];if(options.layertree&&options.visibility){var _obj$tiles$group,_obj$tiles;var obj=_this3.objectMap[objId];return(_obj$tiles$group=(_obj$tiles=obj.tiles)===null||_obj$tiles===void 0?void 0:_obj$tiles.group)!==null&&_obj$tiles$group!==void 0?_obj$tiles$group:obj}return null}).filter(Boolean)})}})}}},{key:"render",value:function render(){var _this$state$sceneCont;var baseLayer=this.state.sceneContext.baseLayers.find(function(l){return l.visibility===true});var overviewLayer=(_this$state$sceneCont=this.state.sceneContext.baseLayers.find(function(l){return l.overview===true}))!==null&&_this$state$sceneCont!==void 0?_this$state$sceneCont:baseLayer;return[/*#__PURE__*/ReactDOM.createPortal(/*#__PURE__*/React.createElement("div",{className:"map3d-map",id:"map3d",key:"Map3D",ref:this.setupContainer}),this.context),this.state.sceneContext.scene?/*#__PURE__*/React.createElement(UnloadWrapper,{key:this.state.sceneId,onUnload:this.onUnload,sceneId:this.state.sceneId},/*#__PURE__*/React.createElement(MapControls3D,{onCameraChanged:this.props.onCameraChanged,onControlsSet:this.setupControls,sceneContext:this.state.sceneContext},/*#__PURE__*/React.createElement(BackgroundSwitcher,{changeLayerVisibility:this.setBaseLayer,layers:this.state.sceneContext.baseLayers}),/*#__PURE__*/React.createElement(BottomBar3D,{sceneContext:this.state.sceneContext}),/*#__PURE__*/React.createElement(Compare3D,{sceneContext:this.state.sceneContext}),/*#__PURE__*/React.createElement(Draw3D,{sceneContext:this.state.sceneContext}),/*#__PURE__*/React.createElement(EditDataset3D,{sceneContext:this.state.sceneContext}),/*#__PURE__*/React.createElement(ExportObjects3D,{sceneContext:this.state.sceneContext}),/*#__PURE__*/React.createElement(HideObjects3D,{sceneContext:this.state.sceneContext}),/*#__PURE__*/React.createElement(Identify3D,{sceneContext:this.state.sceneContext}),/*#__PURE__*/React.createElement(LayerTree3D,{sceneContext:this.state.sceneContext}),/*#__PURE__*/React.createElement(Map3DLight,{sceneContext:this.state.sceneContext}),/*#__PURE__*/React.createElement(MapExport3D,{sceneContext:this.state.sceneContext}),/*#__PURE__*/React.createElement(Measure3D,{sceneContext:this.state.sceneContext}),/*#__PURE__*/React.createElement(OverviewMap3D,{baseLayer:overviewLayer,sceneContext:this.state.sceneContext}),/*#__PURE__*/React.createElement(TopBar3D,{sceneContext:this.state.sceneContext,searchProviders:this.props.searchProviders}),/*#__PURE__*/React.createElement(View3DSwitcher,{position:2}))):null]}}])}(React.Component);_defineProperty(Map3D,"contextType",MapContainerPortalContext);_defineProperty(Map3D,"propTypes",{innerRef:PropTypes.func,layers:PropTypes.array,onCameraChanged:PropTypes.func,onMapInitialized:PropTypes.func,options:PropTypes.object,searchProviders:PropTypes.object,setCurrentTask:PropTypes.func,theme:PropTypes.object});_defineProperty(Map3D,"defaultProps",{geometry:{initialWidth:600,initialHeight:800,initialX:0,initialY:0,initiallyDocked:true}});_defineProperty(Map3D,"defaultSceneState",{scene:null,map:null,mapCrs:null,dtmUrl:null,dtmCrs:null,baseLayers:[],colorLayers:{},sceneObjects:{},collisionObjects:[]});export default connect(function(state){return{theme:state.theme.current,layers:state.layers.flat}},{setCurrentTask:setCurrentTask})(Map3D);
|
|
@@ -4,8 +4,8 @@ function _typeof(o){"@babel/helpers - typeof";return _typeof="function"==typeof
|
|
|
4
4
|
*
|
|
5
5
|
* This source code is licensed under the BSD-style license found in the
|
|
6
6
|
* LICENSE file in the root directory of this source tree.
|
|
7
|
-
*/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.06,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+"T00:00:00");return(d-new Date(d.getFullYear(),0,0))/(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(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,{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,{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
|
|
8
|
-
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=
|
|
9
|
-
var noonColor={r:1,g:0.98,b:0.98};var horizonColor={r:1,g:0.5,b:0.3};var
|
|
10
|
-
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=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
|
|
11
|
-
moonLight.position.set(lightTarget.x,lightTarget.y,8000);moonLight.intensity=lightParams.moonLightIntensity*
|
|
7
|
+
*/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+"T00:00:00");return(d-new Date(d.getFullYear(),0,0))/(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,{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,{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
|
|
8
|
+
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
|
|
9
|
+
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
|
|
10
|
+
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
|
|
11
|
+
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};
|
|
@@ -5,7 +5,8 @@ function _typeof(o){"@babel/helpers - typeof";return _typeof="function"==typeof
|
|
|
5
5
|
* This source code is licensed under the BSD-style license found in the
|
|
6
6
|
* LICENSE file in the root directory of this source tree.
|
|
7
7
|
*/import React from"react";import{connect}from"react-redux";import classNames from"classnames";import PropTypes from"prop-types";import{Vector3}from"three";import ConfigUtils from"../../utils/ConfigUtils";import{UrlParams}from"../../utils/PermaLinkUtils";import Icon from"../Icon";import FirstPersonControls3D from"./utils/FirstPersonControls3D";import OrbitControls3D from"./utils/OrbitControls3D";import"./style/MapControls3D.css";// FIXME: camera.fov is 30, but in reality seems to be 50 (as would be the threejs default)
|
|
8
|
-
var CAMERA_FOV=50;var MapControls3D=/*#__PURE__*/function(_React$Component){function MapControls3D(){var _this;_classCallCheck(this,MapControls3D);
|
|
8
|
+
var CAMERA_FOV=50;var MapControls3D=/*#__PURE__*/function(_React$Component){function MapControls3D(props){var _this;_classCallCheck(this,MapControls3D);_this=_callSuper(this,MapControls3D,[props]);_defineProperty(_this,"state",{pickingFirstPerson:false,firstPerson:false});_defineProperty(_this,"unload",function(el){// componentWillUnmount is called too early, so do cleanup when the element is actually removed
|
|
9
|
+
if(!el){_this.controls.removeEventListener("change",_this.updateControlsTarget);_this.fpcontrols.removeEventListener("change",_this.updateFpUrlParams);if(_this.state.firstPerson){_this.fpcontrols.disconnect()}else{_this.controls.disconnect()}_this.props.sceneContext.scene.domElement.removeEventListener("dblclick",_this.switchToFirstPersonView)}});_defineProperty(_this,"switchToFirstPersonView",function(ev){// Don't do anything if a task is set, may interfere
|
|
9
10
|
if(!_this.props.currentTask&&!_this.state.firstPerson){_this.setupFirstPerson(ev)}});_defineProperty(_this,"toggleFirstPersonControls",function(){if(_this.state.firstPerson){_this.leaveFirstPerson()}else if(_this.state.pickingFirstPerson){_this.props.sceneContext.scene.domElement.removeEventListener("click",_this.setupFirstPerson);_this.props.sceneContext.scene.domElement.style.cursor="";_this.setState({pickingFirstPerson:false})}else{_this.props.sceneContext.scene.domElement.addEventListener("click",_this.setupFirstPerson,{once:true});var cursor=ConfigUtils.getAssetsPath()+"/img/person.svg";_this.props.sceneContext.scene.domElement.style.cursor="url(".concat(cursor,"), pointer");_this.setState({pickingFirstPerson:true})}});_defineProperty(_this,"setupFirstPerson",function(ev){_this.props.sceneContext.scene.domElement.style.cursor="";var rect=ev.target.getBoundingClientRect();var mouseX=(ev.clientX-rect.left)/rect.width*2-1;var mouseY=-((ev.clientY-rect.top)/rect.height)*2+1;var intersection=_this.props.sceneContext.getSceneIntersection(mouseX,mouseY,false);if(!intersection){return}var pos=intersection.point;_this.props.sceneContext.getTerrainHeightFromDTM([pos.x,pos.y]).then(function(z){var camerapos=new Vector3(pos.x,pos.y,z+_this.fpcontrols.personHeight);var targetpos=new Vector3(pos.x,pos.y+300,z+_this.fpcontrols.personHeight);_this.controls.animateTo(camerapos,targetpos,0,function(){_this.controls.disconnect();_this.fpcontrols.connect(_this.props.sceneContext);_this.fpcontrols.setView(camerapos,new Vector3(0,1,0));_this.setState({firstPerson:true,pickingFirstPerson:false})})})});_defineProperty(_this,"leaveFirstPerson",function(){if(_this.state.firstPerson){_this.setState({firstPerson:false},function(){// Need to ensure this.state.firstPerson is false to avoid endless loop
|
|
10
11
|
var camerapos=_this.props.sceneContext.scene.view.camera.position;_this.fpcontrols.disconnect();_this.controls.connect(_this.props.sceneContext);_this.controls.setView(camerapos,new Vector3().addVectors(camerapos,_this.fpcontrols.lookAt));var bounds=[camerapos.x-750,camerapos.y-750,camerapos.x+750,camerapos.y+750];_this.setViewToExtent(bounds)})}});_defineProperty(_this,"home",function(){var extent=_this.props.sceneContext.map.extent;var bounds=[extent.west,extent.south,extent.east,extent.north];_this.setViewToExtent(bounds)});_defineProperty(_this,"setViewToExtent",function(bounds){var _this$props$sceneCont;var angle=arguments.length>1&&arguments[1]!==undefined?arguments[1]:0;_this.leaveFirstPerson();var center={x:0.5*(bounds[0]+bounds[2]),y:0.5*(bounds[1]+bounds[3])};center.z=(_this$props$sceneCont=_this.props.sceneContext.getTerrainHeightFromMap([center.x,center.y]))!==null&&_this$props$sceneCont!==void 0?_this$props$sceneCont:0;// Camera height to width bbox width
|
|
11
|
-
var fov=CAMERA_FOV/180*Math.PI;var cameraHeight=(bounds[2]-bounds[0])/(2*Math.tan(fov/2));var camerapos=new Vector3(center.x,center.y,center.z+cameraHeight);var target=new Vector3(center.x,center.y,center.z);_this.controls.animateTo(camerapos,target,angle)});_defineProperty(_this,"pan",function(ev,dx,dy){var panInterval=setInterval(function(){_this.props.sceneContext.scene.view.controls.panView(dx,dy)},50);ev.view.addEventListener("pointerup",function(){clearInterval(panInterval)},{once:true})});_defineProperty(_this,"tilt",function(ev,azimuth,polar){var tiltInterval=setInterval(function(){_this.props.sceneContext.scene.view.controls.tiltView(azimuth,polar)},50);ev.view.addEventListener("pointerup",function(){clearInterval(tiltInterval)},{once:true})});_defineProperty(_this,"resetTilt",function(){var camerapos=_this.props.sceneContext.scene.view.camera.position;if(_this.state.firstPerson){var newLookAt=_this.fpcontrols.lookAt.clone();newLookAt.z=0;_this.fpcontrols.setView(camerapos,newLookAt.normalize())}else{var target=_this.controls.target;var newcamerapos=new Vector3(target.x,target.y,target.distanceTo(camerapos));_this.controls.animateTo(newcamerapos,target,0)}});_defineProperty(_this,"zoom",function(ev,delta){var zoomInterval=setInterval(function(){var camerapos=_this.props.sceneContext.scene.view.camera.position;var target=_this.controls.target;var k=Math.min(150,Math.sqrt(target.distanceTo(camerapos)));_this.props.sceneContext.scene.view.controls.zoomView(delta*k)},50);ev.view.addEventListener("pointerup",function(){clearInterval(zoomInterval)},{once:true})});_defineProperty(_this,"updateUrlParams",function(){var cpos=_this.props.sceneContext.scene.view.camera.position;var tpos=_this.controls.target;UrlParams.updateParams({v3d:[cpos.x,cpos.y,cpos.z,tpos.x,tpos.y,tpos.z,0].map(function(v){return v.toFixed(1)}).join(",")});_this.props.onCameraChanged([tpos.x,tpos.y,tpos.z],[cpos.x,cpos.y,cpos.z],CAMERA_FOV)});_defineProperty(_this,"updateFpUrlParams",function(){var cpos=_this.fpcontrols.target;var lkat=_this.fpcontrols.lookAt;var h=_this.fpcontrols.personHeight;UrlParams.updateParams({v3d:[cpos.x,cpos.y,cpos.z,lkat.x,lkat.y,lkat.z,h].map(function(v){return v.toFixed(1)}).join(",")});_this.props.onCameraChanged([cpos.x,cpos.y,cpos.z],null)});_defineProperty(_this,"restoreView",function(viewState){if(viewState.camera&&viewState.target){var camera=_construct(Vector3,_toConsumableArray(viewState.camera));var target=_construct(Vector3,_toConsumableArray(viewState.target));if(viewState.personHeight>0){_this.controls.disconnect();_this.fpcontrols.connect(_this.props.sceneContext);_this.fpcontrols.setView(camera,target,viewState.personHeight);_this.setState({firstPerson:true})}else{_this.controls.setView(camera,target)}}});
|
|
12
|
+
var fov=CAMERA_FOV/180*Math.PI;var cameraHeight=(bounds[2]-bounds[0])/(2*Math.tan(fov/2));var camerapos=new Vector3(center.x,center.y,center.z+cameraHeight);var target=new Vector3(center.x,center.y,center.z);_this.controls.animateTo(camerapos,target,angle)});_defineProperty(_this,"pan",function(ev,dx,dy){var panInterval=setInterval(function(){_this.props.sceneContext.scene.view.controls.panView(dx,dy)},50);ev.view.addEventListener("pointerup",function(){clearInterval(panInterval)},{once:true})});_defineProperty(_this,"tilt",function(ev,azimuth,polar){var tiltInterval=setInterval(function(){_this.props.sceneContext.scene.view.controls.tiltView(azimuth,polar)},50);ev.view.addEventListener("pointerup",function(){clearInterval(tiltInterval)},{once:true})});_defineProperty(_this,"resetTilt",function(){var camerapos=_this.props.sceneContext.scene.view.camera.position;if(_this.state.firstPerson){var newLookAt=_this.fpcontrols.lookAt.clone();newLookAt.z=0;_this.fpcontrols.setView(camerapos,newLookAt.normalize())}else{var target=_this.controls.target;var newcamerapos=new Vector3(target.x,target.y,target.distanceTo(camerapos));_this.controls.animateTo(newcamerapos,target,0)}});_defineProperty(_this,"zoom",function(ev,delta){var zoomInterval=setInterval(function(){var camerapos=_this.props.sceneContext.scene.view.camera.position;var target=_this.controls.target;var k=Math.min(150,Math.sqrt(target.distanceTo(camerapos)));_this.props.sceneContext.scene.view.controls.zoomView(delta*k)},50);ev.view.addEventListener("pointerup",function(){clearInterval(zoomInterval)},{once:true})});_defineProperty(_this,"updateUrlParams",function(){var cpos=_this.props.sceneContext.scene.view.camera.position;var tpos=_this.controls.target;UrlParams.updateParams({v3d:[cpos.x,cpos.y,cpos.z,tpos.x,tpos.y,tpos.z,0].map(function(v){return v.toFixed(1)}).join(",")});_this.props.onCameraChanged([tpos.x,tpos.y,tpos.z],[cpos.x,cpos.y,cpos.z],CAMERA_FOV)});_defineProperty(_this,"updateFpUrlParams",function(){var cpos=_this.fpcontrols.target;var lkat=_this.fpcontrols.lookAt;var h=_this.fpcontrols.personHeight;UrlParams.updateParams({v3d:[cpos.x,cpos.y,cpos.z,lkat.x,lkat.y,lkat.z,h].map(function(v){return v.toFixed(1)}).join(",")});_this.props.onCameraChanged([cpos.x,cpos.y,cpos.z],null)});_defineProperty(_this,"restoreView",function(viewState){if(viewState.camera&&viewState.target){var camera=_construct(Vector3,_toConsumableArray(viewState.camera));var target=_construct(Vector3,_toConsumableArray(viewState.target));if(viewState.personHeight>0){_this.controls.disconnect();_this.fpcontrols.connect(_this.props.sceneContext);_this.fpcontrols.setView(camera,target,viewState.personHeight);_this.setState({firstPerson:true})}else{_this.controls.setView(camera,target)}}});var sceneElement=props.sceneContext.scene.domElement;sceneElement.tabIndex=0;_this.controls=new OrbitControls3D(props.sceneContext.scene.view.camera);_this.fpcontrols=new FirstPersonControls3D(props.sceneContext.scene.view.camera);_this.controls.connect(props.sceneContext);var targetPos=props.sceneContext.scene.view.camera.position.clone();targetPos.z=0;_this.controls.target=targetPos;_this.controls.addEventListener("change",_this.updateUrlParams);_this.fpcontrols.addEventListener("change",_this.updateFpUrlParams);sceneElement.addEventListener("dblclick",_this.switchToFirstPersonView);props.onControlsSet(_this);_this.updateUrlParams();return _this}_inherits(MapControls3D,_React$Component);return _createClass(MapControls3D,[{key:"render",value:function render(){var _this2=this;var firstPersonButtonClasses=classNames({"map3d-firstperson-button":true,"map3d-firstperson-button-active":this.state.firstPerson});return[this.props.children,/*#__PURE__*/React.createElement("div",{className:"map3d-nav",key:"MapControls3D",ref:this.unload},/*#__PURE__*/React.createElement("div",{className:"map3d-nav-pan",key:"MapPanWidget"},/*#__PURE__*/React.createElement("span",null),/*#__PURE__*/React.createElement(Icon,{icon:"chevron-up",onPointerDown:function onPointerDown(ev){return _this2.pan(ev,0,1)}}),/*#__PURE__*/React.createElement("span",null),/*#__PURE__*/React.createElement(Icon,{icon:"chevron-left",onPointerDown:function onPointerDown(ev){return _this2.pan(ev,-1,0)}}),/*#__PURE__*/React.createElement(Icon,{icon:"home",onClick:function onClick(){return _this2.home()}}),/*#__PURE__*/React.createElement(Icon,{icon:"chevron-right",onPointerDown:function onPointerDown(ev){return _this2.pan(ev,1,0)}}),/*#__PURE__*/React.createElement("span",null),/*#__PURE__*/React.createElement(Icon,{icon:"chevron-down",onPointerDown:function onPointerDown(ev){return _this2.pan(ev,0,-1)}}),/*#__PURE__*/React.createElement("span",null)),/*#__PURE__*/React.createElement("div",{className:"map3d-nav-rotate",key:"MapRotateWidget"},/*#__PURE__*/React.createElement("span",null),/*#__PURE__*/React.createElement(Icon,{icon:"tilt-up",onPointerDown:function onPointerDown(ev){return _this2.tilt(ev,0,0.1)}}),/*#__PURE__*/React.createElement("span",null),/*#__PURE__*/React.createElement(Icon,{icon:"tilt-left",onPointerDown:function onPointerDown(ev){return _this2.tilt(ev,0.1,0)}}),/*#__PURE__*/React.createElement(Icon,{icon:"point",onClick:function onClick(){return _this2.resetTilt()}}),/*#__PURE__*/React.createElement(Icon,{icon:"tilt-right",onPointerDown:function onPointerDown(ev){return _this2.tilt(ev,-0.1,0)}}),/*#__PURE__*/React.createElement("span",null),/*#__PURE__*/React.createElement(Icon,{icon:"tilt-down",onPointerDown:function onPointerDown(ev){return _this2.tilt(ev,0,-0.1)}}),/*#__PURE__*/React.createElement("span",null)),!this.state.firstPerson?/*#__PURE__*/React.createElement("div",{className:"map3d-nav-zoom"},/*#__PURE__*/React.createElement("div",{onPointerDown:function onPointerDown(ev){return _this2.zoom(ev,+1)}},/*#__PURE__*/React.createElement(Icon,{icon:"plus"})),/*#__PURE__*/React.createElement("div",{onPointerDown:function onPointerDown(ev){return _this2.zoom(ev,-1)}},/*#__PURE__*/React.createElement(Icon,{icon:"minus"}))):null,/*#__PURE__*/React.createElement("div",{className:firstPersonButtonClasses,key:"FirstPersonButton",onClick:this.toggleFirstPersonControls},/*#__PURE__*/React.createElement(Icon,{icon:"person"})))]}}])}(React.Component);_defineProperty(MapControls3D,"propTypes",{children:PropTypes.oneOfType([PropTypes.node,PropTypes.func]),currentTask:PropTypes.string,onCameraChanged:PropTypes.func,onControlsSet:PropTypes.func,sceneContext:PropTypes.object});export default connect(function(state){return{currentTask:state.task.id}},{})(MapControls3D);
|