三.js CSSObject3D如何获取对象的宽度答案

【问题标题】：Three.js CSSObject3D how to get object's width三.js CSSObject3D如何获取对象的宽度
【发布时间】：2014-01-21 23:25:12
【问题描述】：

好的，首先我从 HTML 文本中动态生成很棒的 HTML Dom 元素，我使用这个函数

String.prototype.toDomElement = function () {
  var wrapper = document.createElement('div');
  wrapper.className = "toDomWrapper";
  wrapper.innerHTML = this;

  return wrapper;
};

“创建一个 dom 元素”：

var element = obj.html.toDomElement();

然后我从中创建一个 CSS3DObject：

var cssElement = new THREE.CSS3DObject( element );

在画布上放置几个（div）之后 - 我想将它们布置出来（绝对位置，我知道该怎么做），但是我不知道如何获得每个的宽度元素？！

我无法预先确定宽度 - 它们是动态生成的。

非常感谢您的帮助 - 我已经尝试过所有的 three.js CSS3D 示例： http://threejs.org/examples/#css3d_periodictable 而且我真的在网上搜索过 - 找不到任何东西 - 在每个示例中，他们设置了 element.style.width 的宽度或从 css 中检索到的宽度。

有人吗？？

【问题讨论】：

标签： javascript html three.js

【解决方案1】：

试试这个...

var cssElement = new THREE.CSS3DObject( element );
var width = cssElement.element.style.width;

【讨论】：

我确实尝试过这个，但不起作用......虽然感谢你的建议:) 最后我想通了 - 你要做的就是在文档中添加元素：document.附加子（元素）；然后查询宽度！似乎只有在将元素添加到实际文档之后-它实际上才获取属性...

【解决方案2】：

document.appendChild(element);
var cssElement = new THREE.CSS3DObject( element );

现在你可以获取元素的属性了

var el = $("#"+element.id);
var w = el.width();
var h = el.height();
var x = el.position().left;
var y = el.position().top;

【讨论】：