mirror of
https://github.com/tengge1/ShadowEditor.git
synced 2026-01-25 15:08:11 +00:00
修改。
This commit is contained in:
parent
880dade749
commit
5a5fa336cd
@ -22,6 +22,23 @@
|
||||
<script src="../assets/js/three.js"></script>
|
||||
<script src="../assets/js/controls/OrbitControls.js"></script>
|
||||
<script>
|
||||
// function getUIMaterial() {
|
||||
// return new THREE.ShaderMaterial({
|
||||
// uniforms: {
|
||||
// texture: null,
|
||||
// },
|
||||
|
||||
// vertexShader: [
|
||||
// 'void main {',
|
||||
// ' gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0);',
|
||||
// '}',
|
||||
// ].join('\n'),
|
||||
// fragmentShader: [
|
||||
// 'uniform sampler2D map',
|
||||
// ].join('\n'),
|
||||
// });
|
||||
// }
|
||||
|
||||
function getPrepareMaskMaterial() {
|
||||
return new THREE.ShaderMaterial({
|
||||
|
||||
@ -240,14 +257,17 @@
|
||||
});
|
||||
}
|
||||
|
||||
var width = window.innerWidth;
|
||||
var height = window.innerHeight;
|
||||
|
||||
var scene = new THREE.Scene();
|
||||
|
||||
var camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
|
||||
var camera = new THREE.PerspectiveCamera(75, width / height, 0.1, 1000);
|
||||
camera.position.set(4.534318418390707, 2.767285132678359, 2.4065417148044856);
|
||||
camera.lookAt(new THREE.Vector3());
|
||||
|
||||
var renderer = new THREE.WebGLRenderer();
|
||||
renderer.setSize(window.innerWidth, window.innerHeight);
|
||||
renderer.setSize(width, height);
|
||||
document.body.appendChild(renderer.domElement);
|
||||
|
||||
new THREE.OrbitControls(camera, renderer.domElement);
|
||||
@ -269,18 +289,35 @@
|
||||
var cube = new THREE.Mesh(geometry, material);
|
||||
scene.add(cube);
|
||||
|
||||
// 边框相关
|
||||
var helperCamera = new THREE.OrthographicCamera();
|
||||
// 帮助场景
|
||||
var helpScene = new THREE.Scene();
|
||||
|
||||
// 绘制目标
|
||||
var renderTarget = new THREE.WebGLRenderTarget(width, height);
|
||||
|
||||
// 帮助物体
|
||||
var helpGeometry = new THREE.PlaneBufferGeometry(width, height);
|
||||
var helpMaterial = new THREE.MeshBasicMaterial({
|
||||
map: renderTarget.texture,
|
||||
});
|
||||
var helpPlane = new THREE.Mesh(helpGeometry, helpMaterial);
|
||||
helpPlane.rotation.x = -Math.PI / 2;
|
||||
helpScene.add(helpPlane);
|
||||
|
||||
// 正交相机
|
||||
var helpCamera = new THREE.OrthographicCamera(-width / 2, width / 2, height / 2, -height / 2, 0.1, 1000);
|
||||
helpCamera.position.y = 10;
|
||||
helpCamera.lookAt(new THREE.Vector3());
|
||||
|
||||
// 深度材质
|
||||
var depthMaterial = new THREE.MeshDepthMaterial();
|
||||
depthMaterial.side = THREE.DoubleSide;
|
||||
depthMaterial.depthPacking = THREE.RGBADepthPacking;
|
||||
depthMaterial.blending = THREE.NoBlending;
|
||||
|
||||
// 纹理矩阵
|
||||
var textureMatrix = new THREE.Matrix4();
|
||||
|
||||
var renderTarget = new THREE.WebGLRenderTarget(renderer.domElement.width, renderer.domElement.width.height);
|
||||
|
||||
var animate = function () {
|
||||
requestAnimationFrame(animate);
|
||||
|
||||
@ -298,11 +335,14 @@
|
||||
// depth material
|
||||
scene.overrideMaterial = depthMaterial;
|
||||
renderer.setRenderTarget(renderTarget);
|
||||
renderer.render(scene, camera);
|
||||
|
||||
//
|
||||
scene.overrideMaterial = null;
|
||||
|
||||
// 渲染帮助场景
|
||||
renderer.setRenderTarget(null);
|
||||
renderer.render(scene, camera);
|
||||
renderer.render(helpScene, helpCamera);
|
||||
};
|
||||
|
||||
animate();
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user