简体   繁体   English

Three.js是否具有等效的背面可见性?

[英]Is there a backface-visibility equivalent for three.js?

I have an object with a mesh that uses a semi-transparent png texture. 我有一个带有使用半透明png纹理的网格物体。

Is there a flag or option for the MeshBasicMaterial so that the back of the object is visible through the front? MeshBasicMaterial是否有一个标志或选项,以便可以从正面看到对象的背面?

Here is some sample code: 这是一些示例代码:

var texture = THREE.ImageUtils.loadTexture('world.png');

// create the sphere's material
var sphereMaterial = new THREE.MeshBasicMaterial({
    map: texture,
    transparent: true,
    blending: THREE.AdditiveAlpha
});

sphereMaterial.depthTest = false;

// set up the sphere vars
var radius = 50, segments = 20, rings = 20;

// create a new mesh with sphere geometry -
var sphere = new THREE.SceneUtils.createMultiMaterialObject(
    new THREE.SphereGeometry(radius, segments, rings),[
    sphereMaterial,
    new THREE.MeshBasicMaterial({
        color: 0xa7f1ff,
        opacity: 0.6,
        wireframe: true
        })
   ]);

This will accurately render the sphere but the back remains invisible. 这样可以准确地渲染球体,但背面仍然不可见。

The new way to do this is by using the side property of material . 做到这一点的新方法是利用materialside特性。

Example: 例:

new THREE.MeshPhongMaterial( { map: texture, side: THREE.BackSide } )

Possible values are THREE.FrontSide , THREE.BackSide and THREE.DoubleSide . 可能的值为THREE.FrontSideTHREE.BackSideTHREE.DoubleSide

See: https://github.com/mrdoob/three.js/wiki/Migration 参见: https : //github.com/mrdoob/three.js/wiki/Migration

backface属性是在网格物体本身中设置的:

sphere.doubleSided = true;

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 CSS:图片而不是背面可见性=隐藏 - CSS : picture instead of backface-visibility = hidden 禁用导入的.obj文件three.js的背面剔除 - disable backface culling for imported .obj file three.js CSS3属性“背面可见性”不适用于任何IE版本 - CSS3 property 'backface-visibility' not working with any IE versions IE11是否有“Backface-visibility:hidden”替代方案? - Is there a “Backface-visibility:hidden” alternative for IE11? 如何在Three.js中设置可见性动画? - How to animate visibility in three.js? 如何让使用背面可见性的图像在转换后不消失? - How do I get my image that uses backface-visibility to not disappear after transforming? Chrome中可能存在的错误 - 使用背面可见性时,视频控件仍然可见:隐藏在HTML5视频上 - Possible bug in Chrome - Video controls are still visible when using backface-visibility:hidden on HTML5 videos Chrome 无法正确识别背面。(HTML,CSS,背面可见性:隐藏) - Chrome doesn't properly recognize the back side.(HTML, CSS, backface-visibility: hidden) three.js通过GUI打开和关闭对象可见性 - three.js switching objects visibility on and off through GUI 当父 THREE.js 组的可见性改变时改变 CSS2D 对象的可见性 - Change visibility of CSS2D objects when a parent THREE.js Group has its visibility changed
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM