Rollover to change color - Beginner Help!

Programming Questions

tamive

Rollover to change color - Beginner Help!

in Programming Questions • 1 year ago

I'm very new to processing so I'm having problems with some basic things.

I have a set of various static lines that I want to make interactive.

Basically, when the mouse rolls over a line I want it to change a different color.

I have no idea how to go about figuring this out so I would really appreciate some help!

Thanks!

Replies(4)

tfguy44

Re: Rollover to change color - Beginner Help!

1 year ago

The code to do that can range from simple to not simple, depending on how you're drawing your lines. Are the lines only horizontal or vertical? Are they all different colors? These are the kinds of things that can yield much easier solutions, and it's hard to tell what sort of a is-my-mouse-pointer-on-a-line algorithm to use without seeing the code that's drawing your lines.

Short version: Please post your code so we can see how you're drawing your lines.

tamive

Re: Rollover to change color - Beginner Help!

1 year ago

They ones I want to change color are only the vertical lines and they're only black. Here is my code so far, it's very very simple.

void setup(){

size(500,400);

smooth();

background(255);

strokeWeight(1);

line(0,200,600,200);

line(0,200,0,199);

line(2,200,2,190);

line(4,200,4,180);

line(6,200,6,170);

line(8,200,8,160);

line(10,200,10,150);

line(12,200,12,140);

line(14,200,14,130);

line(16,200,16,120);

line(18,200,18,110);

line(20,200,20,100);

line(22,200,22,110);

line(24,200,24,120);

line(26,200,26,130);

line(28,200,28,140);

line(30,200,30,150);

line(32,200,32,160);

line(34,200,34,150);

line(36,200,36,140);

line(38,200,38,130);

line(40,200,40,120);

line(42,200,42,110);

line(44,200,44,100);

line(46,200,46,90);

line(48,200,48,80);

line(50,200,50,70);

line(52,200,52,60);

line(54,200,54,50);

line(56,200,56,40);

line(58,200,58,30);

line(60,200,60,20);

line(62,200,62,10);

line(64,200,64,05);

line(66,200,66,10);

line(68,200,68,20);

line(70,200,70,30);

line(72,200,72,40);

line(74,200,74,50);

line(76,200,76,60);

line(78,200,78,70);

line(80,200,80,80);

line(82,200,82,90);

line(84,200,84,100);

line(86,200,86,110);

line(88,200,88,120);

line(90,200,90,130);

line(92,200,92,140);

line(94,200,94,150);

line(96,200,96,160);

line(98,200,98,170);

line(100,200,100,180);

line(102,200,102,190);

line(104,200,104,200);

line(106,200,106,205);

line(108,200,108,210);

line(110,200,110,215);

line(112,200,112,220);

line(114,200,114,225);

line(116,200,116,230);

line(118,200,118,225);

line(120,200,120,220);

line(122,200,122,215);

line(124,200,124,210);

line(126,200,126,205);

line(128,200,128,200);

line(130,200,130,195);

line(132,200,132,190);

line(134,200,134,185);

line(136,200,136,180);

line(138,200,138,175);

line(140,200,140,170);

line(142,200,142,170);

line(144,200,144,170);

line(146,200,146,170);

line(148,200,148,170);

line(150,200,150,170);

line(152,200,152,170);

line(154,200,154,170);

line(156,200,156,170);

line(158,200,158,170);

line(160,200,160,170);

line(162,200,162,165);

line(164,200,164,160);

line(166,200,166,155);

line(168,200,168,150);

line(170,200,170,145);

line(172,200,172,140);

line(174,200,174,145);

line(176,200,176,150);

line(178,200,178,155);

line(180,200,180,160);

line(182,200,182,165);

line(184,200,184,170);

line(186,200,186,175);

line(188,200,188,180);

line(190,200,190,185);

line(192,200,192,190);

line(194,200,194,195);

line(196,200,196,200);

line(198,200,198,190);

line(200,200,200,180);

line(202,200,202,170);

line(204,200,204,160);

line(206,200,206,150);

line(208,200,208,160);

line(210,200,210,175);

line(212,200,212,175);

line(214,200,214,175);

line(216,200,216,175);

line(218,200,218,175);

line(220,200,220,175);

line(222,200,222,175);

line(224,200,224,175);

line(226,200,226,180);

line(228,200,228,185);

line(230,200,230,190);

line(232,200,232,185);

line(234,200,234,180);

line(236,200,236,175);

line(238,200,238,175);

line(240,200,240,175);

line(242,200,242,170);

line(244,200,244,165);

line(246,200,246,160);

line(248,200,248,155);

line(250,200,250,150);

line(252,200,252,155);

line(254,200,254,160);

line(256,200,256,165);

line(258,200,258,170);

line(260,200,260,175);

line(262,200,262,180);

line(264,200,264,185);

line(266,200,266,175);

line(268,200,268,165);

line(270,200,270,155);

line(272,200,272,145);

line(274,200,274,135);

line(276,200,276,125);

line(278,200,278,115);

line(280,200,280,105);

line(282,200,282,95);

line(284,200,284,85);

line(286,200,286,75);

line(288,200,288,65);

line(290,200,290,75);

line(292,200,292,85);

line(294,200,294,95);

line(296,200,296,105);

line(298,200,298,115);

line(300,200,300,125);

line(302,200,302,135);

line(304,200,304,145);

line(306,200,306,155);

line(308,200,308,165);

line(310,200,310,175);

line(312,200,312,185);

line(314,200,314,195);

line(316,200,316,200);

line(318,200,318,203);

line(320,200,320,206);

line(322,200,322,209);

line(324,200,324,212);

line(326,200,326,215);

line(328,200,328,218);

line(330,200,330,221);

line(332,200,332,224);

line(334,200,334,227);

line(336,200,336,230);

line(338,200,338,227);

line(340,200,340,224);

line(342,200,342,221);

line(344,200,344,218);

line(346,200,346,215);

line(348,200,348,212);

line(350,200,350,209);

line(352,200,352,206);

line(354,200,354,203);

line(356,200,356,200);

line(358,200,358,190);

line(360,200,360,180);

line(362,200,362,170);

line(364,200,364,170);

line(366,200,366,170);

line(368,200,368,170);

line(370,200,370,170);

line(372,200,372,170);

line(374,200,374,170);

line(376,200,376,170);

line(378,200,378,170);

line(380,200,380,170);

line(382,200,382,170);

line(384,200,384,170);

line(386,200,386,175);

line(388,200,388,180);

line(390,200,390,185);

line(392,200,392,190);

line(394,200,394,195);

line(396,200,396,200);

line(398,200,398,199);

line(400,200,400,198);

line(402,200,402,197);

line(404,200,404,196);

line(406,200,406,195);

line(408,200,408,194);

line(410,200,410,193);

line(412,200,412,192);

line(414,200,414,191);

line(416,200,416,190);

line(418,200,418,189);

line(420,200,420,188);

line(422,200,422,187);

line(424,200,424,186);

line(426,200,426,185);

line(428,200,428,184);

line(430,200,430,183);

line(432,200,432,182);

line(434,200,434,181);

line(436,200,436,180);

line(438,200,438,182);

line(440,200,440,184);

line(442,200,442,186);

line(444,200,444,188);

line(446,200,446,190);

line(448,200,448,192);

line(450,200,450,194);

line(452,200,452,196);

line(454,200,454,198);

line(456,200,456,200);

line(458,200,458,202);

line(460,200,460,204);

line(462,200,462,206);

line(464,200,464,208);

line(466,200,466,210);

line(468,200,468,212);

line(470,200,470,214);

line(472,200,472,216);

line(474,200,474,218);

line(476,200,476,219);

line(478,200,478,220);

line(480,200,480,222);

line(482,200,482,224);

line(484,200,484,226);

line(486,200,486,228);

line(488,200,488,230);

line(490,200,490,232);

line(492,200,492,234);

line(494,200,494,236);

line(496,200,496,238);

line(498,200,498,240);

line(500,200,500,242);

}

