I'm making a simple Processing program that creates a certain amount of points that randomly move and then when the mouse is clicked the points move to the mouse's location.
I made the points as ellipses so they'd be easier to see.
//number of points
int ptnum=2;
//list of points
Point[] points=new Point[ptnum];
//class to create points
class Point
{
float xpos;
float ypos;
//constructor
Point(float x, float y){
xpos=x;
ypos=y;
}
//return x-coordinate
float ptx(){
return xpos;
}
//return y-coordinate
float pty(){
return ypos;
}
//points randomly moving
void randMove(){
xpos+=random(-2,2);
ypos+=random(-2,2);
}
//display points
void display(){
fill(0);
ellipse(xpos,ypos,2,2);
}
//move points to mouse
void move(){
if(xpos>mouseX){
xpos-=1;
}
if(ypos>mouseY){
ypos-=1;
}
if(ypos<mouseY){
ypos+=1;
}
if(xpos<mouseX){
xpos+=1;
}
}
}
void setup(){
size(640,360);
//create ptnum of points
for(int i=0; i<ptnum; i++){
points[i]=new Point(random(1,width-1),random(1,height-1));
}
}
//each point to random move
void randomMovement(){
for(int i=0; i<ptnum; i++){
points[i].randMove();
}
}
//each point to display
void ptDisplay(){
for(int i=0; i<ptnum; i++){
points[i].display();
}
}
//each point to move
void ptMove(){
for(int i=0; i<ptnum; i++){
points[i].move();
}
}
void draw(){
//start
background(255,255,255);
noFill();
ptDisplay();
//==========
//if mouse clicked, move points to mouse XandY, if not-randommove
if(mousePressed){
ptMove();
}
else{
randomMovement();
}
}
I'm trying to make it so that the points can also interact with each other, for instance, they can't touch each other. Could someone help me figure this out? I'm having a bit a brain fart on this one. And if anyone has suggestions for the code, I'd be happy to hear them.
Thanks so much for the help, its appreciated.
Just calculate each point's location inside draw function.
Then, run a for loop to see if you have any collisions.
Since draw function is running many times per second, the result will be good enough.
When you have a collision, you can change each point's direction by 180 degrees.
Related
Just wondering if I want to do a loop to make every time I mousePressed to draw a circle and each time fill with 3 different colour eg yellow orange and blue and so on I use for(int countmouseClick=n; n<=3 ; n++) how should I finish the rest? Should I reset n if n=3 to n= 0?. The circles can stay on the canvas
Not sure if it correct.
void mousePressed(){
for ( int count=0; n<= 2; n++){
fill(255,0,0);
fill(0,255,0);
fill(0,0,255);
}
circle(mouseX,mouseY,20);
}
//i have adopted the idea of %, it telling me the variable n doesn't exist, why is this
int count;
void setup(){
size(400,400);
background(255);
}
void draw(){
}
void mousePressed(){
int count=n;
if(n>2){ //reset mouse click to 0
n=0;
}
for(int n= 0;n<=2;n++){//count mouseclicked, if n<=2, n=n+1
if(n%3=0){
fill(255,0,0);
}else if (n%3=1){
fill(0,255,0);
}
else {
fill(0,0,255);
}
circle(mouseX,mouseY,20);
}
}
a better way of writing the code is to write a helper function which takes countmouseclick and return the color
you can read these articles for understanding the code below
https://processing.org/reference/modulo.html
https://processing.org/reference/switch.html
Color getColor(int countMouseClick){
switch(countMouseClick%3) {
case 0:
return COLOR.ORANGE;
case 1:
return COLOR.YELLOW;
break;
case 2:
return COLOR.BLUE;
default:
return COLOR.GREEN;
}
In the processing language I am trying to create a translation similar to the image below:
Output Goal
In my code, the image is moving but it isn't showing the original picture in addition to the translation and it isn't being shown across the screen as i'd like.
I have included the code I have so far below:
PImage img;
int reps=10;
void setup()
{
size(600,120);
triangle(30,5,50,30,15,20);
save("image.png");
img=loadImage("image.png");
}
void draw()
{
for (int i=0; i<reps; i++);
{
pushMatrix();
image(img,0,0);
translate(img.height,0);
scale(-1,1);
image(img,0,0);
popMatrix();
}
}
This is what it produces so far:
current_output
Im happy it's translating, I am just trying to figure out how to see the original in addition to the translation and have it shown multiple times.
Thanks in advance!!
The images have to be translated differently depending on the index. The 2nd image has to be translated more than the 1st one and the 3rd more than the 2nd:
translate(img.height * i, 0);
function draw:
void draw()
{
for (int i=0; i<reps; i++);
{
pushMatrix();
translate(img.height * i, 0);
scale(-1,1);
image(img,0,0);
popMatrix();
}
}
I want to create points and then store them in an array. I'm doing this to put a linear regression through my data points afterwards. So I need to be able to cycle through all my points.
I could not find anything like that on the web for processing and as I was not really able to do it, I need your help. Here is my approach, but it doesn't seem to work:
ArrayList<dataPoint> dataPoints = new ArrayList<dataPoint>();
void setup(){
size(1000, 1000);
background(255);
}
void draw(){
for (int i = 1; i == dataPoints.size(); i++) {
// An ArrayList doesn't know what it is storing so we have to cast the object coming out
dataPoint Point = dataPoints.get(i);
Point.display();
}
}
void mousePressed() {
dataPoints.add(new dataPoint(mouseX, mouseY));
}
class dataPoint {
float x;
float y;
dataPoint(int tempX, int tempY) {
x = tempX;
y = tempY;
}
void display() {
strokeWeight(10);
stroke(255,0,0);
point(x,y);
}
}
I would like to have a program to create points and store them in an array (or something similar, that you can cycle through).
Most of your code makes sense, there are only two gotchas I could spot that may prevent you from cycling through all your points and visualising them:
your condition is will go to an array index out of bounds: try for (int i = 0; i < dataPoints.size(); i++)
remember to clear the frame, otherwise you're drawing on top of the same dots over and over again
Remember array indices start at 0 in Processing/Java (and likewise the last index will not be the size() of your array, but the 1 less, hence the < in the for condition)
Here is your code with the above tweaks:
ArrayList<dataPoint> dataPoints = new ArrayList<dataPoint>();
void setup(){
size(1000, 1000);
}
void draw(){
background(255);
for (int i = 0; i < dataPoints.size(); i++) {
// An ArrayList doesn't know what it is storing so we have to cast the object coming out
dataPoint Point = dataPoints.get(i);
Point.display();
}
}
void mousePressed() {
dataPoints.add(new dataPoint(mouseX, mouseY));
}
class dataPoint {
float x;
float y;
dataPoint(int tempX, int tempY) {
x = tempX;
y = tempY;
}
void display() {
strokeWeight(10);
stroke(255,0,0);
point(x,y);
}
}
Note that Processing has a handy PVector class (which has x,y properties) so you could do something like this:
ArrayList<PVector> dataPoints = new ArrayList<PVector>();
void setup(){
size(1000, 1000);
strokeWeight(10);
stroke(255,0,0);
noFill();
}
void draw(){
background(255);
beginShape();
for (int i = 0; i < dataPoints.size(); i++) {
PVector point = dataPoints.get(i);
vertex(point.x,point.y);
}
endShape();
}
void mousePressed() {
dataPoints.add(new PVector(mouseX, mouseY));
}
This a bit of a detail, but I recommend to following Java Naming Convention to keep the code consistent. (For example: renaming the dataPoint class to DataPoint and renaming the Point instance to point)
i want to achieve like this:
enter image description here
here is my code:
class Particle {
PVector position;
PVector velocity;
PVector acceleration;
PVector initialVelocity;
ArrayList<PVector> path;
boolean life = true;
float q;
public Particle(PVector position, PVector initialVelocity) {
this.position = position;
this.acceleration = new PVector(0, 0);
this.initialVelocity = initialVelocity;
this.velocity = new PVector(0, 0);
path = new ArrayList<PVector>();
}
public void run() {
update();
display();
}
private void update() {
velocity.add(acceleration);
velocity.limit(maxspeed);
trail.add(position.copy());
position.add(velocity);
occurOtherCurves();
arriveBorders();
path.add(position.copy());
acceleration.mult(0);
}
private void display() {
beginShape();
stroke(0);
strokeWeight(1);
noFill();
for(PVector v : path) {
vertex(v.x, v.y);
}
}
public void followField(Field field) {
PVector desired = field.lookup(initialVelocity);
desired.mult(maxspeed);
PVector steer = PVector.sub(desired, velocity);
steer.limit(maxforce);
applyForce(steer);
}
private void applyForce(PVector force) {
acceleration.add(force);
}
public boolean isEndMove(){
return !life;
}
private void arriveBorders(){
if(position.x <= 0 || position.x >= width || position.y <= 0 || position.y >= height)
life = false;
}
private void occurOtherCurves() {
for(PVector p : trail) {
if(p.x == position.x && p.y == position.y) life = false;
}
}
public ArrayList<PVector> getPath() {
return path;
}
}
in occurOtherCurves() function ,ArrayList<PVector> trail is a global variable used to record the positions that all particles passed through,but it didn't work.
thanks for you help.
Stack Overflow isn't really designed for general "how do I do this" type questions. It's for more specific "I tried X, expected Y, but got Z instead" type questions.
But generally, it sounds like what you'd want to do is check whether a new path segment intersects with any existing path segments. If it does, then truncate it at the intersection point (or just don't add it) and stop adding path segments to that path.
You'll have much better luck if you break your problem down into smaller pieces, and take on one piece at a time. Then if you get stuck, you can post a MCVE along with a specific technical question. Good luck.
Processing code as below:
int maxCircle = 200;
float minDistance=2;
float distance;
Circle [] circles= new Circle[maxCircle];
void setup(){
size(800,800);
smooth();
for(int i=0;i<maxCircle;i++){
circles[i] = new Circle(random(width),random(height),random(2,20));
}
}
void draw(){
background(255,255);
for(int i=0;i<maxCircle;i++){
circles[i].update(width,height);
for(int j=0;j<maxCircle;j++){
distance = dist(circles[i].x,circles[i].y,circles[j].x,circles[j].y);
if(distance<minDistance){
stroke(0,50);
noFill();
line(circles[i].x,circles[i].y,circles[j].x,circles[j].y);}}
circles[i].display();
}
}
void mouseMoved(){
for(int i = 0; i<maxCircle;i++){
circles[i].x+=(mouseX-circles[i].x)*.2;
circles[i].y+=(mouseX-circles[i].y)*.2;}}
class Circle{
float x,y,vx,vy,r,speed;
Circle(float tempx, float tempy, float tempr){
x=tempx;
y=tempy;
vx=random(-1,1);
vy=random(-1,1);
r=tempr;
}
void update(int w,int h){
x+=vx;
y+=vy;
if(x<r || x>w-r){
vx*=-1;};
if(y<r || y>h-r){
vy*=-1;};
}
void display(){
fill(0,50);
noStroke();
ellipse(x,y,r,r);
}
}
Two questions:
Why doesn't the line function work?
How can i make circles move smoothly(respectively) following my mouse instead of squeezing into one point abruptly?
Looks like Casey's work -- are you at UCLA?
Anyway -- the line() function does work. Try increasing your minDistance to something more like 20, and you'll see lines.
Re: mouse following, you're telling every circle to move 20% of the distance to the mouse, every frame. I'm not sure exactly what you want here; do you want only circles near the mouse to move with the mouse? If so, apply a distance check to the mouse for each circle and only move the circle toward the mouse if it's within that distance. Something like:
void mouseMoved() {
float distance;
for(int i = 0; i<maxCircle;i++){
float mouseDist = dist(circles[i].x,circles[i].y,mouseX,mouseY);
// move toward mouse only if < 100px from mouse
if (mouseDist < 100) {
circles[i].x+=(mouseX-circles[i].x)*.05;
circles[i].y+=(mouseY-circles[i].y)*.05;
}
}
}