Desenhando uma linha com three.js dinamicamente
É isso que eu gostaria de alcançar (um polígono modificável, onde os círculos vermelhos são vértices) e gostaria de construir o polígono dinamicamente.
Ao iniciar a geometria como
var geometry = new THREE.Geometry();
geometry.vertices.push(point);
geometry.vertices.push(point);
var line = new THREE.Line(geometry, new THREE.LineBasicMaterial({}));
funciona bem até o segundo clique, cria uma linha reta entre 1 e 2, mas não adiciona uma terceira linha quando é empurrada para a matriz. O WebGL parece exigir pontos em buffer.
Quando eu predefinir vértices como este, posso desenhar duas linhas (terceiro clique)
var geometry = new THREE.Geometry();
for (var i = 0; i < 4; i++) {
geometry.vertices.push(point);
}
var line = new THREE.Line(geometry, new THREE.LineBasicMaterial({}));
mas essa não é uma boa solução, pois não sei quantos vértices o usuário deseja adicionar e não faz sentido atribuir um número grande a ele, pois preciso repeti-lo várias vezes.
Existe alguma maneira de contornar isso?