Попытка получить доступ к аргументам функции из внутренней функции

Я использую three.js и скрипт, похожий на OrbitControls, в качестве контроллера. В моем файле main.js есть THREE.Group(), который передается контроллеру в качестве аргумента. Оттуда я пытаюсь повернуть всю группу.
Проблема 1: как только группа передана контроллеру, я больше не могу получить доступ к ее свойствам, не сделав копию
Проблема 2: копия не содержит всего THREE.Group(), а только первого потомка

Я работаю над этим уже несколько часов и перепробовал около 50 разных вещей, включая все, что имеет отношение к stackoverflow. У меня совершенно нет идей, как бороться с этой проблемой.

main.js

let container;
let camera; 
let controls;
let game;
let renderer;
let scene;

function init() {
    container = document.querySelector('#scene-container');
    scene = new THREE.Scene();

    const fov = 35;
    const aspect = container.clientWidth / container.clientHeight;
    const near = 0.1;
    const far = 100;
    camera = new THREE.PerspectiveCamera(fov, aspect, near, far);

  //***** This is the important line ******
    controls = new THREE.ObjectControls(camera, container, game);

    game = new THREE.Group();
    scene.add(game);

    const geometry = new THREE.BoxGeometry();
    const material = new THREE.MeshBasicMaterial();

    var mesh1 = new THREE.Mesh(geometry, material);
    game.add(mesh1);
    var mesh2 = new THREE.Mesh(geometry, material);
    mesh2.position.set(0,1,0);
    game.add(mesh2);

    renderer = new THREE.WebGLRenderer();
    renderer.setSize(container.clientWidth, container.clientHeight);
    renderer.setPixelRatio(window.devicePixelRatio);
    container.appendChild(renderer.domElement);

    renderer.setAnimationLoop(() => {
        renderer.render(scene, camera);
    });
}

init();

ObjectControls.js

THREE.ObjectControls = function (camera, domElement, objectToMove) {
    mesh = objectToMove;
    domElement.addEventListener('mousemove', mouseMove, false);

    function mouseMove(e) {
        //** objectToMove is undefined :( **
        mesh.rotation.y += 3;        
    }
};

Ожидаемый результат состоит в том, что весь THREE.Group()game будет повернут, но результат, который я получаю, заключается в том, что вращается только первый дочерний элемент game, в данном случае mesh1.

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
1
0
37
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий
controls = new THREE.ObjectControls(camera, container, game);
game = new THREE.Group();

В вашем коде есть ошибка, так как вы передаете переменную undefinedgame в ctor ObjectControls. Если вы назначите новый объект game одной строкой позже, ObjectControls не будет ссылаться на эту переменную.

Идея состоит в том, чтобы сначала назначить групповой объект game, а затем создать ObjectControls. Вы по существу переключаете обе линии.

three.js R105

о боже какое простое решение я плачу большое спасибо

zaviiox 31.05.2019 16:44

Другие вопросы по теме