I used the following code to visualize the Zurich bus stop locations information in the stop.json file (geojson format) as shared via:
https://github.com/swissnexSF/Urban-Data-Challenge/tree/master/public-transportation/zurich/geo/geojson

However, I found the proportion of the geo positions as visualized is skewed as compared to that visualized by Raymon Sutedjo & Sandra Lee ( http://ray-mon.com/urbandatachallenge/zurich.html).

May I ask how to correctly visualize the latitude and longitude data so that the map is shown with proper overall proportion?

Thanks!

my viz:


Raymon Sutedjo & Sandra Lee's viz ( http://ray-mon.com/urbandatachallenge/zurich.html):



my code:

1. // coded by Ji Zhang (hope.zh@gmail.com)
2. // Sep-2013
3. 
   
4. JSONObject stopsJSON;
5. JSONArray stops;
6. 
   
7. Stop[] stations;
8. 
   
9. float latitude_min = 90;
10. float latitude_max = 0;
11. float longitude_min = 180;
12. float longitude_max = 0;
13. 
    
14. float canvas_width;
15. float canvas_height;
16. 
    
17. 
    
18. ///////////////////////////////////////////////////////////////////////////
19. void setup() {
20.   size(1000, 1000);
21.  
22.   stopsJSON = loadJSONObject("stops.json");
23.  
24.   stops = stopsJSON.getJSONArray("features");
25.   //println(stops.size());
26.   stations = new Stop[stops.size()];
27.  
28.   for (int i = 0; i < stops.size(); i++) {
29.     JSONObject stop_i = stops.getJSONObject(i);
30.     JSONObject stop_i_properties = stop_i.getJSONObject("properties");
31.     int stopId            = stop_i_properties.getInt("stopId");
32.     int stopNumber        = stop_i_properties.getInt("stopNumber");
33.     String stopName       = stop_i_properties.getString("stopName");
34.     String stopName_short = stop_i_properties.getString("stopNameShort");
35.    
36.     JSONObject stop_i_geometry = stop_i.getJSONObject("geometry");
37.     double stop_longitude = stop_i_geometry.getJSONArray("coordinates").getDouble(0);
38.     double stop_latitude  = stop_i_geometry.getJSONArray("coordinates").getDouble(1);
39.    
40.     if ( (float)stop_longitude < longitude_min ) {
41.       longitude_min = (float)stop_longitude ;
42.     } else if ( (float)stop_longitude > longitude_max ) {
43.       longitude_max = (float)stop_longitude ;
44.     }
45.    
46.     if ( (float)stop_latitude < latitude_min ) {
47.       latitude_min = (float)stop_latitude ;
48.     } else if ( (float)stop_latitude > latitude_max ) {
49.       latitude_max = (float)stop_latitude ;
50.     }
51.    
52.     println("_________________________");
53.     println("stop sequence: " + i);
54.     println("stopId: " + stopId);   
55.     println("stopNumber: " + stopNumber);
56.     println("stopName: " + stopName);
57.     println("stopName_short: " + stopName_short);
58.     println("stop_longitude: " + stop_longitude);
59.     println("stop_latitude: " + stop_latitude);
60.    
61.     stations[i] = new Stop();
62.     stations[i].stopId = stopId;
63.     stations[i].stopNumber = stopNumber;
64.     stations[i].stopName = stopName;
65.     stations[i].stopName_short = stopName_short;
66.     stations[i].stop_longitude = stop_longitude;
67.     stations[i].stop_latitude = stop_latitude;
68.    
69.   }
70.  
71.   println("longitude_min: " + longitude_min);
72.   println("longitude_max: " + longitude_max);
73.   println("latitude_min: "  + latitude_min);
74.   println("latitude_max: "  + latitude_max);
75.  
76.   float canvas_proportion = ((float)latitude_max - (float)latitude_min) / ((float)longitude_max - (float)longitude_min);
77.   println("canvas_proportion: " + canvas_proportion);
78.  
79.   if ( (height/width) >= canvas_proportion ) {
80.     canvas_width = width;
81.     canvas_height = canvas_proportion * width;
82.   } else if ( (height/width) < canvas_proportion ) {
83.     canvas_width = height / canvas_proportion;
84.     canvas_height = height;
85.   } 
86. 
    
87. }
88. 
    
89. 
    
90. ///////////////////////////////////////////////////////////////////////////
91. void draw() {
92.   background(0);
93.  
94.   fill(30);
95.   noStroke();
96.   rect( (width - (width-canvas_width)/2 - canvas_width),
97.         (height - (height - canvas_height)/2 - canvas_height),
98.         canvas_width, canvas_height);
99.        
100.   strokeWeight(2);
101.   stroke(255);
102.  
103.   for (Stop stop : stations) {
104.     stop.drawStop();
105.   }
106. }
107. 
     
108. 
     
109. class Stop {
110.   int stopId;
111.   int stopNumber;
112.   String stopName;
113.   String stopName_short;
114.   double stop_longitude;
115.   double stop_latitude;
116.  
117.   void Stop () {}
118.  
119.   void drawStop () {
120.     float ptX = map((float)stop_longitude, longitude_min,longitude_max,
121.                     width - (width-canvas_width)/2 - canvas_width,
122.                     width - (width-canvas_width)/2);
123.     float ptY = map((float)stop_latitude,  latitude_max,latitude_min,
124.                     height - (height - canvas_height)/2 - canvas_height,
125.                     height - (height - canvas_height)/2);
126.     point(ptX, ptY);
127.   }
128.  
129. }

Hi, is there a standard library to process Geojson data in processing such as the data for Urban Data Challenge :
https://github.com/swissnexSF/Urban-Data-Challenge/tree/master/public-transportation/zurich/geo

The geojson data is like:

1. {
2. "type": "FeatureCollection",
3.                                                                                
4. "features": [
5. { "type": "Feature", "properties": { "stopId": 2735, "stopNumber": 4, "stopNameShort": "ZOOF", "stopName": "Zürich, Zoo\/Forrenweid" }, "geometry": { "type": "Point", "coordinates": [ 8.577939444444439, 47.380353055555602 ] } }
6. ,
7. { "type": "Feature", "properties": { "stopId": 2735, "stopNumber": 4, "stopNameShort": "ZOOF", "stopName": "Zürich, Zoo\/Forrenweid" }, "geometry": { "type": "Point", "coordinates": [ 8.57826333333333, 47.3806377777778 ] } }
8. ,
9. { "type": "Feature", "properties": { "stopId": 2375, "stopNumber": 2814, "stopNameShort": "WALD", "stopName": "Zürich, Waldgarten" }, "geometry": { "type": "Point", "coordinates": [ 8.557161666666669, 47.403754444444402 ] } }
10. ]
11. }

Thanks!

may i ask where to find the "experiment mode"? it seems to be nice feature but has been removed from the latest release.

thanks!

I'm using MoveMapper developed by Nicholas Felton to viz the data collected by the Moves for iPhone App.

However, I get the following error message after obtain the accessToken from Moves website according to Nicholas' guide on Github for MoveMapper ( https://github.com/feltron/MMapper)



Advices are appreciated!

I have a very simple Processing code shown below. However, after I export it as windows application, the 32bit version gave me an error, and the 64bit version don't show up at all (a terminal window flashed quickly and disappear... )

Is there anything import I missed here?

The code is as simple as:

void setup(){
  println("Hello!");
}

error for the 32bit version:

I don't understand why the "double buffering" version of the code shown below doesn't seem to improve the rendering significantly as compared with the "non double buffering" version according to frame rate ...

Appreciate your advices on:
1. Am I using "double buffering" correctly?
2. how to get the points shown on top of the lines?

Thanks!

animation:



non double buffering" version:

1. /*---------------------------------
2. coded by Ji ZHANG of E.P.i.S.O.D.E
3. Jun 2013
4. reference: http://www.drifkin.net/
5. ---------------------------------*/
6. 
   
7. import java.util.Iterator;
8. import java.util.Calendar;
9. import processing.opengl.*;
10. //------ controlP5
11. import controlP5.*;
12. ControlP5 controlP5;
13. boolean GUI = false;
14. boolean guiEvent = false;
15. Slider[] sliders;
16. ArrayList<Pt> ptList = new ArrayList<Pt>();
17. int ptNum = 100;
18. int screenW = 800;
19. int screenH = 800;
20. int distThreshold = 70;
21. int ptSize = 10;
22. 
    
23. //#################################################
24. void setup(){
25.   size(screenW, screenH, OPENGL);
26.   smooth(8);
27.   frameRate(60);
28.   background(0);
29.  
30.   //----- initiate pts -----
31.   for (int i=0; i<ptNum; i++) {
32.     PVector l_ = new PVector(random(screenW), random(screenH), 0);
33.     //PVector v_ = new PVector(random(-2,2), random(-2,2), 0);
34.     PVector v_ = new PVector(random(-1,1), random(-1,1), 0);
35.     PVector a_ = new PVector(0,0,0);
36.     float s_ = ptSize;
37.     color c_ = color(random(255), random(255), random(255));
38.     Pt p = new Pt(l_, v_, a_, s_, c_);
39.     ptList.add(p);
40.   }
41.  
42.   //----- GUI -----
43.   setupGUI();
44.   //guiEvent = false;
45.  
46. }
47. 
    
48. //#################################################
49. void draw(){
50.   background(30);
51.   //fill(40,1);
52.   //rect(0,0,width,height);
53.   for (int i=0; i<1; i++) {
54.     PVector l_ = new PVector(random(screenW), random(screenH), 0);
55.     //PVector v_ = new PVector(random(-2,2), random(-2,2), 0);
56.     PVector v_ = new PVector(random(-1,1), random(-1,1), 0);
57.     PVector a_ = new PVector(0,0,0);
58.     float s_ = ptSize;
59.     color c_1 = color(random(255), random(255), random(255));
60.     //color c_1 = color(255);
61.     color c_2 = color(0);
62.     Pt p1 = new Pt(l_, v_, a_, s_, c_1);
63.     Pt p2 = new Pt(l_, v_, a_, s_, c_2);
64.    
65.     ptList.add(p1);
66.     //ptList.add(p2);
67.   }
68.   Iterator<Pt> it = ptList.iterator();
69.   while (it.hasNext()) {
70.     Pt p = it.next();
71.     p.run();
72.     if (p.isDead()) {
73.       it.remove();
74.     }
75.   }
76.  
77.   fill(255);
78.   text("E.P.i.S.O.D.E", 10,height-10);
79.   text("Num of pt : "+ptList.size(), 10, 20);
80.   text("frame rate : "+nfc(frameRate,1), 10, 30);
81.  
82.   //----- draw GUI -----
83.   //drawGUI();
84.  
85. }
86. class Pt {
87.   //----- variables
88.   PVector location;
89.   PVector velocity;
90.   PVector acceleration;
91.   float ptMass;
92.   float ptSize;
93.   color ptColor;
94.   float ptAlpha;
95.   float age;
96.   float lifespan;
97.   //----- constructor
98.   Pt(PVector l_, PVector v_, PVector a_, float s_, color c_){
99.     location = l_.get();
100.     velocity = v_.get();
101.     acceleration = a_.get();
102.     ptSize = s_;
103.     ptColor = c_;
104.     age = 0;
105.     ptAlpha = 0;
106.   }
107.   //----- run
108.   void run(){
109.     update();
110.     drawLine(ptList);
111.     displayPt();
112.   }
113.  
114.   //----- udpate
115.   void update(){
116.     velocity.add(acceleration);
117.     location.add(velocity);
118.     acceleration.mult(0);
119.     age += 1;
120.     if(ptAlpha < 255){
121.       ptAlpha = age*5;
122.     }
123.   }
124.  
125.   //----- display pt -----
126.   void displayPt(){   
127.     stroke(ptColor, ptAlpha);
128.     strokeWeight(ptSize);
129.     point(location.x, location.y, location.z); 
130.   }
131.  
132.   //----- isDead
133.   boolean isDead(){
134.     if (
135.         (location.x>width) ||
136.         (location.x<0) ||
137.         (location.y>height) ||
138.         (location.y<0)    
139.        )
140.     {
141.       return true;
142.     } else {
143.       return false;
144.     }
145.   }
146.   //----- connection lines -----
147.   void drawLine(ArrayList<Pt> ptList_){
148.     for (Pt p : ptList_) {
149.       PVector pNeighborLocation = new PVector(p.location.x, p.location.y, p.location.z);
150.       float dist = location.dist(pNeighborLocation);
151.       if (dist < distThreshold){
152.         float lineAlpha = map(dist, 0,distThreshold, 255,0);
153.         stroke(ptColor, lineAlpha);
154.         strokeWeight(1);
155.         line(location.x, location.y, location.z,
156.              pNeighborLocation.x, pNeighborLocation.y, pNeighborLocation.z);
157.       }
158.     }
159.   }
160.  
161. }
162. //////////////////////////////////////////////////
163. void setupGUI(){
164.   controlP5 = new ControlP5(this);
165.   controlP5.setAutoDraw(false);
166.   //----- define menu group -----
167.   ControlGroup ctrl = controlP5.addGroup("menu",15,50)//name,x,y,w,h
168.                       .activateEvent(true)
169.                     //.setColorLabel(color(255))
170.                       .setColorBackground(color(255,100))
171.                       .setBackgroundHeight(height-100)
172.                       .setBackgroundColor(color(255,100))
173.                       .setWidth(210)
174.                       .setHeight(15)
175.                       .close()
176.                       ;
177.   int left = 5;
178.   int top = 15;
179.   int len = 130;
180.   int posY = 0;
181.  
182.   sliders = new Slider[30];
183.  
184.   int si = 0;
185.                                     //name, min, max, default, x, y, w, h             
186.   sliders[si++] = controlP5.addSlider("dist_threshold",0,200,100,left,top+posY,len,15)
187.                   .setLabel("dist threshold")
188.                   .setGroup(ctrl)
189.                   ;
190.   posY += 30;  
191. }
192. //////////////////////////////////////////////////
193. void drawGUI(){
194.   hint(DISABLE_DEPTH_TEST);
195.       controlP5.show();
196.       controlP5.draw();
197.   hint(ENABLE_DEPTH_TEST);
198. }
199. //////////////////////////////////////////////////
200. //----- event to change dist threshold -----
201. public void dist_threshold (float theValue){
202.   distThreshold = int(theValue);
203. }

"double buffering" version:

1. /*---------------------------------
2. coded by Ji ZHANG of E.P.i.S.O.D.E
3. Jun 2013
4. reference: http://www.drifkin.net/
5. ---------------------------------*/
6. import java.util.Iterator;
7. import java.util.Calendar;
8. import processing.opengl.*;
9. //------ controlP5
10. import controlP5.*;
11. ControlP5 controlP5;
12. boolean GUI = false;
13. boolean guiEvent = false;
14. Slider[] sliders;
15. ArrayList<Pt> ptList = new ArrayList<Pt>();
16. int ptNum = 100;
17. int screenW = 800;
18. int screenH = 800;
19. int distThreshold = 70;
20. int ptSize = 10;
21. PGraphics pg;
22. //#################################################
23. void setup(){
24.   size(screenW, screenH, OPENGL);
25.   smooth(8);
26.   frameRate(60);
27.   background(0);
28.  
29.   //----- initiate pts -----
30.   for (int i=0; i<ptNum; i++) {
31.     PVector l_ = new PVector(random(screenW), random(screenH));
32.     //PVector v_ = new PVector(random(-2,2), random(-2,2));
33.     PVector v_ = new PVector(random(-1,1), random(-1,1));
34.     PVector a_ = new PVector(0,0);
35.     float s_ = ptSize;
36.     color c_ = color(random(255), random(255), random(255));
37.     Pt p = new Pt(l_, v_, a_, s_, c_);
38.     ptList.add(p);
39.   }
40.  
41.   //----- GUI -----
42.   //setupGUI();
43.   //guiEvent = false;
44.  
45.   //!!! it will be very slow without the "OPENGL" option !!!
46.   pg = createGraphics(screenW, screenH, OPENGL);
47. }
48. //#################################################
49. void draw(){
50.   pg.beginDraw();
51.  
52.   pg.background(20);
53.   //pg.fill(0, 10);
54.   //pg.rect(0,0,width,height);
55.   for (int i=0; i<1; i++) {
56.     PVector l_ = new PVector(random(screenW), random(screenH));
57.     //PVector v_ = new PVector(random(-2,2), random(-2,2), 0);
58.     PVector v_ = new PVector(random(-1,1), random(-1,1));
59.     PVector a_ = new PVector(0,0);
60.     float s_ = ptSize;
61.     color c_1 = color(random(255), random(255), random(255));
62.     //color c_1 = color(255);
63.     color c_2 = color(0);
64.     Pt p1 = new Pt(l_, v_, a_, s_, c_1);
65.     Pt p2 = new Pt(l_, v_, a_, s_, c_2);
66.    
67.     ptList.add(p1);
68.     //ptList.add(p2);
69.   }
70.   Iterator<Pt> it = ptList.iterator();
71.   while (it.hasNext()) {
72.     Pt p = it.next();
73.     p.run();
74.    
75.     if (p.isDead()) {
76.       it.remove();
77.     }
78.   }
79.  
80.   pg.fill(255);
81.   pg.text("E.P.i.S.O.D.E", 10,height-10);
82.   pg.text("Num of pt : "+ptList.size(), 10, 20);
83.   pg.text("frame rate : "+nfc(frameRate,1), 10, 30);
84.   //----- draw GUI -----
85.   //drawGUI();
86.  
87.   pg.endDraw();
88.   image(pg,0,0);
89. }
90. class Pt {
91.   //----- variables
92.   PVector location;
93.   PVector velocity;
94.   PVector acceleration;
95.   float ptMass;
96.   float ptSize;
97.   color ptColor;
98.   float ptAlpha;
99.   float age;
100.   float lifespan;
101.   //----- constructor
102.   Pt(PVector l_, PVector v_, PVector a_, float s_, color c_){
103.     location = l_.get();
104.     velocity = v_.get();
105.     acceleration = a_.get();
106.     ptSize = s_;
107.     ptColor = c_;
108.     age = 0;
109.     ptAlpha = 0;
110.   }
111.   //----- run
112.   void run(){
113.     update();
114.     display();
115.   }
116.  
117.   //----- udpate
118.   void update(){
119.     velocity.add(acceleration);
120.     location.add(velocity);
121.     acceleration.mult(0);
122.     age += 1;
123.     if(ptAlpha < 255){
124.       ptAlpha = age*3;
125.     }
126.   }
127.  
128.   //----- display
129.   void display(){
130.     drawLine(ptList);   
131.     pg.stroke(ptColor, ptAlpha);
132.     pg.strokeWeight(ptSize);
133.     pg.point(location.x, location.y);
134.   }
135.  
136.   //----- isDead
137.   boolean isDead(){
138.     if (
139.         (location.x>width) ||
140.         (location.x<0) ||
141.         (location.y>height) ||
142.         (location.y<0)    
143.        )
144.     {
145.       return true;
146.     } else {
147.       return false;
148.     }
149.   }
150.   //----- connection lines -----
151.   void drawLine(ArrayList<Pt> ptList_){
152.     for (Pt p : ptList_) {
153.       PVector pNeighborLocation = new PVector(p.location.x, p.location.y);
154.       float dist = location.dist(pNeighborLocation);
155.       if (dist < distThreshold){
156.         float lineAlpha = map(dist, 0,distThreshold, 255,0);
157.         pg.stroke(ptColor, lineAlpha);
158.         pg.strokeWeight(1);
159.         pg.line(location.x, location.y,
160.                 pNeighborLocation.x, pNeighborLocation.y);
161.       }
162.     }
163.   }
164.  
165. }
166. //////////////////////////////////////////////////
167. void setupGUI(){
168.   controlP5 = new ControlP5(this);
169.   controlP5.setAutoDraw(false);
170.   //----- define menu group -----
171.   ControlGroup ctrl = controlP5.addGroup("menu",15,50)//name,x,y,w,h
172.                       .activateEvent(true)
173.                     //.setColorLabel(color(255))
174.                       .setColorBackground(color(255,100))
175.                       .setBackgroundHeight(height-100)
176.                       .setBackgroundColor(color(255,100))
177.                       .setWidth(210)
178.                       .setHeight(15)
179.                       .close()
180.                       ;
181.   int left = 5;
182.   int top = 15;
183.   int len = 130;
184.   int posY = 0;
185.  
186.   sliders = new Slider[30];
187.  
188.   int si = 0;
189.                                     //name, min, max, default, x, y, w, h             
190.   sliders[si++] = controlP5.addSlider("dist_threshold",0,200,150,left,top+posY,len,15)
191.                   .setLabel("dist threshold")
192.                   .setGroup(ctrl)
193.                   ;
194.   posY += 30;  
195. }
196. //////////////////////////////////////////////////
197. void drawGUI(){
198.   hint(DISABLE_DEPTH_TEST);
199.       controlP5.show();
200.       controlP5.draw();
201.   hint(ENABLE_DEPTH_TEST);
202. }
203. //////////////////////////////////////////////////
204. //----- event to change dist threshold -----
205. public void dist_threshold (float theValue){
206.   distThreshold = int(theValue);
207. }

I remember someone has written a processing library (or wrapper) for the lighting simulation software Radiance ( http://ww.radiance-online.org/). But I don't remember where it is....

Can anybody advise?

Thanks!

Previously, the change for each version is listed out in the download page.

Where can we find this information now?

Thanks!

may I ask if Processing is or can be optimized for multi-core parallel processing, or utilization of GPU's computational power?

thx!

I downloaded the latest PeasyCam library from
https://github.com/jeffg2k/peasycam/blob/master/distribution/peasycam.zip?raw=true

However, there's no library folder inside. Should I compile it by myself? and How?

It is also missing from the "add library" function of Processing 2.0b9

Where should I download the latest version of PeasyCam? Thanks!

Does anybody know where to find Jer Thorp's code example on how to do control ease ? I lost my copy ...

Thanks!

I installed the latest Processing 2.0b9 (2013 05 18), but it keeps reminding me the following when I open processing:

You are running Processing revision 216, the latest is 217.

May I ask why?

Thanks!

we can use the following to add radio buttons:

1.   controlP5.addRadioButton("color_mode")
2.            .setPosition(10,10)
3.            .setItemWidth(15)
4.            .setItemHeight(15)
5.            .addItem("aaa",0)
6.            .addItem("bbb",1)
7.            .addItem("cccc",2)
8.            .activate(0)
9.            ;

but how to add different tooltip for each of the bottons? the following doesn't seem to work ...

1. controlP5.getTooltip().register("color_mode", "color mode");

thanks!

It seems only various types of vertexes can be specified in a beginShape()/endShape() block, and bezier curve can't represent ellipse exactly.

How to define an arc (defined as part of an ellipse) connected to one end of a line?

Thanks!

can you kindly recommend an example on how to realize the "radial diagram" type of data viz like the one created by Jer Thorp? Thank you!

image source: http://blog.blprnt.com/blog/blprnt/avengers-assembled-and-visualized-part-1

The original no-double-buffer script (1st image) and the problematic script using double-buffer approach (2nd image) are shown below.

Advices on correct use of double-buffer in 3D scene with ControlP5 library are appreciated!





original non-double-buffer script:

1. // source of code:
2. // http://www.creativecoding.org/example/processing:objektorientiertes-animieren-03-wandern-farbig
3. // modified by tfguy44 and oatcracker:
4. // https://forum.processing.org/topic/how-to-use-alpha-to-animate-moving-points-with-fading-tails-in-3d-space#25080000002020325
5. // ---------------------------------------------
6.  
7. import processing.opengl.*; // openGL library
8.  
9. import peasy.*; // camera library
10. PeasyCam cam;
11.  
12. int numPt = 1000; // number of tadpole
13. int tailLength = 30; // tail length of tadpole
14. Gizmo giz[] = new Gizmo[numPt];
15.  
16. boolean animateToggle = true;
17.  
18. //__________________________________________________________________________________
19. void setup () {
20.   size (500,500,OPENGL);
21.   //frame.setResizable(true);
22.   smooth(8);
23.   colorMode (HSB, 255); //note: HSB color mode doesn't work with gicentre library
24.  
25.   // setup view
26.   // setup perspective parm
27.   float fov = PI/3.0;  // field of view
28.   float nearClip = 1;
29.   float farClip = 100000;
30.   float aspect = float(width)/float(height);
31.   perspective(fov, aspect, nearClip, farClip);
32.  
33.   cam = new PeasyCam(this, 300); // the smaller the var, the close the distance to the object
34.      
35.   // initiate pts
36.   for (int i=0; i < giz.length; i++) {
37.     giz[i] = new Gizmo (random(-100,100),random(-100,100),random(-100,100),tailLength);
38.   }
39.   
40. }
41.  
42. //__________________________________________________________________________________
43. void draw () {
44.   background(150);
45.  
46.   //translate(250,250);
47.   
48.   if (animateToggle == true) {
49.     noFill();
50.     strokeWeight(2);
51.     stroke(100,100,100); // White in HSB
52.     box(200);
53.     
54.     noStroke ();  
55.     for (int i=0; i < giz.length; i++) {
56.       giz[i].move();
57.       giz[i].render();
58.     }
59.   } else { // if animatin toggle is false, just render the pts and their tails so far
60.    
61.     noFill();
62.     strokeWeight(2);
63.     stroke(100,100,100); // White in HSB
64.     box(200);
65.     
66.     noStroke ();  
67.     for (int i=0; i < giz.length; i++) {
68.       giz[i].render();
69.     } 
70.   }
71.  
72. }
73.  
74.  
75.  
76. class Gizmo {
77.   
78.   // position PVector array "position" to store all the positions of a pt as it moves with a tail
79.   // the length of the PVector array is the length of the tail, or total num of points forming the tail
80.   PVector[] positions;
81.   
82.   int[] hues;
83.   PVector direction;
84.   int total;
85.   float spin = 0.2; // degree of direction changing
86.   
87.   int tailLength;
88.  
89.   //__________________________________________________________________
90.   Gizmo (float theX, float theY, float theZ, int tailLength_) {
91.     positions = new PVector[tailLength_]; // tail length of 100
92.     hues = new int[tailLength_];
93.     
94.     for(int i=0;i<positions.length;i++){
95.       positions[i] = new PVector (theX, theY, theZ);
96.     }
97.     
98.     //hues[0] = 0;
99.     hues[0] = (int)random(255);
100.     
101.     total=1; // initial length of tail
102.     
103.     direction   = new PVector ();
104.     direction.x = random (-1, 1);
105.     direction.y = random (-1, 1);
106.     direction.z = random (-1, 1);
107.     
108.     tailLength = tailLength_;
109.   }
110.   
111.   //__________________________________________________________________
112.   void move () {
113.     direction.x += random(-spin, spin);
114.     direction.y += random(-spin, spin);
115.     direction.z += random(-spin, spin);
116.     direction.normalize();
117.  
118.     // "total" is the length of tail
119.     // or total # of pts to draw along the tail for the current iteration
120.     // for each "draw" iteration, the # of pts to draw on the curernt frame will increase
121.     // if "(tailLength-1)" is used, the pt at the end of the tail will not be transparent ...
122.     if(total<(tailLength-2)){total++;}
123.     
124.     for( int i=total; i>=1; i-- ){
125.       positions[i].x = positions[i-1].x;
126.       positions[i].y = positions[i-1].y;
127.       positions[i].z = positions[i-1].z;
128.       hues[i] = hues[i-1];
129.     }
130.     
131.     positions[0].add (direction);
132.     //hues[0] = getHue();
133.  
134.     if (positions[0].x < -100 || positions[0].x > 100) {
135.       direction.x *= -1;
136.     }
137.     if (positions[0].y < -100 || positions[0].y > 100) {
138.       direction.y *= -1;
139.     }
140.     if (positions[0].z < -100 || positions[0].z > 100) {
141.       direction.z *= -1;
142.     }
143.     
144.   }
145.   
146.   //__________________________________________________________________
147.   void render () {
148.  
149. //    // tail point is on top
150. //    for( int i = total-1; i >= 0; i-- ){
151. //      stroke( hues[i], 255, 255, map(i, 0,total, 255,0) );
152. //      //println( total + " " + i );
153. //      //strokeWeight(map(i,0,100,5,1)); // to make shrinking tail effect
154. //      strokeWeight(map(i,0,100,1,6)); // to make shrinking head effect
155. //      point (positions[i].x, positions[i].y, positions[i].z);
156. //    }
157.     
158.     // header point is on top
159.     for( int i = 0; i < total-1; i++ ){
160.       stroke( hues[i], 255, 255, map(i, 0,total, 255,0) );
161.       //println( total + " " + i );
162.       //strokeWeight(map(i,0,100,5,1)); // to make shrinking tail effect
163.       strokeWeight(map(i, 0,100, 0.5,20)); // to make shrinking head effect(i.e head pt size 0, tail pt size 6)
164.       point (positions[i].x, positions[i].y, positions[i].z);
165.     }
166.  
167.   }
168.   
169.   //__________________________________________________________________
170.   int getHue () {
171.     PVector v = new PVector (0, 1);
172.     float a = PVector.angleBetween (v, direction);
173.     a /=  TWO_PI;
174.     return int (255 * a);
175.   }
176. }
177. // press space bar and pick a file
178. void keyPressed() {
179.  
180.   if ( key == 'a' ) { // boolean value switcher
181.     animateToggle = (animateToggle == true) ? (false):(true);
182.   }
183.  
184. }

May I ask how the following script can be revised using double-buffering technique so that it can run more smoothly when a far larger amount of points (say, 10000) are generated ? especially how this technique should be applied on each mover object's display method level?

Thanks!



code reference: Daniel Shiffman's The Nature of Code exercise_2_1

1. // keys:
2. // [space] : toggle animation
3. 
   
4. Mover[] movers = new Mover[100];
5. boolean animationToggle = false;
6. 
   
7. void setup(){
8.   size(700,350);
9.   for(int i=0; i<movers.length; i++){
10.     movers[i] = new Mover(random(0.5,3),random(0,width),random(0,height),
11.                           color(floor(random(255)),floor(random(255)),floor(random(255)))
12.                          );
13.   }
14. }
15. 
    
16. void draw() {
17.   PVector wind = new PVector(0.01,0);
18.   PVector gravity = new PVector(0,0.1);
19.  
20.   if (animationToggle == true){
21.     fill(0,10);
22.     rect(0,0,width,height);
23.     for(int i=0; i<movers.length; i++){
24.       movers[i].applyForce(wind);
25.       movers[i].applyForce(gravity);
26.    
27.       movers[i].update();
28.       movers[i].display();
29.       movers[i].checkEdges();
30.     }
31.   }
32. }
33. 
    
34. class Mover{
35.   PVector location;
36.   PVector velocity;
37.   PVector acceleration;
38.   float mass;
39.   color c;
40. 
    
41.   Mover(float m_, float x_, float y_, color c_) {
42.     location = new PVector(x_,y_);
43.     velocity = new PVector(0,0);
44.     acceleration = new PVector(0,0);
45.     mass = m_;
46.     c = c_;
47.   }
48.  
49.   void applyForce(PVector force){
50.     PVector f = PVector.div(force,mass);
51.     acceleration.add(f);
52.   }
53.  
54.   void update() {
55.     velocity.add(acceleration);
56.     location.add(velocity);
57.     acceleration.mult(0);
58.   }
59.  
60.   void display() {
61.     noStroke();
62.     fill(c);
63.     ellipse(location.x,location.y,mass*10,mass*10);//scale by mass
64.   }
65.   void checkEdges() {
66.     if (location.x > (width-mass*5)) {
67.       location.x = width-mass*5;
68.       velocity.x *= -1;
69.     } else if (location.x < (0-mass*5)) {
70.       velocity.x *= -1;
71.       location.x = mass*5;
72.     }
73.     if (location.y > (height-mass*5)) {
74.       velocity.y *= -1;
75.       location.y = height-mass*5;
76.     }
77.   }
    
78. }
79. 
    
80. void keyPressed(){
81.   if ( key == ' ' ) {
82.     animationToggle = (animationToggle == true) ? (false):(true);
83.   } 
84. }

The following is the shell command I use in the terminal directly:

1. /Applications/Software/bin/render -n 8 A.txt < B.txt > C.txt

... in which, "render" is the program, "-n 8" is one of its parameter (number of CPU cores) and the value associated with it, "A.txt" is a base file, "B.txt" is the input file, "C.txt" is the output file.

I've tried the following but none can get the shell script run as it runs in the terminal ...

1. import java.io.*;
2. String[] cmd = {"/Applications/Software/bin/render", "-n", "8", "A.txt", "<", "B.txt", ">", "C.txt"};
3. //method 1
4. open(cmd);
5. //method 2
6. exec(cmd);
7. //method 3
8. Runtime.getRuntime().exec(cmd);

advices are appreciated!

advice is appreciated !

did anybody tried the code M_6_3_01? (code source: http://www.generative-gestaltung.de/code)

I got the following error, advice is appreciated!

Plus, for those using Processing 2.0b8, the following code need to be added:
import java.net.*;
import java.io.*;
import java.util.Calendar;
import java.util.Iterator;

can u recommend a reference on how to realize multiple Processing app windows?

the link to the famous post below that everybody mentioned seems broken for a while:
http://processing.org/discourse/yabb2/YaBB.pl?board=Syntax;action=display;num=1211220206

thanks!

Is there any advices on activate the middle mouse button of Magic Mouse in Processing?

Thanks!

I'd like to draw the trail for each of a group of bouncing points, but I can't get it work by using begainShape/endShape. No continuous line segments are created, instead points are still shown as individual points.

I assume the problem is related to the arraylist to store position history ...

Advices are appreciated!

reference for drawing bouncing points: "The Nature of Code" Exercise 2.1
reference for drawing trail from "Form and Code":
http://formandcode.com/code-examples/simulate-particles



code: (pls hit the "p" key after lunching the code to switch to line mode)

1. // keys:
2. // [space] : toggle animation
3. // [p]     : toggle point or line
4. 
   
5. Mover[] movers = new Mover[50];
6. boolean animationToggle = false;
7. boolean displayPt = true;
8. void setup(){
9.   size(700,350);
10.   for(int i=0; i<movers.length; i++){
11.     movers[i] = new Mover(random(0.5,3),
12.                           new PVector(random(0,width), random(0,height/2)),
13.                           color(floor(random(255)),floor(random(255)),floor(random(255)))
14.                          );
15.   }
16. }
17. void draw() {
18.   PVector wind = new PVector(0.03,0);
19.   PVector gravity = new PVector(0,0.4);
20.  
21.   if (animationToggle == true){
22.     //___op1: with tail
23.     //fill(0,10);
24.     //rect(0,0,width,height);
25.     //___op2: no tail
26.     //background(0);
27.    
28.     for(int i=0; i<movers.length; i++){
29.       movers[i].applyForce(wind);
30.       movers[i].applyForce(gravity);
31.       movers[i].update();
32.       movers[i].display();
33.       movers[i].checkEdges();
34.     }
35.   }
36. }
37. class Mover{
38.  
39.   PVector location;
40.   PVector velocity;
41.   PVector acceleration;
42.   float mass;
43.   color c;
44.   ArrayList<PVector> hist; //array list to store position history
45.   int cnt = 0; //counter
46.   Mover(float m_, PVector loc_, color c_) {
47.     location = new PVector(loc_.x, loc_.y);
48.     velocity = new PVector(0,0);
49.     acceleration = new PVector(0,0);
50.     mass = m_;
51.     c = c_;
52.     hist = new ArrayList<PVector>();
53.     hist.add(location);
54.   }
55.  
56.   void applyForce(PVector force){
57.     PVector f = PVector.div(force,mass);
58.     acceleration.add(f);
59.   }
60.  
61.   void update() {
62.     velocity.add(acceleration);
63.     location.add(velocity);
64.     acceleration.mult(0);
65. //    //_____op1: save location every 10 frames
66. //    if (frameCount % 10 == 0 && cnt<hist.size()) {
67. //      hist.add(location);
68. //      cnt++;
69. //    }
70.     //_____op2: save location every frames
71.     hist.add(location);    
72.   }
73.  
74.   void display() {
75.     noStroke();
76.     fill(c);
77.     if (displayPt == true){// draw pt
78.       ellipse(location.x,location.y,mass*10,mass*10);//scale by mass
79.     } else {// draw line
80.       noFill();
81.       stroke(255);
82.       strokeWeight(3);
83.       beginShape();
84.         for (int i=0; i<hist.size(); i++) {
85.           vertex(hist.get(i).x, hist.get(i).y);
86.         }
87.         vertex(location.x, location.y);
88.       endShape();      
89.     }
90.   }
91.   void checkEdges() {
92.     if (location.x > (width-mass*5)) {
93.       location.x = width-mass*5;
94.       velocity.x *= -1;
95.     } else if (location.x < (0-mass*5)) {
96.       velocity.x *= -1;
97.       location.x = mass*5;
98.     }
99.     if (location.y > (height-mass*5)) {
100.       velocity.y *= -1;
101.       location.y = height-mass*5;
102.     }
103.   }
104.  
105. }
106. void keyPressed(){
107.   if ( key == ' ' ) {
108.     animationToggle = (animationToggle == true) ? (false):(true);
109.   } 
110.  
111.   if ( key == 'p' ) {
112.     displayPt = (displayPt == true) ? (false):(true);
113.   }
114. }

I got the following error when running a code in Processing 2.0b8 in Mac OS, whereas the same code runs with no problem in Processing 2.0b8 in Windows7 ...

Help is appreciated!

I found that after updating the latest PeasyCam library, the size of point/line as shown in 3D scene is always relative rather than absolute. i.e. the size of a point/line as shown on screen is always the same no matter you zoom in or out.

Is it related to the update of Processing (2.0b8) or PeasyCam?

How can we show the point by its absolute size?

Thanks!