[英]Javascript: How to change TextGeometry on click event?
我正在處理ThreeJS 幾何畫布文本。 單擊 html 按鈕后,文本應該更改為另一個文本。 但是,它不起作用。 如何在單擊事件時更改 TextGeometry?
這是我正在使用的內容:
var theText = "Hello three.js! :)";
var hash = document.location.hash.substr( 1 );
if ( hash.length !== 0 ) {
theText = hash;
}
var geometry = new THREE.TextGeometry( theText, {
font: font,
size: 80,
height: 20,
curveSegments: 2
});
geometry.computeBoundingBox();
var centerOffset = -0.5 * ( geometry.boundingBox.max.x - geometry.boundingBox.min.x );
var material = new THREE.MultiMaterial( [
new THREE.MeshBasicMaterial( { color: Math.random() * 0xffffff, overdraw: 0.5 } ),
new THREE.MeshBasicMaterial( { color: 0x000000, overdraw: 0.5 } )
] );
var mesh = new THREE.Mesh( geometry, material );
mesh.position.x = centerOffset;
mesh.position.y = 100;
mesh.position.z = 0;
mesh.rotation.x = 0;
mesh.rotation.y = Math.PI * 2;
group = new THREE.Group();
group.add( mesh );
scene.add( group );
}
$('.button').on('click', function(e){
theText.dispose();
var menu= new Array('option1', 'option2', 'option3');
theText=menu;
});
您必須創建另一個 TextGeometry 和網格。 然后在單擊事件上,您將使用新文本刪除先前的文本。
function onMouseClick(){
scene.remove(mesh_first);
scene.add(mesh_second);
}
供參考 - https://github.com/mrdoob/three.js/blob/master/src/core/Object3D.js#L332
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.