Hi i'm tryng to design a mouse triggered animation for a web site. but somehing about arrays i use is wrong.
i enclose two sketches:

in the first one i don't succed to assign different strokeweights to a group of arcs.
Each arc has different width & height two list generated by the same function : dist(x,y,mouseX,mouseY);

In the second one i try to "map" the values issue of the function in a real array hoping that having an index for each value will haelp to attribute them different strokeweights.

I hope my request is clear enough, i'm really a processing newbie, and my sketches are not so clear even to me ;)

Every hint or comment is wellcome!TNX S

FIRST sketch:

// declare variables :

//TO DRAW SHAPES:

//arrays index:
int i;
//different strokeweight for each arc:
float SW;
//reference points used as virtual centers of each arc to scale them proportionally to mouse distance:
int x;
int y ;
//width & eight for each arc:
   float ellwidth ;
   float ellheight;
//factor use to define the amount of oscillation for width & eight:
   float Xspring ;
   float Yspring ;
//simulate an oscillation dynamic for width & eight:
   float sinW ;
   float sinH ;

//TO DETECT MOUSE SPEED
//
float target;
float speed = 0 ;
float easing = 0.025;

void setup() {
 size(800, 200);
 frameRate (30);
}
void draw() {
 
smooth();
fill(0,0);
background (0);

 //mouse speed
 float target = dist(mouseX, mouseY, pmouseX, pmouseY);
speed += (target/2 - speed) * easing;

 // virtual centers
for (int x = 100; x < 800; x +=300){
 for (int y = 20; y < 800; y +=280){

// basic width & eight of the arcs
   float ellwidth = dist(x,y,mouseX,mouseY)*0.75;
   float ellheight = dist(x,y,mouseX,mouseY*3)/2.3;

//oscillation factor  
   float Xspring = (speed*2.75);
   float Yspring = (speed*2.5);

//oscillation simulation    
   float sinW = sin(frameCount/2* speed/1.5) * Xspring;
   float sinH = sin(frameCount/2 * speed/2) * Yspring;

//array used to attribute a different stroke weight to each arc  
float[] SW = {3,5,7,1,0.5,1,1.5,2.25};
for (int i = 0; i < SW.length; i++){

  println(SW[i]);

strokeWeight (SW[i]);

//WHITE ARC CORRECTLY AFFECTED BY STROKEWEIGHT SETTINGS
stroke(255,255,255,250);
 arc(x,0,SW[i]*20,SW[i]*40,0,TWO_PI);  

//GREEN ARCS NOT AFFECTED BY STROKEWEIGHT SETTINGS BUT I CANT UNDERSTAND WHY?
//                                                 -------------------------
  stroke(0,255,0,250);
    arc(x,0,ellwidth+sinW,ellheight+sinH,0,TWO_PI);  
    }
   }
  }
}
 
SECOND sketch:

//this sketch is quite the same as the previous one,
//i just try here to build an array to content widths & eights of the arcs
//supposing that if they have an index it wil be possible to attribute
//each one a different stroke weight.

//Variables
float SW;
int i;
float speed = 0. ;
float easing = 0.025;


void setup() {
 size(800, 200);
 frameRate (30);
}
void draw() {
    smooth();
 fill(0,0);
background (0);
stroke(255,255,255,250);
 

//detect mousespeed
 float target = dist(mouseX, mouseY, pmouseX, pmouseY);
speed += (target/2 - speed) * easing;

//create an array to contain different values for strokeweight
//and create an index
float[] SW = {3,5,7,1,0.5,1,1.5,2.25,4};
for (int i = 0; i < SW.length; i++){
 
  println(i);

//create virtual ppoints as scale reference for each arc  
for (int x = 100; x < 800; x +=300){
 for (int y = 20; y < 800; y +=280){

//create two arrays to contain height & width values for each arc
//the index used for those arrays is [i] again but if use it here i have
//a bound exception error.
   float[] ellwidth = new float[i];
   ellwidth[i] = dist(x,y,mouseX,mouseY);
   
   float[] ellheight = new float[i];
   ellheight[i] = dist(x,y,mouseX,mouseY);
   
   float Xspring = (speed*2.75);
   float Yspring = (speed*2.5);
   
   float sinW = sin(frameCount/2* speed/1.5) * Xspring;
   float sinH = sin(frameCount/2 * speed/2) * Yspring;

// here the SW array is recalled by the same [i] index
//that in this case works correctly
//(if former heigt lines are commented)
 strokeWeight (SW[i]);
 
 arc(x,0,SW[i]*20,SW[i]*20,0,TWO_PI);  
     
     arc(x,0,ellwidth[i]+sinW,ellheight[i]+sinH,0,TWO_PI);  
      }
     }
    }
   }
 
THANKS AGAIN FOR UR ATTENCTION!

 
 
 








 



 
 
 








 

Tnx for your hints antiplastik,

the sketch was really chaotic, and i cleaned it.
Actually, at least one of The incoming values used to draw the arcs should be correctly indexed(stored in array), to assign a different strokeWeight value to each arc.
Otherwise you draw several arcs but just repeating the same one: without the possibility to assign different attributes to each one.
here the working code with a different strokeWeight for each interactive arc.

Cheers S

float speed = 0;
float easing = 0.025;
float target = 0;
float mousex = 0;
float mousey = 0;
float  mousex1 = 0;
float  mousey1 =  0;
float sinW,sinH,ellwidth, ellheight, Xspring, Yspring;


int step;
int n = 9;
int numX = 3;

float[] xPoses = new float[n];
float[] yPoses = new float[n];
float[] bottomLineX = new float[n];
float[] SW = new float[n];



void setup() {
 size(800, 200,JAVA2D);
 frameRate (30);
 smooth();
 
 
  step = width / numX;            //  distance between dots
  for(int i=0; i<n; i++) {
    xPoses[i] = (step / 2) + (i % numX * step);
    yPoses[i] = (step / 2) + (floor(i / numX) * step);
    bottomLineX[i] = width / n * (i+0.5);
    SW[i] = random(9);
 }
}    


void draw()
{
 background (0);
 fill(0,0);
 stroke(255,255,255,250);

 
 mousex = mouseX;
 mousey =  mouseY;
 mousex1 = pmouseX;
 mousey1 =  pmouseY;
 
 target = dist(mousex, mousey, mousex1, mousey1);
 speed += (target/2 - speed) * easing;
 
 for(int i=0; i<n; i++) {
 ellwidth = dist(xPoses[i],yPoses[i],mousex,mousey)*0.75;
 ellheight = dist(xPoses[i],yPoses[i],mousey,mousey*3)/2.3;
 
 Xspring = (speed*2.75);
 Yspring = (speed*2.5);
 
 sinW = sin(frameCount/2* speed/1.5) * Xspring;
 sinH = sin(frameCount/2 * speed/2) * Yspring;
 
 strokeWeight (SW[i]);
 
 arc(bottomLineX[i],0,ellwidth+sinW,ellheight+sinH,0,TWO_PI);
 }
 }