在three.js中标签渲染器中不工作的html按钮
在three.js中标签渲染器中不工作的html按钮
提问于 2022-04-14 08:41:30
Html按钮在标签渲染器中不工作。有什么解决方案我可以在我的代码中。问题是我同时使用了webglrenderer和标签渲染器.So，很多问题都会发生，比如轨道控制不能工作按钮，不能点击，以及我在运行时创建的注释按钮不能工作。
let div = document.createElement( 'div' );
div.className = 'label';
div.textContent = '+';
div.type='button';
div.id='label6';
div.style.marginTop = '-1em';
div.addEventListener("mousedown",scope_AC.uiHandler.addConnectionBtns,false);
let label = new CSS2DObject( div );
label.position.copy(pos);
childModel.add( label );
scope_AC.modeler.labelRenderer.setSize( innerWidth, innerHeight );
scope_AC.modeler.labelRenderer.domElement.style.position = 'absolute';
scope_AC.modeler.labelRenderer.domElement.style.top = '15px';
scope_AC.modeler.labelRenderer.domElement.style.pointerEvents = 'none'
document.body.appendChild(scope_AC.modeler.labelRenderer.domElement );当我标记注释时，我的场景没有任何pointerEvent=none，但是当我应用这个注释时，注释是不可点击的。
回答 1
Stack Overflow用户
发布于 2022-04-20 16:42:21
Prisoner849提出了一个很好的观点：
尝试
pointerdown而不是mousedown
下面是您的代码将如何处理：
let div = document.createElement( 'div' );
div.className = 'label';
div.textContent = '+';
div.type='button';
div.id='label6';
div.style.marginTop = '-1em';
div.addEventListener("pointerdown",scope_AC.uiHandler.addConnectionBtns,false);
let label = new CSS2DObject( div );
label.position.copy(pos);
childModel.add( label );
scope_AC.modeler.labelRenderer.setSize( innerWidth, innerHeight );
scope_AC.modeler.labelRenderer.domElement.style.position = 'absolute'; scope_AC.modeler.labelRenderer.domElement.style.top = '15px';
scope_AC.modeler.labelRenderer.domElement.style.pointerEvents = 'none'
document.body.appendChild(scope_AC.modeler.labelRenderer.domElement );那样就行了~
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/71868814
复制相关文章
相似问题
腾讯云开发者
