javascript - 自定义几何和面法线问题-6ren

javascript - 自定义几何和面法线问题

转载作者：行者123 更新时间：2023-11-29 17:23:38

26

4

我是 ThreeJS 的新手，我有一个小问题(可能是错误的用法)。我正在尝试创建自定义几何体并自行定义面法线。

我在一个方向上创建了一个法线，在相反方向上创建了另一个法线，因为我的网格不是双面的，我希望只看到其中一个面，但是我可以看到他们两个......任何想法我做错了吗？

谢谢!

<body>

    <script src="../build/Three.js"></script>

    <script src="js/Stats.js"></script>

    <script>
        var container, stats;

        var camera, scene, renderer;


            container = document.createElement( 'div' );
            document.body.appendChild( container );

            scene = new THREE.Scene();

            camera = new THREE.PerspectiveCamera( 45, window.innerWidth / window.innerHeight, 1, 2000 );
            camera.up.x = 0;
            camera.up.y = 0;
            camera.up.z = 1;

            camera.position.x = 300;
            camera.position.y = -1000;
            camera.position.z = 1000;

            camera.lookAt(new THREE.Vector3(300, 250, 0));
            scene.add( camera );

            var light, geometry, material;

            scene.add( new THREE.AmbientLight( 0x404040 ) );

            light = new THREE.DirectionalLight( 0xffffff );
            light.position.set( 0, 1, 0 );
            scene.add( light );

            material = new THREE.MeshBasicMaterial( { color: 0xFFFF00, wireframe: false, transparent: false, opacity: 1 } );

            geometry = new THREE.Geometry();
            geometry.vertices.push(new THREE.Vector3(0,0,0));
            geometry.vertices.push(new THREE.Vector3(600,0,0));
            geometry.vertices.push(new THREE.Vector3(0,-500,0));
            geometry.vertices.push(new THREE.Vector3(600,-500,0));
            var face;

            face = new THREE.Face3(0,2,1);
            face.normal.set(0,0,-1);
            geometry.faces.push(face);
            face = new THREE.Face3(2,3,1);
            face.normal.set(0,0,1);
            geometry.faces.push(face);

            geometry.computeCentroids();
            //geometry.computeFaceNormals();
            //geometry.computeTangents();

            var mesh = new THREE.Mesh(geometry, material);

            scene.add(mesh);

            renderer = new THREE.WebGLRenderer( { antialias: true } );
            renderer.setSize( window.innerWidth, window.innerHeight );

            container.appendChild( renderer.domElement );

            renderer.render( scene, camera );


    </script>

</body>

最佳答案

WebGLRenderer 使用您创建面的顶点顺序而不是法线来定义方向。尝试这样做:

face = new THREE.Face3(2,1,3);

关于javascript - 自定义几何和面法线问题，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/10886818/

26

4

0

文章推荐： javascript - Facebook 登录按钮回调函数

文章推荐： android - Ionic 应用程序 - 无法访问互联网

文章推荐： javascript - onload 和 onclick 页面上的 jquery 函数调用？

wpf - 我如何将简单的形状位图转换为矢量(几何)
我想知道是否可以将简单的位图转换为几何对象最佳答案是的，您可以使用跟踪。 Potrace是一个开源的位图到矢量跟踪器库。然而，位图追踪并不完美。对于高质量的矢量图像，line tracer 一般
math - 几何:找到点两点之间的特定距离
这类似于this question，但是却相反。我有两个地理位置(纬度，经度)A和B。假设它们相距40海里。我想计算在A和B之间的直线上，从A点起10海里处的坐标。数学(我每天使用的其他一些数学)，
javascript - 几何 - 计算点到线的距离
我想计算一个点到由 2 个点定义的直线的距离。我正在使用 javascript，这就是我使用维基百科得出的结论:https://en.wikipedia.org/wiki/Distance_from
c++ - boost 、几何
我对 boost::geomentry 有疑问。 #include #include #include #include int main(){ typedef boost::geometry
c++ - 几何、交集
我有一个问题。我想将四边形与四边形相交。 int main(){ typedef boost::geometry::model::point_xy TBoostPoint; typedef b
c++ - 几何 -> OpenGL
我无法在 OpleGL 中获得正确的转换。我有 point3D - P(X,Y,Z) 和投影矩阵 M，它等于 K*(R|T) 其中 K - 相机标定矩阵 (R|T)——点(物)坐标系变换(R——旋转
algorithm - 几何 - 两侧为凸面的两个圆围绕几何中心旋转
我想做一个凸面(由一些直线或圆弧组成)围绕它的几何中心(Cx,Cy)旋转。同时凸面两侧有两个圆(由半径给出:R 和左中心:(Lx,Cy)，右中心:(Rx,Cy))。表示与几何(Cy) X 轴相同的圆心
.net - 几何 HitTest 中的错误
我有一个 DrawingVisual表示路径的元素，该路径的几何描述由此 syntax : "m106,59.3c0-1.98,0,0-4.95,0.989-3.96,0.989-13.8,3.96-
python - 如何创建图神经网络数据集？ (pytorch 几何)
如何将我自己的数据集转换为可供 pytorch 几何图形神经网络使用的数据集？所有教程都使用已转换为 pytorch 可用的现有数据集。例如，如果我有自己的点云数据集，我如何使用它来训练图神经网络的
python - 无法从类传递调整大小的 QLabel 几何
我正在使用 PyQt5 和 OpenCV。我想创建一个读取视频帧并执行橡皮筋拉伸(stretch)以生成几何图形的类，该几何图形将由不同的类用于裁剪视频流(此示例中不包括第二类)。在此示例中，从网络
database - 最近的(几何)点作为外键
我们有两个 (PostgreSQL 9.2) 表。第一城市: loc_id | integer | not null name | character
sql - Postgis 几何 where 条件
我有一张 table : create table if not exists places( id bigserial not null constraint places_pkey primary
postgresql - 在不查询数据库的情况下将经纬度转换为 PostGIS 几何
我在 postgresql 中有一个带有 PostGIS geometry(point, 4326) 列(位置，使用 SRID 4326)的表，我有一个使用 SQL Alchemy 更新表(其余列)的
C++ 11和 boost 几何
我开始使用 c++11 并尝试使用 boost geometry 运行一些示例代码 #include #include #include #include BOOST_GEOMETRY_REG
python - 将一列多边形从字符串转换为 GeoPandas 几何
我有一个存储为 csv 文件的数据框，其中一列是多边形对象。但是，此列存储为字符串而不是 GeoPandas 几何对象。如何将此列转换为 Geopandas 几何对象以便执行地理分析？这是我的数据的
opencv - 多 View 几何
我从两台相同品牌的相机拍摄的两张图像相距一定距离，拍摄相同的场景。我想计算两个相机之间的真实世界旋转和平移。为了实现这一点，我首先提取了两个图像的 SIFT 特征并匹配它们。我现在有了基本矩阵以及单
c++ - boost 几何/空间查询形状
我目前正在使用 boost 几何/空间索引库，以便对 3d 边界框执行范围查询。例如，我能够获得与查询边界框重叠的所有边界框的列表。文档 ( http://www.boost.org/doc/lib
c++ - 使用运行时指定尺寸的 boost 几何
boost::geometry::model::point 将点的维度作为编译时参数。例如， typedef bg::model::point point; 有没有什么方法可以在运行时指定维度，比如说
javascript - 将纹理添加到自定义 three.js 几何
我一直在寻找一种在 three.js 中将 uv 映射添加到我的自定义几何体的方法。我找到了这样做的方法，但我找到的解决方案都没有用。谁能解释一下 uv-mapping 的工作原理以及如何正确使用它？
iphone - 数学(几何): Rectangle projection?
在我的应用程序中，用户可以使用 iPhone 的 GPS 定义足球场的三个角落，方法是一个接一个地走到角落，然后点击按钮。这很好用，我可以在屏幕上绘制生成的矩形，类似于它在 Google map 中的

首页

博学

6Ren·AI

商城

javascript - 自定义几何和面法线问题