我试图不断检查每行中三个网格中的两个端点之间的距离是否在某个阈值以下。
如果在下面,我想显示该行并更新位置。
如果超出范围,我想暂时将其隐藏。这个想法是,随着顶点在周围浮动,线条在靠近时会“附着”和“分离”。
这是我的方法的一个示例:
function render(){
renderer.render(scene,camera);
}
function animate(){
requestAnimationFrame( animate );
for(var i = 0; i < Lines.children.length; i++){
var line = Lines.children[i];
var dist = line.geometry.vertices[0].distanceTo( line.geometry.vertices[1] ));
if( dist < tolerance ){
line.visible = true;
updateLineLoc(line);
} else {
line.visible = false;
}
}
render();
}
animate();
当前,“仅”行隐藏。当我检查了网格物体的可见属性后,它“从不改变”,但是线条变得不可见。
如果异步是问题,我尝试将更新计算以及每帧渲染放在回调中。我已经检查以确保我的循环仍在访问“不可见”的循环,并且我已经三重检查了距离计算是否可靠。我尝试过:
function goodDist( line, callback ){
line.visible = true;
}
function animate(){
requestAnimationFrame( animate );
for(var i = 0; i < Lines.children.length; i++){
var line = Lines.children[i];
var dist = line.geometry.vertices[0].distanceTo( line.geometry.vertices[1] ));
if( dist < tolerance ){
line.visible = true;
goodDist( line, updateLineLoc(line) );
} else {
line.visible = false;
}
}
render();
}
animate();
这:
function render(){
renderer.render(scene,camera);
}
function checkNear(callback){
for(var i = 0; i < Lines.children.length; i++){
var line = Lines.children[i];
var dist = line.geometry.vertices[0].distanceTo( line.geometry.vertices[1] ));
if( dist < tolerance ){
line.visible = true;
updateLineLoc(line);
} else {
line.visible = false;
}
}
}
function animate(){
requestAnimationFrame( animate );
checkNear(render());
}
animate();
这与Three.js - object.visible = true, not showing up right away不同,因为我的网格物体根本不会显示,而只是加载缓慢。国家本身似乎并没有改变。我似乎找不到用于更新visible属性的更新标志,但同样,它们正在更新为“关闭”状态(至少在屏幕上)。
这里的一个复杂之处在于,我在线条上使用了自定义的shaderMaterial。我不确定这是否可以负责,但是它所做的只是在顶点的颜色之间进行插值。
请帮助! :O