javascript - 如何使用 Three.js 按窗口宽度缩放内容?

标签 javascript three.js

所以我正在使用基本的窗口调整大小代码:

function onWindowResize() {

    windowHalfX = window.innerWidth / 2;
    windowHalfY = window.innerHeight / 2;

    camera.aspect = window.innerWidth / window.innerHeight;
    camera.updateProjectionMatrix();

    renderer.setSize( window.innerWidth, window.innerHeight );

}

它会很好地调整窗口的大小——但它会根据窗口的高度而不是窗口的宽度来缩放内容。对于我正在构建的网站,保持内容的可见宽度比高度更重要,但无法找到一种方法来反转代码以根据宽度而不是高度进行缩放。

您可以在此处查看我正在处理的问题:http://sunsetfootclinicsign.com/signtest_9.html

如果有任何正确方向的线索,我将不胜感激!非常感谢!

最佳答案

你可以试试

geometry.computeBoundingBox();

然后可以从 geometry.boundingBox 计算尺寸。

关于javascript - 如何使用 Three.js 按窗口宽度缩放内容?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18248309/

相关文章:

three.js - 将图像与点云对齐

javascript - Coffeescript 意外换行

javascript - D3.js 在指定 nodeSize 时获取树的渲染尺寸

javascript - 如何显示外部站点但保留应用程序标题

javascript - 更新 DecalGeometry 顶点、UV、

javascript - 在 ThreeJS 中动画贝塞尔曲线

javascript - Three.js 如何确保模型加载后加载其他 javascript 文件

javascript - cytoscape.js webgl 渲染器

javascript - 如何使用变量内容读取对象数组的内容

javascript - Algolia Places 错误 'container' 必须指向 <input> 元素