Conectar puntos

Español
1

Hola!, soy principiante en processing y quería hacer un proyecto donde se crean puntos random con un limite y pueda conectarlos con el mouse dando click en cada punto, como creando constelaciones, pero la verdad no se muy bien como empezar o que hacer para llevarlo a cabo, ¿que me recomiendan?
de momento solo tengo esto de codigo, pero no se que hacer con el.

Gracias de antemano!

float rx;
float ry;
void setup(){
size(800,800);
background(0);

}
void draw(){
  rx=random(width);
  ry=random (height);
  stroke(255);
  strokeWeight(5);

point(rx,ry);

}
2 Likes
2

Solo para empezar.
Agora e a sua vez
Usando la matriz PVector usted detecta cuando el mouse se mueve sobre un círculo.

int ns = 20; // Number of stars
PVector[] points = new PVector[ns];

void setup() {
  size(600, 600);
  fill(0);
  for (int i = 0; i < ns; i++) {
    points[i] = new PVector();
    points[i].x = int(random(10, width-10));
    points[i].y = int(random(10, height-10));
  }
}

void draw(){
  background(255);
  for (int i = 0; i < ns; i++) {
    circle(points[i].x, points[i].y, 5);
  }
}

void mousePressed(){
  
}
4 Likes
3

Uff, perdón, me vine arriba y lo he hecho entero…

Alerta de spoiler, no pulsar si no se quiere ver el resultado final 
//https://discourse.processing.org/t/conectar-puntos/18250/2
//Versión 1.0 Constelaciones, por @Waboqueox en colaboración con @noel

int ns = 20; // Numero de estrellas
PVector[] points = new PVector[ns];  //Ubicacion de las estrellas
ArrayList<PVector> uniones = new ArrayList<PVector>();  //Para unir las estrellas
Estrella[] estrella = new Estrella[ns];  //Array de estrellas

void setup() {
  size(600, 600);
  for (int i = 0; i < ns; i++) {
    points[i] = new PVector();
    points[i].x = int(random(10, width-10));
    points[i].y = int(random(10, height-10));
    estrella[i] = new Estrella(points[i]);
  }
}

void draw(){
  background(255);
  
  //Para dibujar las estrellas
  for (int i = 0; i < ns; i++) {
    estrella[i].dibujar();
  }
  
  //Para dibujar las uniones
  for(int i = 0; i < uniones.size() ; i+=2){
    if( i+1 < uniones.size())
      line(uniones.get(i).x,uniones.get(i).y,uniones.get(i+1).x,uniones.get(i+1).y);
  }
  
  //Información de uso
  pushStyle();
  fill(255,0,0,122);
  text("r para reiniciar\nb para borrar elección\ng para generar nuevas",20,20);
  popStyle();
}

void mousePressed(){
  
  //Detectar que estrella ha sido pulsada
  for(int i = 0; i < ns; i++)
  {    
    if(estrella[i].pulsada()){
      uniones.add(estrella[i].posicion);
      println("Estrella " + i + " ha sido pulsada");
    }
  }
}

//Para interactuar
void keyPressed() {
  
  //Reiniciar
  if(key == 'r'){
    uniones.clear();
    println("Reinicio");
  }
  
  //Borrar
  if(key == 'b'){
    if(uniones.size() >0){
      uniones.remove(uniones.size()-1);
      println("Borrada la anterior selección");
    }    
  }
  
  //Generar
  if(key == 'g'){
    println("Nuevas estrellas vislumbradas");
    uniones.clear();
    for (int i = 0; i < ns; i++) {
      points[i] = new PVector();
      points[i].x = int(random(10, width-10));
      points[i].y = int(random(10, height-10));
      estrella[i] = new Estrella(points[i]);
    }
  }
  
}

//Clase estrella para poder guardar información y detectar si ha sido pulsada
class Estrella{
  PVector posicion;  //La posición donde se ubica
  float grosor;      //Para que haya más variedad
  
  Estrella(PVector ubicacion){
    posicion = ubicacion.copy();  
    grosor = 3+random(2);  //Un mínimo de 3 y hasta 5
  }
  
  void dibujar(){
    push();
    strokeWeight(grosor);
    fill(0);
    point(posicion.x,posicion.y);
    pop();
  }
  
  //Detectar si ha sido pulsada
  boolean pulsada(){
    //Le damos un margen de 3 pixeles para que se más fácil pulsar las pequeñas
    //Provoca que si hay dos juntas se unan las dos
    //Se puede poner el grosor sólo para más precisión en vez de grosor + 3
    if(dist(mouseX,mouseY,this.posicion.x,this.posicion.y) < this.grosor+3)
      return true;
    return false;
  }

}

Como guía para hacerlo tú:

  • Te recomiendo entender el ejemplo de noel.
  • Para detectar pulsaciones, recomiendo usar objetos y un método que detecte si se ha pulsado o no.
  • En cuanto a unir los puntos, hay varias maneras, también depende de que funcionalidad le quieras dar luego, yo he almacenado las posiciones de las estrellas pulsadas y las he guardado en un ArrayList porque me da más maniobrabilidad para luego borrar, reiniciar o añadir puntos.
2 Likes
4

oh dios, gracias!! ahora intentare entender todo lo que hiciste, pero ya tengo una buena guía de como hacer esto y siguientes proyectos.