tfguy44

Re: Rollover to change color - Beginner Help!

1 year ago

Your code screams "USE AN ARRAY!" and "USE A LOOP!" at me.

int data[] = {
199,
190,
180,
170,
160,
150,
140,
130,
120,
110,
100,
110,
120,
130,
140,
150,
160,
150,
140,
130,
120,
110,
100,
90,
80,
70,
60,
50,
40,
30,
20,
10,
05,
10,
20,
30,
40,
50,
60,
70,
80,
90,
100,
110,
120,
130,
140,
150,
160,
170,
180,
190,
200,
205,
210,
215,
220,
225,
230,
225,
220,
215,
210,
205,
200,
195,
190,
185,
180,
175,
170,
170,
170,
170,
170,
170,
170,
170,
170,
170,
170,
165,
160,
155,
150,
145,
140,
145,
150,
155,
160,
165,
170,
175,
180,
185,
190,
195,
200,
190,
180,
170,
160,
150,
160,
175,
175,
175,
175,
175,
175,
175,
175,
180,
185,
190,
185,
180,
175,
175,
175,
170,
165,
160,
155,
150,
155,
160,
165,
170,
175,
180,
185,
175,
165,
155,
145,
135,
125,
115,
105,
95,
85,
75,
65,
75,
85,
95,
105,
115,
125,
135,
145,
155,
165,
175,
185,
195,
200,
203,
206,
209,
212,
215,
218,
221,
224,
227,
230,
227,
224,
221,
218,
215,
212,
209,
206,
203,
200,
190,
180,
170,
170,
170,
170,
170,
170,
170,
170,
170,
170,
170,
170,
175,
180,
185,
190,
195,
200,
199,
198,
197,
196,
195,
194,
193,
192,
191,
190,
189,
188,
187,
186,
185,
184,
183,
182,
181,
180,
182,
184,
186,
188,
190,
192,
194,
196,
198,
200,
202,
204,
206,
208,
210,
212,
214,
216,
218,
219,
220,
222,
224,
226,
228,
230,
232,
234,
236,
238,
240,
242
};
void setup() {
size(500, 400);
smooth();
strokeWeight(1);
}
void draw(){
background(255);
stroke(0);
line(0, 200, 600, 200);
for( int i = 0; i < data.length; i++){
stroke( ((mouseX==2*i)&&(between(mouseY,200,data[i])))?255:0,0,0 );
line(2*i,200,2*i,data[i]);
}
}
boolean between( int target, int bound1, int bound2 ){
if( target >= bound1 && target <= bound2 ){ return( true ); }
if( target <= bound1 && target >= bound2 ){ return( true ); }
return( false );
}

tamive

Re: Rollover to change color - Beginner Help!

1 year ago

Thank you so much. Like I said I'm a beginner I can hardly wrap my head around this stuff

Top Reply