tink/nerfstudio
4
0
Fork 0
mirror of https://github.com/nerfstudio-project/nerfstudio.git synced 2026-11-11 10:34:29 +08:00
Code

added camera labels on the scene (#437)

Browse Source 
got some labels on some cams
This commit is contained in:
evonneng 2022-09-14 17:12:23 -07:00 committed by GitHub
parent d3ba8f34ed
commit e6fe546bb2
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 30 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
nerfactory/viewer/app/src/modules/Scene/Scene.jsx
View File

@ -3,6 +3,8 @@ import * as THREE from 'three';
import { useContext, useEffect } from 'react';
import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls';
import { CSS2DRenderer } from 'three/examples/jsm/renderers/CSS2DRenderer';
import { TransformControls } from 'three/examples/jsm/controls/TransformControls';
import { useDispatch } from 'react-redux';
import { drawCamera, drawSceneBounds } from './drawing';
@ -12,6 +14,7 @@ import SceneNode from '../../SceneNode';
import { WebSocketContext } from '../WebSocket/WebSocket';
import { subscribe_to_changes } from '../../subscriber';
const msgpack = require('msgpack-lite');
const SCENE_BOUNDS_NAME = 'Scene Bounds';
@ -51,6 +54,13 @@ export function get_scene_tree() {
renderer.setPixelRatio(window.devicePixelRatio);
sceneTree.metadata.renderer = renderer;
const labelRenderer = new CSS2DRenderer();
labelRenderer.setSize( window.innerWidth, window.innerHeight );
labelRenderer.domElement.style.position = 'absolute';
labelRenderer.domElement.style.top = '0px';
document.body.appendChild( labelRenderer.domElement );
sceneTree.metadata.labelRenderer = labelRenderer;
// Camera Controls
const camera_controls = new OrbitControls(main_camera, renderer.domElement);
camera_controls.rotateSpeed = 2.0;

17
nerfactory/viewer/app/src/modules/SidePanel/CameraPanel/CameraPanel.jsx
View File

@ -18,6 +18,7 @@ import PlayArrowIcon from '@mui/icons-material/PlayArrow';
import TextField from '@mui/material/TextField';
import Tooltip from '@mui/material/Tooltip';
import VisibilityIcon from '@mui/icons-material/Visibility';
import { CSS2DObject } from 'three/examples/jsm/renderers/CSS2DRenderer';
import { CameraHelper } from './CameraHelper';
import { get_curve_object_from_cameras, get_transform_matrix } from './curve';
import { WebSocketContext } from '../../WebSocket/WebSocket';
@ -172,11 +173,27 @@ export default function CameraPanel(props) {
// draw cameras and curve to the scene
useEffect(() => {
// draw the cameras
const labels = Array.from(document.getElementsByClassName('label'));
labels.forEach(label => {
label.remove();
});
sceneTree.delete(['Camera Path', 'Cameras']); // delete old cameras, which is important
for (let i = 0; i < cameras.length; i += 1) {
const camera = cameras[i];
// camera.aspect = render_width / render_height;
const camera_helper = new CameraHelper(camera, 0x393e46);
const labelDiv = document.createElement( 'div' );
labelDiv.className = 'label';
labelDiv.textContent = i;
labelDiv.style.color = "black";
const camera_label = new CSS2DObject( labelDiv );
camera_label.position.set( 0, -0.1, -0.1 );
camera_helper.add( camera_label );
camera_label.layers.set( 0 );
// camera
sceneTree.set_object_from_path(
['Camera Path', 'Cameras', i.toString(), 'Camera'],

3
nerfactory/viewer/app/src/modules/ViewerWindow/ViewerWindow.jsx
View File

@ -104,6 +104,7 @@ export default function ViewerWindow(props) {
const sceneTree = props.sceneTree;
const scene = sceneTree.object;
const renderer = sceneTree.metadata.renderer;
const labelRenderer = sceneTree.metadata.labelRenderer;
const myRef = useRef(null);
const websocket = useContext(WebSocketContext).socket;
@ -145,6 +146,7 @@ export default function ViewerWindow(props) {
sceneTree.metadata.camera.aspect = viewportWidth / viewportHeight;
sceneTree.metadata.camera.updateProjectionMatrix();
renderer.setSize(viewportWidth, viewportHeight);
labelRenderer.setSize(viewportWidth, viewportHeight);
};
// update the camera information in the python server
@ -202,6 +204,7 @@ export default function ViewerWindow(props) {
sceneTree.metadata.camera.updateProjectionMatrix();
sceneTree.metadata.camera_controls.update();
renderer.render(scene, sceneTree.metadata.camera);
labelRenderer.render(scene, sceneTree.metadata.camera);
stats.update();
};