Question

编辑：指定使用ArrowHelper 我希望在2D平面上生成大量箭头，以表示矢量场。向量的数量各不相同，但通常为20000.

使用THREE.ArrowHelper，我可以做到这一点，但它非常慢，所以我认为必须有更好的方法。如何在缩小时使用子采样数量的矢量重新绘制字段，是否有办法动态计算并仅添加渲染器需要的内容？

加入：我使用下面插入的代码片段创建它。该循环在参数曲面的x，y位置生成2D矢量场。

// set default color
var hex = 0x00ff00;
var u,v,xx,yy,ii,dir,mag,origin;
// loop through
Geometry[i].vertices.forEach(function(point,j) 
{
  xx = Math.floor((point.x-data[i].x0)/data[i].dx);
  yy = Math.floor((point.y-data[i].y0)/data[i].dy);
  ii = data[i].nx*yy+xx;

  u = data[i].frame[data[i].xvec][ii];
  v = data[i].frame[data[i].yvec][ii];
  mag = Math.pow(u*u+v*v,.5);
  dir = new THREE.Vector3( u, v, 1 );
  origin = new THREE.Vector3( point.x+data[i].dx/2,
                              point.y+data[i].dy/2, 1 );

  data[i].arrowHelper[j] = new THREE.ArrowHelper( dir.normalize(), 
                                                  origin,
                                                  data[i].scale*mag, 
                                                  hex);
  scene.add( data[i].arrowHelper[j] );

});

我刚刚在一台功能更强大的机器上进行了测试，它运行更顺畅，但仍然受到了显着的性能影响。

我可以显示并平滑渲染参数曲面，甚至1e06底层纹理也没问题，但是ArrowHelpers会导致性能下降。

Answer 1

感谢@pailhead，解决方案是使用THREE.LinePieces将箭头绘制为两组线路调用。按照原始问题的代码，箭头基础然后实现为。当矢量发生变化时，线[i]被移除并重新计算。

var empty = true
override func viewDidLoad() {
 self.tryGettingDataFromServer()
}

func tryGettingDataFromServer(){
 str = iFunctions.generateRandomStringWithLengthOf(4) as String
 iFunctions.getServerData(str){(msg) in
    if (msg > 0){
        self.empty = false
        print("not empty")
    }
    else{
        // The closure keeps a reference to self and calls
        // the tryGettingDataFromServer again if "empty"
        // It will happen infinitely until "not empty"
        self.tryGettingDataFromServer()
    }
    self.count = msg!
    print(self.count)
  }

}

three.js r.73

如何使用THREE.ArrowHelper

1 个答案: