|
|
@ -1,6 +1,7 @@
|
|
|
|
import { Button, Icon, Label, NumericInput, Popover, Position, Radio, RadioGroup, Slider, Switch, Tooltip } from '@blueprintjs/core';
|
|
|
|
import { Button, Icon, Label, NumericInput, Popover, Position, Radio, RadioGroup, Slider, Switch, Tooltip } from '@blueprintjs/core';
|
|
|
|
import { observer } from 'mobx-react';
|
|
|
|
import { observer } from 'mobx-react';
|
|
|
|
import React, { Component } from 'react';
|
|
|
|
import React, { Component } from 'react';
|
|
|
|
|
|
|
|
import { MathUtils } from 'three';
|
|
|
|
import { app, CameraRoamType } from '../../../../ApplicationServices/Application';
|
|
|
|
import { app, CameraRoamType } from '../../../../ApplicationServices/Application';
|
|
|
|
import { CameraType } from '../../../../GraphicsSystem/CameraUpdate';
|
|
|
|
import { CameraType } from '../../../../GraphicsSystem/CameraUpdate';
|
|
|
|
import CameraSettingStore, { CameraMode } from './CameraSettingStore';
|
|
|
|
import CameraSettingStore, { CameraMode } from './CameraSettingStore';
|
|
|
@ -32,7 +33,9 @@ export default class CameraSetting extends Component
|
|
|
|
<div className='CameraSettingPanel'>
|
|
|
|
<div className='CameraSettingPanel'>
|
|
|
|
<div className='CameraSettingItem'>
|
|
|
|
<div className='CameraSettingItem'>
|
|
|
|
<Label>锁定相机旋转</Label>
|
|
|
|
<Label>锁定相机旋转</Label>
|
|
|
|
<Switch size={30} disabled={app.Viewer.CameraCtrl.CameraType === CameraType.OrthographicCamera}
|
|
|
|
<Switch size={30}
|
|
|
|
|
|
|
|
disabled={app.Viewer.CameraCtrl.CameraType === CameraType.OrthographicCamera}
|
|
|
|
|
|
|
|
checked={CameraSettingStore.isCameraRotateLock}
|
|
|
|
onChange={(): void =>
|
|
|
|
onChange={(): void =>
|
|
|
|
{
|
|
|
|
{
|
|
|
|
CameraSettingStore.isCameraRotateLock = !CameraSettingStore.isCameraRotateLock;
|
|
|
|
CameraSettingStore.isCameraRotateLock = !CameraSettingStore.isCameraRotateLock;
|
|
|
@ -71,7 +74,7 @@ export default class CameraSetting extends Component
|
|
|
|
disabled={app.Viewer.CameraCtrl.CameraType === CameraType.OrthographicCamera}
|
|
|
|
disabled={app.Viewer.CameraCtrl.CameraType === CameraType.OrthographicCamera}
|
|
|
|
max={5000}
|
|
|
|
max={5000}
|
|
|
|
min={0}
|
|
|
|
min={0}
|
|
|
|
value={CameraSettingStore.cameraAltitude > 5000 ? 5000 : CameraSettingStore.cameraAltitude}
|
|
|
|
value={Number.parseInt((MathUtils.clamp(CameraSettingStore.cameraAltitude, 0, 5000).toFixed(0)))}
|
|
|
|
onChange={(e) =>
|
|
|
|
onChange={(e) =>
|
|
|
|
{
|
|
|
|
{
|
|
|
|
CameraSettingStore.cameraAltitude = e;
|
|
|
|
CameraSettingStore.cameraAltitude = e;
|
|
|
@ -82,12 +85,21 @@ export default class CameraSetting extends Component
|
|
|
|
app.Viewer.CameraControl.UpdateCameraMatrix();
|
|
|
|
app.Viewer.CameraControl.UpdateCameraMatrix();
|
|
|
|
app.Editor.UpdateScreen();
|
|
|
|
app.Editor.UpdateScreen();
|
|
|
|
}} />
|
|
|
|
}} />
|
|
|
|
<NumericInput style={{ fontSize: '12px' }} value={CameraSettingStore.cameraAltitude}
|
|
|
|
<NumericInput style={{ fontSize: '12px' }}
|
|
|
|
|
|
|
|
value={Number.parseInt((MathUtils.clamp(CameraSettingStore.cameraAltitude, 0, 5000).toFixed(0)))}
|
|
|
|
disabled={app.Viewer.CameraCtrl.CameraType === CameraType.OrthographicCamera}
|
|
|
|
disabled={app.Viewer.CameraCtrl.CameraType === CameraType.OrthographicCamera}
|
|
|
|
|
|
|
|
allowNumericCharactersOnly={true}
|
|
|
|
|
|
|
|
max={5000}
|
|
|
|
onValueChange={(e) =>
|
|
|
|
onValueChange={(e) =>
|
|
|
|
{
|
|
|
|
{
|
|
|
|
|
|
|
|
if (Number.isNaN(e) || !Number.isFinite(e)) return CameraSettingStore.cameraAltitude;
|
|
|
|
if (e < 0) return;
|
|
|
|
if (e < 0) return;
|
|
|
|
CameraSettingStore.cameraAltitude = e;
|
|
|
|
CameraSettingStore.cameraAltitude = e;
|
|
|
|
|
|
|
|
let dif = app.Viewer.Camera.position.z - e;
|
|
|
|
|
|
|
|
app.Viewer.Camera.position.z = e;
|
|
|
|
|
|
|
|
app.Viewer.CameraControl.Target.z -= dif;
|
|
|
|
|
|
|
|
app.Viewer.CameraControl.UpdateCameraMatrix();
|
|
|
|
|
|
|
|
app.Editor.UpdateScreen();
|
|
|
|
}}
|
|
|
|
}}
|
|
|
|
/>
|
|
|
|
/>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
@ -98,7 +110,7 @@ export default class CameraSetting extends Component
|
|
|
|
<div className='CameraVison'>
|
|
|
|
<div className='CameraVison'>
|
|
|
|
<Slider
|
|
|
|
<Slider
|
|
|
|
disabled={app.Viewer.CameraCtrl.CameraType === CameraType.OrthographicCamera}
|
|
|
|
disabled={app.Viewer.CameraCtrl.CameraType === CameraType.OrthographicCamera}
|
|
|
|
value={CameraSettingStore.cameraFov < 30 ? 30 : CameraSettingStore.cameraFov}
|
|
|
|
value={MathUtils.clamp(CameraSettingStore.cameraFov, 30, 120)}
|
|
|
|
max={120}
|
|
|
|
max={120}
|
|
|
|
min={30}
|
|
|
|
min={30}
|
|
|
|
onChange={(e: number) =>
|
|
|
|
onChange={(e: number) =>
|
|
|
@ -128,14 +140,16 @@ export default class CameraSetting extends Component
|
|
|
|
广角
|
|
|
|
广角
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<NumericInput allowNumericCharactersOnly={false}
|
|
|
|
<NumericInput allowNumericCharactersOnly={true}
|
|
|
|
value={CameraSettingStore.cameraFov}
|
|
|
|
value={CameraSettingStore.cameraFov}
|
|
|
|
min={0}
|
|
|
|
min={30}
|
|
|
|
|
|
|
|
max={120}
|
|
|
|
disabled={app.Viewer.CameraCtrl.CameraType === CameraType.OrthographicCamera}
|
|
|
|
disabled={app.Viewer.CameraCtrl.CameraType === CameraType.OrthographicCamera}
|
|
|
|
onValueChange={(e) =>
|
|
|
|
onValueChange={(e) =>
|
|
|
|
{
|
|
|
|
{
|
|
|
|
if (e === NaN) return;
|
|
|
|
if (Number.isNaN(e)) return this.CameraSettingStore.cameraFov;
|
|
|
|
if (e > 120) return;
|
|
|
|
if (e > 120) return;
|
|
|
|
|
|
|
|
if (e === 0) return this.CameraSettingStore.cameraFov;
|
|
|
|
this.AlterCameraVision(e);
|
|
|
|
this.AlterCameraVision(e);
|
|
|
|
}}
|
|
|
|
}}
|
|
|
|
/>
|
|
|
|
/>
|
|
|
@ -161,6 +175,7 @@ export default class CameraSetting extends Component
|
|
|
|
disabled={app.Viewer.CameraCtrl.CameraType === CameraType.OrthographicCamera}
|
|
|
|
disabled={app.Viewer.CameraCtrl.CameraType === CameraType.OrthographicCamera}
|
|
|
|
value={CameraSettingStore.walkSpeed} onValueChange={(e) =>
|
|
|
|
value={CameraSettingStore.walkSpeed} onValueChange={(e) =>
|
|
|
|
{
|
|
|
|
{
|
|
|
|
|
|
|
|
if (Number.isNaN(e)) return CameraSettingStore.walkSpeed;
|
|
|
|
if (e > 5 || e < 1) return;
|
|
|
|
if (e > 5 || e < 1) return;
|
|
|
|
CameraSettingStore.walkSpeed = e;
|
|
|
|
CameraSettingStore.walkSpeed = e;
|
|
|
|
app.CameraFlySpeed = e;
|
|
|
|
app.CameraFlySpeed = e;
|
|
|
|