本文整理汇总了TypeScript中THREE.Scene类的典型用法代码示例。如果您正苦于以下问题：TypeScript Scene类的具体用法？TypeScript Scene怎么用？TypeScript Scene使用的例子？那么, 这里精选的类代码示例或许可以为您提供帮助。
在下文中一共展示了Scene类的10个代码示例，这些例子默认根据受欢迎程度排序。您可以为喜欢或者感觉有用的代码点赞，您的评价将有助于系统推荐出更棒的TypeScript代码示例。
示例1: main
export async function main(target: HTMLElement) {
const THREE = await import("three");
const scene = new THREE.Scene();
const camera = new THREE.PerspectiveCamera(20, 1, 0.002, 1000);
camera.rotation.x = -0.02 * (Math.random() * 0.5 + 0.5);
camera.rotation.y = 0.02 * (Math.random() * 0.5 + 0.5);
const renderer = new THREE.WebGLRenderer();
renderer.setSize(window.innerWidth, window.innerHeight);
target.appendChild(renderer.domElement);
const cube = new THREE.Mesh(
new THREE.BoxGeometry(1, 1, 1),
new THREE.MeshBasicMaterial({ color: "#ff00ff" }),
);
const cube2 = new THREE.Mesh(
new THREE.BoxGeometry(1, 1, 1),
new THREE.MeshBasicMaterial({ color: "#ffff00" }),
);
cube.position.z = -2.1;
cube2.position.z = -2.10001;
cube2.position.x = -0.01;
cube2.position.y = -0.01;
scene.add(cube);
scene.add(cube2);
function render() {
camera.rotation.x += 0.0000001;
renderer.render(scene, camera);
requestAnimationFrame(render);
}
render();
}示例2: initCubeScene
initCubeScene() {
var camera, scene, renderer;
var mesh;
camera = new THREE.PerspectiveCamera(70, window.innerWidth / window.innerHeight, 1, 1000);
camera.position.z = 400;
scene = new THREE.Scene();
//var texture = new THREE.TextureLoader().load('textures/crate.gif');
var geometry = new THREE.BoxBufferGeometry(200, 200, 200);
//var material = new THREE.MeshBasicMaterial({ map: texture });
mesh = new THREE.Mesh(geometry);
scene.add(mesh);
renderer = new THREE.WebGLRenderer();
renderer.setPixelRatio(window.devicePixelRatio);
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);
window.addEventListener('resize', onWindowResize, false);
animate();
function onWindowResize() {
camera.aspect = window.innerWidth / window.innerHeight;
camera.updateProjectionMatrix();
renderer.setSize(window.innerWidth, window.innerHeight);
}
function animate() {
requestAnimationFrame(animate);
mesh.rotation.x += 0.005;
mesh.rotation.y += 0.01;
renderer.render(scene, camera);
}
}示例3: init
function init() {
scene = new THREE.Scene();
camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 1, 10000 );
camera.position.z = 1000;
geometry = new THREE.BoxGeometry( 200, 200, 200 );
material = new THREE.MeshBasicMaterial( { color: 0xff0000, wireframe: true } );
mesh = new THREE.Mesh( geometry, material );
scene.add( mesh );
renderer = new THREE.WebGLRenderer();
renderer.setSize( window.innerWidth, window.innerHeight );
document.body.appendChild( renderer.domElement );
}示例4: super
super(container, motionTracker, (scene: Scene, renderer: WebGLRenderer) => {
var camera = new PerspectiveCamera(100, window.innerWidth / window.innerHeight, 50, 1000000);
scene.add(camera);
scene.add(new AmbientLight(0xffdddd, 0.1))
camera.position.z = 0;
camera.lookAt(new Vector3(0, 0, 500));
light = new SpotLight(0xffffff, 1, 7000, 0.6, 1, 2);
light.add(new PointLight(0xffffff, 0.4, 5000));
scene.add(light);
return camera;
}, () => {示例5: constructor
constructor(rendererSettings: THREE.WebGLRendererParameters = {},
cameraSettings: PerspectiveCameraParameters = {}){
super();
this.addClass('ThreeRendererWidget');
this._scene = new THREE.Scene();
this._canvas = document.createElement('canvas');
$(this._canvas).css({position: "absolute"});
rendererSettings.canvas = this._canvas;
this._renderer = new THREE.WebGLRenderer(rendererSettings);
this._camera = new THREE.PerspectiveCamera(cameraSettings.fov,
cameraSettings.aspect,
cameraSettings.near,
cameraSettings.far);
this._scene.add(this._camera);
this._renderer.render(this._scene, this._camera);
this.node.appendChild(this._canvas);
}示例6: WebGLRenderer
const BACKGROUND_COLOR = 0xF0F0F0;
const SNAKE_COLOR = 0x00FF00;
const LIGHT_COLOR = 0xFFFFFF;
// Create a WebGL renderer, camera
// and a scene
const renderer = new WebGLRenderer();
const camera =
new PerspectiveCamera(
VIEW_ANGLE,
ASPECT,
NEAR,
FAR
);
const scene = new Scene();
// Add the camera to the scene.
scene.add(camera);
// Start the renderer.
renderer.setSize(WIDTH, HEIGHT);
// Attach the renderer-supplied
// DOM element.
document.body.appendChild(renderer.domElement);
const Orientation = {
UP: new Vector3(0, 1, 0),
DOWN: new Vector3(0, -1, 0),
LEFT: new Vector3(-1, 0, 0),示例7:
sceneObjects.reduce((offset, mesh) => {
mesh.position.set(offset, 100, 100)
scene.add(mesh)
offset += sphereDiameter + sceneObjectOffset
return offset
}, centeredContentOffset)示例8: updateTerrain
public updateTerrain(terrain:Terrain) {
if (!terrain.initialized) {
return;
}
this.terrain = terrain;
if (this.terrainMesh) {
this.scene.remove(this.terrainMesh);
this.meshFactory.disposeMesh(this.terrainMesh);
}
this.terrainMesh = this.meshFactory.createTerrainMesh(this.terrain, this.heightStretch, this.widthStretch, this.viewWidth, this.viewDepth);
this.scene.add(this.terrainMesh);
if (this.terrainTexture&&this.terrainTexture.initialized) {
this.updateTerrainTexture(this.terrainTexture);
}
this.updateArmies(this.armies);
this.updateMovements(this.movements);
}示例9: resetBall
export function resetBall() {
scene.add(ballModel);
ballModel.position.set(0, shared.ballPhysics.initialY, 0);
ballModel.material.transparent = false;
ballModel.material.opacity = 1;
ballMarker.position.set(0, 0.01, 0);
ballMarker.visible = true;
}示例10:
movementList.forEach((movement) => {
let movementMesh:Mesh = this.meshFactory.createMovementMesh(movement, this.getDisplayPosition(movement.from), this.getDisplayPosition(movement.to));
this.movementMeshes.push(movementMesh);
this.scene.add(movementMesh);
})