|
|
|
@ -2,14 +2,16 @@ import { Button, Icon, Label, NumericInput, Popover, Position, Radio, RadioGroup
|
|
|
|
|
import { observer } from 'mobx-react';
|
|
|
|
|
import React, { Component } from 'react';
|
|
|
|
|
import { MathUtils } from 'three';
|
|
|
|
|
import { app, CameraRoamType } from '../../../../ApplicationServices/Application';
|
|
|
|
|
import { CameraType } from '../../../../GraphicsSystem/CameraUpdate';
|
|
|
|
|
import { CameraRoamType, app } from '../../../../ApplicationServices/Application';
|
|
|
|
|
import { CoolDownTime } from '../../../../Common/CoolDownTime';
|
|
|
|
|
import { CameraType, ViewNearMinSize } from '../../../../GraphicsSystem/CameraUpdate';
|
|
|
|
|
import CameraSettingStore, { CameraMode } from './CameraSettingStore';
|
|
|
|
|
import { CameraSettingIcon } from './CameraState';
|
|
|
|
|
|
|
|
|
|
@observer
|
|
|
|
|
export default class CameraSetting extends Component
|
|
|
|
|
{
|
|
|
|
|
_CoolTime = new CoolDownTime;
|
|
|
|
|
CameraSettingStore: CameraSettingStore = CameraSettingStore.GetSingleInstance();
|
|
|
|
|
AlterCameraVision = (deg: number): void =>
|
|
|
|
|
{
|
|
|
|
@ -20,9 +22,19 @@ export default class CameraSetting extends Component
|
|
|
|
|
app.Viewer.CameraControl.ViewHeight *= a2 / a1;
|
|
|
|
|
app.Editor.UpdateScreen();
|
|
|
|
|
};
|
|
|
|
|
UpdateNear(value: number): void
|
|
|
|
|
{
|
|
|
|
|
this._CoolTime.Debounce(() =>
|
|
|
|
|
{
|
|
|
|
|
app.Viewer.CameraControl.Near = value;
|
|
|
|
|
app.Viewer.UpdateRender();
|
|
|
|
|
}, 10);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
render()
|
|
|
|
|
{
|
|
|
|
|
const { CameraSettingStore } = this;
|
|
|
|
|
const IsOrthographicCamera = app.Viewer.CameraCtrl.CameraType === CameraType.OrthographicCamera;
|
|
|
|
|
return (
|
|
|
|
|
<Popover
|
|
|
|
|
onOpening={() =>
|
|
|
|
@ -37,7 +49,7 @@ export default class CameraSetting extends Component
|
|
|
|
|
<div className='CameraSettingItem'>
|
|
|
|
|
<Label>锁定相机旋转</Label>
|
|
|
|
|
<Switch size={30}
|
|
|
|
|
disabled={app.Viewer.CameraCtrl.CameraType === CameraType.OrthographicCamera}
|
|
|
|
|
disabled={IsOrthographicCamera}
|
|
|
|
|
checked={CameraSettingStore.isCameraRotateLock}
|
|
|
|
|
onChange={(): void =>
|
|
|
|
|
{
|
|
|
|
@ -60,7 +72,7 @@ export default class CameraSetting extends Component
|
|
|
|
|
<div className='CameraSettingItem'>
|
|
|
|
|
<Label>相机模式</Label>
|
|
|
|
|
<RadioGroup selectedValue={CameraSettingStore.cameraMode} inline
|
|
|
|
|
disabled={app.Viewer.CameraCtrl.CameraType === CameraType.OrthographicCamera}
|
|
|
|
|
disabled={IsOrthographicCamera}
|
|
|
|
|
onChange={(e: React.FormEvent<HTMLInputElement>) =>
|
|
|
|
|
{
|
|
|
|
|
CameraSettingStore.cameraMode = (e.target as HTMLInputElement).value as CameraMode;
|
|
|
|
@ -74,7 +86,7 @@ export default class CameraSetting extends Component
|
|
|
|
|
<Label>高度</Label>
|
|
|
|
|
<div>
|
|
|
|
|
<Slider
|
|
|
|
|
disabled={app.Viewer.CameraCtrl.CameraType === CameraType.OrthographicCamera}
|
|
|
|
|
disabled={IsOrthographicCamera}
|
|
|
|
|
max={5000}
|
|
|
|
|
min={0}
|
|
|
|
|
value={Number.parseInt((MathUtils.clamp(CameraSettingStore.cameraAltitude, 0, 5000).toFixed(0)))}
|
|
|
|
@ -91,7 +103,7 @@ export default class CameraSetting extends Component
|
|
|
|
|
<NumericInput
|
|
|
|
|
tabIndex={1}
|
|
|
|
|
value={Number.parseInt((MathUtils.clamp(CameraSettingStore.cameraAltitude, 0, 5000).toFixed(0)))}
|
|
|
|
|
disabled={app.Viewer.CameraCtrl.CameraType === CameraType.OrthographicCamera}
|
|
|
|
|
disabled={IsOrthographicCamera}
|
|
|
|
|
allowNumericCharactersOnly={true}
|
|
|
|
|
max={5000}
|
|
|
|
|
onValueChange={(e) =>
|
|
|
|
@ -113,7 +125,7 @@ export default class CameraSetting extends Component
|
|
|
|
|
<div>
|
|
|
|
|
<div className='CameraVison'>
|
|
|
|
|
<Slider
|
|
|
|
|
disabled={app.Viewer.CameraCtrl.CameraType === CameraType.OrthographicCamera}
|
|
|
|
|
disabled={IsOrthographicCamera}
|
|
|
|
|
value={MathUtils.clamp(CameraSettingStore.cameraFov, 30, 120)}
|
|
|
|
|
max={120}
|
|
|
|
|
min={30}
|
|
|
|
@ -157,7 +169,7 @@ export default class CameraSetting extends Component
|
|
|
|
|
value={CameraSettingStore.cameraFov}
|
|
|
|
|
min={30}
|
|
|
|
|
max={120}
|
|
|
|
|
disabled={app.Viewer.CameraCtrl.CameraType === CameraType.OrthographicCamera}
|
|
|
|
|
disabled={IsOrthographicCamera}
|
|
|
|
|
onValueChange={(e) =>
|
|
|
|
|
{
|
|
|
|
|
if (Number.isNaN(e)) return this.CameraSettingStore.cameraFov;
|
|
|
|
@ -168,11 +180,46 @@ export default class CameraSetting extends Component
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div className='CameraSettingItem near'>
|
|
|
|
|
<Label>相机裁剪</Label>
|
|
|
|
|
<div>
|
|
|
|
|
<Slider
|
|
|
|
|
min={0}
|
|
|
|
|
max={20000}
|
|
|
|
|
stepSize={1}
|
|
|
|
|
labelRenderer={false}
|
|
|
|
|
value={CameraSettingStore.near}
|
|
|
|
|
disabled={IsOrthographicCamera}
|
|
|
|
|
onChange={(e) =>
|
|
|
|
|
{
|
|
|
|
|
if (e === 0) e = ViewNearMinSize;
|
|
|
|
|
this.UpdateNear(e);
|
|
|
|
|
}} />
|
|
|
|
|
<NumericInput
|
|
|
|
|
tabIndex={1}
|
|
|
|
|
min={0}
|
|
|
|
|
max={20000}
|
|
|
|
|
allowNumericCharactersOnly={true}
|
|
|
|
|
disabled={IsOrthographicCamera}
|
|
|
|
|
value={CameraSettingStore.near}
|
|
|
|
|
onValueChange={(e) =>
|
|
|
|
|
{
|
|
|
|
|
if (isNaN(e)) return;
|
|
|
|
|
if (e === 0) e = ViewNearMinSize;
|
|
|
|
|
else if (e > 20000)
|
|
|
|
|
e = 20000;
|
|
|
|
|
this.UpdateNear(e);
|
|
|
|
|
}}
|
|
|
|
|
onFocus={(e) => { e.target.select(); }}
|
|
|
|
|
/>
|
|
|
|
|
<div className='unit' style={{ color: IsOrthographicCamera ? "#A6B2BC" : "black" }}>mm</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div className='CameraSettingItem'>
|
|
|
|
|
<Label>行走速度</Label>
|
|
|
|
|
<div>
|
|
|
|
|
<Slider
|
|
|
|
|
disabled={app.Viewer.CameraCtrl.CameraType === CameraType.OrthographicCamera}
|
|
|
|
|
disabled={IsOrthographicCamera}
|
|
|
|
|
max={5}
|
|
|
|
|
min={1}
|
|
|
|
|
value={CameraSettingStore.walkSpeed}
|
|
|
|
@ -186,7 +233,7 @@ export default class CameraSetting extends Component
|
|
|
|
|
max={5}
|
|
|
|
|
min={1}
|
|
|
|
|
allowNumericCharactersOnly={true}
|
|
|
|
|
disabled={app.Viewer.CameraCtrl.CameraType === CameraType.OrthographicCamera}
|
|
|
|
|
disabled={IsOrthographicCamera}
|
|
|
|
|
value={CameraSettingStore.walkSpeed} onValueChange={(e) =>
|
|
|
|
|
{
|
|
|
|
|
if (Number.isNaN(e)) return CameraSettingStore.walkSpeed;
|
|
|
|
|