【问题标题】:With three.js, can I attach information to an object, such as a URL?使用three.js,我可以将信息附加到对象,例如URL吗?
【发布时间】:2013-08-21 13:34:53
【问题描述】:

我有一个与three.js 相关的webgl 问题。我想将信息附加到一个对象。例如,当我单击一个对象时,我想检索一些与该对象相关的信息,例如 URL,然后使用该信息运行一个函数。

我用来查找对象的代码是:

    var vector = new THREE.Vector3((event.clientX / window.innerWidth) * 2 - 1, -(event.clientY / window.innerHeight) * 2 + 1, 0.5);
    projector.unprojectVector(vector, camera);

    var raycaster = new THREE.Raycaster(camera.position, vector.sub(camera.position).normalize());

    var intersects = raycaster.intersectObjects(objects);

    intersects[0].object.material.color.setHex(Math.random() * 0xffffff);

最后一行是我当前操作对象的方式。数组objects 只是一个包含所有对象的数组。问题是我对 Raycaster 或 intersectObjects 的工作原理知之甚少,或者我对如何将任何信息与对象联系起来以便以后可以调用它的了解不够。

【问题讨论】:

    标签: javascript three.js webgl


    【解决方案1】:

    确实,您可以将自定义用户数据设置为 Three.js 中的对象。这里的关键是 Object3D,它是所有场景图对象的基础。文档有一个名为

    的属性
    Object3D.userData; 
    

    这可以加载您选择的对象,当 Raycaster 类检索您的相交时,您可以直接在该点直接访问它。

    在初始化或运行时设置器

    Object3D.userData = { URL: "http://myurl.com" };
    

    碰撞中的吸气剂

    window.location = intersects[0].object.userData.URL;
    

    【讨论】:

    • 完美!正是我想要的。
    • 这样做和简单地说Mesh.myObject = {key:value};有什么区别吗?我认为基本上是一样的吗?
    • 唯一想到的一个重要区别是克隆 Object3D 将保留 userData 属性。
    • 很好的解决方案。您也可以设置为:object.userData.myVariable = someValue;
    猜你喜欢
    • 2022-01-09
    • 2011-12-20
    • 2013-10-02
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2011-09-06
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多