In this project, I want to find the relationship between art&design, economy and technology. During my undergraduate study, since my major was industrial design, I knew there was a website called Behance.net, which is like a instagram for designers to post their new projects on. Many designers use this website as their online portfolios. Since now I am major in media arts and technology, I am interested in getting an idea of the current situation of art and design. I want to visualize the relationship among culture, economy, technology and design using their API.
Before I working on the data from Behance, I found some lists from Wikipedia. And eventually, I decided to use the List of cities by GDP made by Brookings Institution from this link:
I wanted to set the data of the cities on the actual location of those cities, so I used this website:
And copy the value of latitude and longitude into the list.
In addition, I want to add another column which containing the data of the population of the city respectively. My solution is searching those cities on Wikipedia, finding the pages of those cities and copying the value of population into the new column.
My plan was searching in the “creative field” provided by JSON from Bechance. “Creative field” is a JSON object containing words describing the field in which the user is working, like “Graphic Design”, “Interaction Design” and “Digital Art”. I wanted to find which city is more interested in new media by counting the times that words like “Digital Art”,”User Interface Design” have shown up. But after I getting a better understanding of their API, I realized that it is not possible to regard this API as a MySQL database like SPL which I used in my former two projects. Because the API of Behance.net is not well developed, if I want to get the data, I have to download thousands of the JSON files and calculate the data manually. Bechance.net has limitations about user accessing their data, I can only download 150 JSON files in one hour using one API key. Therefore, I applied 10 API keys and used them to download JSON files.
There are also other parameters I want to use, like the number of following, followers and appreciates, to support my main idea and enrich the detail of the project. So after I downloaded about 20 thousand files, I used 10 processing file to calculate those ten portions of data, and save the data as ten csv files.
Next, I added all ten cvs files together and wrote the data into one cvs file using processing.
The data I downloaded from Behance.net contains many empty items which I cannot use in my visualization. And I couldn't figure out a better solution to get those data since I need to learn data mining, data analysis and skills about Java which I cannot finish in such a short time. As a result, I decided to make a good use of the data I've already got. Also, I think it would be fun to add a function which can search the most recent projects from the cities in the lists and show the cover picture and the fields.
Here is the code I used to search the most recent project posted on Bechance.net by cities:
Code: Select all
/************************************************************
* MAT259 PROJ 3 : Student Defined Visualization *
* *
* Junxiang Yao *
* *
* *
* Usage: Press M to show / hide the map *
* *
* Press T to show / hide the user information towers*
* *
* Press B to show / hide the user data boxes *
* *
* Press S to show all the most recent projects *
* *
* Press H to hide all the most recent projects *
* *
* Press L to show / hide the location line *
* *
* Press P to change transparency *
* *
* *
* *
* Tags: Interaction - Keyboard Control+mouse control *
* *
* pyramid - drawPyramid() *
* *
* structure - drawStructure *
* *
* gui - draw verbal information. *
* *
* *
************************************************************/
import controlP5.*;
ControlP5 cp5;
import peasy.*;
import peasy.org.apache.commons.math.*;
import peasy.org.apache.commons.math.geometry.*;
import peasy.test.*;
PeasyCam cam;
int horMargin = 100;
int verMargin = 100;
ArrayList<PImage> covers = new ArrayList();
PImage map;
PVector[] screenPos;
PImage colorBar;
Table table;
Table user;
int rows, cols;
float[][] dataMatrix;
String[] cityName;
JSONObject[] picture;
IntList Indexes = new IntList();
IntList App = new IntList();
IntList V = new IntList();
StringList C = new StringList();
ArrayList<StringList> Fields = new ArrayList<StringList>();
boolean[] fieldLine;
boolean loc = true;
boolean tower = false;
boolean box = true;
boolean imgs = true;
boolean mapShow = true;
boolean grid = false;
boolean transparency = false;
//-----------------------------
//fields
//-----------------------------
int rad = 1800;
String[] FieldName = {"Other", "Painting", "Graphic Design", "Spatial Design", "Crafts", "Photography", "Audio", "Performance", "Industrial Design",
"New Media", "Interaction Design"};
PVector[] FieldPos = new PVector[11];
String[] Painting = {"Visual Arts", " Visual Effects", "Street Art", "Graffiti", "Fine Arts", "Drawing", "Painting", "Caricature", "Cartooning"};
String[] GraphicDesign = {"Icon Design", "Branding", "Design", "Graphic Design", "Illustration", "Packaging", "Pattern Design",
"Typography", "Advertising", "Calligraphy", "Print Design", "Publishing", "Editing", "Editorial Design", "Creative Direction", "Art Direction"};
String[] SpatialDesign = {"Exhibition Design", "Architecture", "Interior Design", "Landscape Design", "Urbanism"};
String[] Crafts= {"Textile Design", "Toy Design", "Wood Working", "Origami", "Metal Working", "Masonry", "MakeUp Arts (MUA)",
"Leather Working", "Jewelry Design", "Glass Blowing", "Culinary Alchemy", "Culinary Arts", "Crafts", "Ceramics",
"Carpentry", "Enology (Wines)", "Sculpting", "Ice Sculpting", "Confectionary Arts"};
String[] Photography ={"Retouching", "Photo Illustration", "Photo Manipulation", "Photography", "Photojournalism"};
String[] Audio={"Singing", "Sound Design", "Songwriting", "Music", "Music Composition", "Music Production", "DJing", "Podcasting"};
String[] Performance={"Theater", "Screenwriting", "Performing Arts", "Dance", "Character Design", "Choreography", "Cinematography",
"Claymation", "Comedy", "Lighting Design", "Magic", "Film", "Directing", "Costume Design", "Set Design", "Puppetry", "Playwriting"};
String[] IndustrialDesign={"Product Design", "Production", "Industrial Design", "Engineering", "Furniture Design"};
String[] NewMedia={"Video Jockey", "Video Game Design", "Video Blogging", "Video Arts", "Multimedia", "Digital Art", "Digital Imaging",
"Digital Photography", "Installation Design", "Television", "Motion Graphics"};
String[] InteractionDesign={"Virtual World Design", "Web Design", "Web Development", "Software Architecture", "Programming", "Animation",
"Automotive Design", "Computer Animation", "Game Design", "Information Architecture", "Interaction Design", "UI/UX", "Machinima",
"Storyboarding", "Storytelling"};
String[] Other={"Academia", "Blogging", "Consulting", "Copywriting", "Documentary", "Entrepreneurship", "Fashion", "Fashion Styling",
"Hair Styling", "Journalism", "Marketing", "Millinery", "Perfumery", "Philanthropy", "Philosophy", "Poetry", "Writing", };
color[] fieldColor ={color(207, 0, 114), color(237, 28, 36), color(241, 90, 36), color(247, 147, 30), color(251, 176, 59), color(252, 238, 33),
color(140, 198, 63), color(0, 146, 69), color(0, 113, 188), color(46, 49, 146), color(108, 17, 157)};
PFont font;
void setup() {
size(1250, 720, P3D);
font = createFont("Arial", 80);
cam = new PeasyCam(this, 2500);
cam.setMinimumDistance(100);
cam.setMaximumDistance(4500);
textFont(font);
map = loadImage("mapX.png");
JSONObject[] picture = new JSONObject[154];
//covers = new PImage[154];
//________________________________________________
//Deal with the JSON;
//________________________________________________
for (int i = 0; i < 154; i++) {
try {
picture[i] = loadJSONObject(i+".json");
}
catch (NullPointerException e) {
println("Null");
}
}
println(picture[0]);
//int index = 0;
for (int i = 0; i < 154; i++) {
JSONArray jsa = picture[i].getJSONArray("projects");
println("debug_01: " + i);
if (jsa.size()>0) {
String imgURL = jsa.getJSONObject(0).getJSONObject("covers").getString("202");
println(imgURL);
covers.add(loadImage(imgURL));
Indexes.append(i);
App.append(jsa.getJSONObject(0).getJSONObject("stats").getInt("appreciations"));
V.append(jsa.getJSONObject(0).getJSONObject("stats").getInt("views"));
C.append(jsa.getJSONObject(0).getJSONArray("owners").getJSONObject(0).getString("city"));
StringList temp1 = new StringList();
if (jsa.getJSONObject(0).getJSONArray("owners").getJSONObject(0).getJSONArray("fields").size()==3) {
temp1.append(jsa.getJSONObject(0).getJSONArray("owners").getJSONObject(0).getJSONArray("fields").getString(0));
temp1.append(jsa.getJSONObject(0).getJSONArray("owners").getJSONObject(0).getJSONArray("fields").getString(1));
temp1.append(jsa.getJSONObject(0).getJSONArray("owners").getJSONObject(0).getJSONArray("fields").getString(2));
println(temp1);
}
if (jsa.getJSONObject(0).getJSONArray("owners").getJSONObject(0).getJSONArray("fields").size()==2) {
temp1.append(jsa.getJSONObject(0).getJSONArray("owners").getJSONObject(0).getJSONArray("fields").getString(0));
temp1.append(jsa.getJSONObject(0).getJSONArray("owners").getJSONObject(0).getJSONArray("fields").getString(1));
}
if (jsa.getJSONObject(0).getJSONArray("owners").getJSONObject(0).getJSONArray("fields").size()==1) {
temp1.append(jsa.getJSONObject(0).getJSONArray("owners").getJSONObject(0).getJSONArray("fields").getString(0));
}
Fields.add(temp1);
}
}
fieldLine = new boolean[covers.size()];
for (int i = 0; i < fieldLine.length; i++) {
fieldLine[i] = false;
}
println("Cover Size: " + covers.size());
println("Cover Size: " + Fields);
//-----------------------------
//backgroundData
//-----------------------------
table = loadTable("GDP_city.csv", "header");
user = loadTable("city_user.csv", "header");
rows = table.getRowCount();
cols = table.getColumnCount();
println(rows, cols);
dataMatrix = new float[cols-2][rows];
cityName = new String[rows];
screenPos = new PVector[rows];
for (int j=0; j<rows; j++) {
for (int i=0; i<cols-2; i++) {
dataMatrix[i][j] = table.getFloat(j, i+2);
}
}
for (int j=0; j<rows; j++) {
dataMatrix[1][j] = map(dataMatrix[1][j], -90, 90, height/2, -height/2);
dataMatrix[2][j] = map(dataMatrix[2][j], -180, 180, -width/2, width/2);
}
for (int i=0; i<rows; i++) {
cityName[i] = table.getString(i, 0);
}
for (int i = 0; i<11; i++) {
float theta = i*TWO_PI/11+PI/2;
FieldPos[i] = new PVector((rad/2)*cos(theta+PI/2), (rad/2)*sin(theta+PI/2), 0);
}
colorBar = loadImage("colorBar.jpg");
}
void draw() {
smooth();
rotateX(+.2);
//rotateY(-.5);
background(48, 42, 56);
if (mapShow) {
imageMode(CORNER);
tint(255, 255);
image(map, -width/2, -height/2, width, height);
}
//________________________________________________
//Deal with the JSON;
//________________________________________________
for (int i = 0; i<covers.size(); i++) {
//covers.size()
if (fieldLine[i]==true) {
pushMatrix();
imageMode(CENTER);
try {
translate(dataMatrix[2][Indexes.get(i)], dataMatrix[1][Indexes.get(i)], App.get(i)/16);
if (transparency) {
tint(255, 40);
} else {
tint(255, 255);
}
image(covers.get(i), 0, 0, covers.get(i).width*V.get(i)/40000, covers.get(i).height*V.get(i)/40000);
if (loc) {
stroke(100, 100);
line(0, 0, 0, 0, 0, -App.get(i)/16);
}
for (int j = 0; j < Fields.get(i).size(); j++) {
for (int k = 0; k < Painting.length; k++) {
if (Fields.get(i).get(j).equals(Painting[k])) {
pushMatrix();
translate(-dataMatrix[2][Indexes.get(i)], -dataMatrix[1][Indexes.get(i)], -App.get(i)/16);
stroke(237, 28, 36, 100);
line(dataMatrix[2][Indexes.get(i)], dataMatrix[1][Indexes.get(i)], App.get(i)/16, FieldPos[1].x, FieldPos[1].y, FieldPos[1].z);
popMatrix();
}
}
for (int k = 0; k < GraphicDesign.length; k++) {
if (Fields.get(i).get(j).equals(GraphicDesign[k])) {
pushMatrix();
translate(-dataMatrix[2][Indexes.get(i)], -dataMatrix[1][Indexes.get(i)], -App.get(i)/16);
stroke(241, 90, 36, 100);
line(dataMatrix[2][Indexes.get(i)], dataMatrix[1][Indexes.get(i)], App.get(i)/16, FieldPos[2].x, FieldPos[2].y, FieldPos[2].z);
popMatrix();
}
}
for (int k = 0; k < SpatialDesign.length; k++) {
if (Fields.get(i).get(j).equals(SpatialDesign[k])) {
pushMatrix();
translate(-dataMatrix[2][Indexes.get(i)], -dataMatrix[1][Indexes.get(i)], -App.get(i)/16);
stroke(247, 147, 30, 100);
line(dataMatrix[2][Indexes.get(i)], dataMatrix[1][Indexes.get(i)], App.get(i)/16, FieldPos[3].x, FieldPos[3].y, FieldPos[3].z);
popMatrix();
}
}
for (int k = 0; k < Crafts.length; k++) {
if (Fields.get(i).get(j).equals(Crafts[k])) {
pushMatrix();
translate(-dataMatrix[2][Indexes.get(i)], -dataMatrix[1][Indexes.get(i)], -App.get(i)/16);
stroke(251, 176, 59, 100);
line(dataMatrix[2][Indexes.get(i)], dataMatrix[1][Indexes.get(i)], App.get(i)/16, FieldPos[4].x, FieldPos[4].y, FieldPos[4].z);
popMatrix();
}
}
for (int k = 0; k < Photography.length; k++) {
if (Fields.get(i).get(j).equals(Photography[k])) {
pushMatrix();
translate(-dataMatrix[2][Indexes.get(i)], -dataMatrix[1][Indexes.get(i)], -App.get(i)/16);
stroke(252, 238, 33, 100);
line(dataMatrix[2][Indexes.get(i)], dataMatrix[1][Indexes.get(i)], App.get(i)/16, FieldPos[5].x, FieldPos[5].y, FieldPos[5].z);
popMatrix();
}
}
for (int k = 0; k < Audio.length; k++) {
if (Fields.get(i).get(j).equals(Audio[k])) {
pushMatrix();
translate(-dataMatrix[2][Indexes.get(i)], -dataMatrix[1][Indexes.get(i)], -App.get(i)/16);
stroke(140, 198, 63, 100);
line(dataMatrix[2][Indexes.get(i)], dataMatrix[1][Indexes.get(i)], App.get(i)/16, FieldPos[6].x, FieldPos[6].y, FieldPos[6].z);
popMatrix();
}
}
for (int k = 0; k < Performance.length; k++) {
if (Fields.get(i).get(j).equals(Performance[k])) {
pushMatrix();
translate(-dataMatrix[2][Indexes.get(i)], -dataMatrix[1][Indexes.get(i)], -App.get(i)/16);
stroke(0, 146, 69, 100);
line(dataMatrix[2][Indexes.get(i)], dataMatrix[1][Indexes.get(i)], App.get(i)/16, FieldPos[7].x, FieldPos[7].y, FieldPos[7].z);
popMatrix();
}
}
for (int k = 0; k < IndustrialDesign.length; k++) {
if (Fields.get(i).get(j).equals(IndustrialDesign[k])) {
pushMatrix();
translate(-dataMatrix[2][Indexes.get(i)], -dataMatrix[1][Indexes.get(i)], -App.get(i)/16);
stroke(0, 113, 188, 100);
line(dataMatrix[2][Indexes.get(i)], dataMatrix[1][Indexes.get(i)], App.get(i)/16, FieldPos[8].x, FieldPos[8].y, FieldPos[8].z);
popMatrix();
}
}
for (int k = 0; k < NewMedia.length; k++) {
if (Fields.get(i).get(j).equals(NewMedia[k])) {
pushMatrix();
translate(-dataMatrix[2][Indexes.get(i)], -dataMatrix[1][Indexes.get(i)], -App.get(i)/16);
stroke(46, 49, 146, 100);
line(dataMatrix[2][Indexes.get(i)], dataMatrix[1][Indexes.get(i)], App.get(i)/16, FieldPos[9].x, FieldPos[9].y, FieldPos[9].z);
popMatrix();
}
}
for (int k = 0; k < InteractionDesign.length; k++) {
if (Fields.get(i).get(j).equals(InteractionDesign[k])) {
pushMatrix();
translate(-dataMatrix[2][Indexes.get(i)], -dataMatrix[1][Indexes.get(i)], -App.get(i)/16);
stroke(108, 17, 157, 100);
line(dataMatrix[2][Indexes.get(i)], dataMatrix[1][Indexes.get(i)], App.get(i)/16, FieldPos[10].x, FieldPos[10].y, FieldPos[10].z);
popMatrix();
}
}
for (int k = 0; k < Other.length; k++) {
if (Fields.get(i).get(j).equals(Other[k])) {
pushMatrix();
translate(-dataMatrix[2][Indexes.get(i)], -dataMatrix[1][Indexes.get(i)], -App.get(i)/16);
stroke(207, 0, 114, 100);
line(dataMatrix[2][Indexes.get(i)], dataMatrix[1][Indexes.get(i)], App.get(i)/16, FieldPos[0].x, FieldPos[0].y, FieldPos[0].z);
popMatrix();
}
}
}
}
catch (NullPointerException e) {
//println("Image Invalid");
}
popMatrix();
//println(covers.get(i));
}
}
//-----------------------------
//backgroundData
//-----------------------------
//Pyramid
for (int j=0; j<rows; j++) {
float h = (dataMatrix[3][j]/250000);
if (h<1) {
h = 1;
}
float e = (dataMatrix[0][j]/35);
noStroke();
fill(color(#6d6cca), 100);
pushMatrix();
translate(dataMatrix[2][j], dataMatrix[1][j]);
//sphere(h);
drawPyramid(h, e);
//translate(0,0,0.01);
//ellipse(dataMatrix[2][j], dataMatrix[1][j],r,r);
translate(-dataMatrix[2][j], -dataMatrix[1][j]);
screenPos[j]= new PVector(screenX(dataMatrix[2][j], dataMatrix[1][j], 0.01), screenY(dataMatrix[2][j], dataMatrix[1][j], 0.01));
popMatrix();
}
//cityName
for (int j=0; j<rows; j++) {
if (dist(mouseX, mouseY, screenPos[j].x, screenPos[j].y)<4) {
pushMatrix();
float trans = dataMatrix[3][j]/1000000;
if (trans<1) {
trans = 1;
}
translate(dataMatrix[2][j], dataMatrix[1][j], 0.01);
fill(239, 108, 49);
textSize(20);
textAlign(CENTER);
text(cityName[j], 0, 0, 0);
rotateZ(PI);
translate(0, 0, -0.02);
rotateX(PI);
text(cityName[j], 0, 0, 0);
popMatrix();
}
}
//Box
for (int j=rows-1; j>=0; j--) {
stroke(color(#6db9bd));
fill(color(#6db9bd), 50);
//stroke(color(#6d6cca));
//fill(color(#6d6cca), 50);
if (box) {
pushMatrix();
translate(dataMatrix[2][j], dataMatrix[1][j], user.getInt(j, 1)/12+1.01 );
box(user.getInt(j, 1)/6);
popMatrix();
}
if (tower) {
pushMatrix();
translate(dataMatrix[2][j], dataMatrix[1][j], 0 );
drawStructure(user.getInt(j, 1)/8, user.getInt(j, 2)/100, user.getInt(j, 3)/100, user.getInt(j, 4)/1000, user.getInt(j, 5)/10000, user.getInt(j, 6), user.getInt(j, 7));
popMatrix();
}
}
pushMatrix();
noFill();
rotateZ(PI/2);
stroke(180);
strokeWeight(1);
ellipse(0, 0, rad, rad);
for (int i = 0; i < 11; i++) {
noFill();
pushMatrix();
float theta = i*TWO_PI/11;
translate((rad/2)*cos(theta+PI/2), (rad/2)*sin(theta+PI/2), 0.01);
rotate(theta+PI/2+PI);
textAlign(LEFT, CENTER);
textSize(30);
rectMode(CENTER);
fill(fieldColor[i]);
noStroke();
rect(20, 0, 40, 40);
fill(180);
text(FieldName[i], 40, 0);
popMatrix();
}
popMatrix();
gui();
}
void gui() {
hint(DISABLE_DEPTH_TEST);
cam.beginHUD();
//cp5.draw();
//-----------------------------
//title
//-----------------------------
fill(230);
textAlign(LEFT);
textFont(font);
textSize(50);
text("Art&Design Distribution", horMargin, verMargin);
textSize(16);
text("Using Data from Behance.net and Wikipedia to Find the Relationship among Art&Design, Technology and Economy.",
horMargin, verMargin+24);
//-----------------------------
//name
//-----------------------------
fill(200);
textAlign(LEFT, CENTER);
textSize(14);
text("Junxiang Yao", horMargin, verMargin+48);
text("MAT259 PROJ 3", horMargin, verMargin+62);
text("Student Defined Visualization", horMargin, verMargin+74);
//-----------------------------
//grid system
//-----------------------------
if (grid) {
stroke(#6d6cca);
strokeWeight(1);
line(0, verMargin, width, verMargin);
line(0, verMargin+8+16, width, verMargin+8+16);
line(0, verMargin+8+16+20, width, verMargin+8+16+20);
line(0, verMargin+8+16+60, width, verMargin+8+16+60);
//line(0, verMargin+8+16+206, width, verMargin+8+16+206);
//line(0, verMargin+8+16+216, width, verMargin+8+16+216);
line(0, verMargin+8+16+304, width, verMargin+8+16+304);
line(0, verMargin+412, width, verMargin+412);
line(0, height-verMargin, width, height-verMargin);
line(horMargin, 0, horMargin, height);
line(horMargin + 80, 0, horMargin + 80, height);
line(horMargin + 160, 0, horMargin + 160, height);
line(width - horMargin - 200, 0, width - horMargin - 200, height);
line(width-horMargin, 0, width-horMargin, height);
}
//-----------------------------
//keyboard control discription
//-----------------------------
fill(200);
textSize(20);
text("Keyboard Control",
horMargin, verMargin+396);
textSize(12);
textAlign(LEFT, CENTER);
text("Press M to show / hide the map",
horMargin, verMargin+416);
text("Press T to show / hide the user information towers",
horMargin, verMargin+14+416);
text("Press B to show / hide the user data boxes",
horMargin, verMargin+28+416);
text("Press S to show all the most recent projects",
horMargin, verMargin+42+416);
text("Press H to hide all the most recent projects",
horMargin, verMargin+56+416);
text("Press L to show / hide the location lines",
horMargin, verMargin+70+416);
text("Press P to change transparency",
horMargin, verMargin+84+416);
cam.endHUD();
hint(ENABLE_DEPTH_TEST);
}
void keyPressed() {
if (key == 's'||key == 'S') {
for (int i = 0; i < fieldLine.length; i++) {
fieldLine[i] = true;
}
}
if (key == 'h'||key == 'H') {
for (int i = 0; i < fieldLine.length; i++) {
fieldLine[i] = false;
}
}
for (int i = 0; i < fieldLine.length; i++) {
if (fieldLine[i] == true||key == 'l'||key == 'L') {
loc = !loc;
}
}
if (key == 't'||key == 'T') {
tower=!tower;
}
if (key == 'b'||key == 'B') {
box=!box;
}
if (key == 'm'||key == 'M') {
mapShow=!mapShow;
}
if (key == 'g'||key == 'G') {
grid=!grid;
}
for (int i = 0; i < fieldLine.length; i++) {
if (fieldLine[i] == true||key == 'i'||key == 'I') {
imgs=!imgs;
}
}
if (key == 'p'||key == 'P') {
transparency=!transparency;
}
}
void mousePressed() {
for (int m = 0; m < C.size(); m++) {
if (dist(mouseX, mouseY, screenPos[Indexes.get(m)].x, screenPos[Indexes.get(m)].y)<4) {
if (mousePressed||C.get(m)==cityName[Indexes.get(m)]) {
fieldLine[m]=!fieldLine[m];
}
}
}
}
void drawPyramid(float r,float t) {
smooth();
stroke(100);
color c = color(200);
// this pyramid has 4 sides, each drawn as a separate triangle
// each side has 3 vertices, making up a triangle shape
// the parameter " t " determines the size of the pyramid
beginShape(TRIANGLES);
noFill();
vertex(-t/2, t/2, 0);
vertex(t/2, t/2, 0);
vertex( 0, 0, -r);
noFill();
vertex(t/2, t/2, 0);
vertex(t/2, -t/2, 0);
vertex( 0, 0, -r);
noFill();
vertex(t/2, -t/2, 0);
vertex(-t/2, -t/2, 0);
vertex( 0, 0, -r);
noFill();
vertex(-t/2, -t/2, 0);
vertex(-t/2, t/2, 0);
vertex( 0, 0, -r);
endShape();
}
void drawStructure(float t, float a, float b, float c, float d, float nA, float tA) {
smooth();
float rate;
if (tA>0) {
rate = nA/tA;
} else {
rate = 0;
}
if (rate>0.4) {
rate = 0.4;
}
int transp;
if (transparency) {
transp = 150;
} else {
transp = 255;
}
//println(rate);
color cro = colorBar.get((int)map(rate, 0, 0.4, 0, colorBar.width), colorBar.height/2);
stroke(cro);
beginShape();
if (t<1) {
t = 1;
}
fill(cro, transp);
vertex(-t/2, t/2, 0);
vertex(t/2, t/2, 0);
vertex(t/2, t/2, a);
vertex(-t/2, t/2, b);
endShape();
beginShape();
fill(cro, transp);
vertex(t/2, t/2, 0);
vertex(t/2, -t/2, 0);
vertex(t/2, -t/2, c);
vertex(t/2, t/2, a);
endShape();
beginShape();
fill(cro, transp);
vertex(t/2, -t/2, 0);
vertex(-t/2, -t/2, 0);
vertex(-t/2, -t/2, d);
vertex(t/2, -t/2, c);
endShape();
beginShape();
fill(cro, transp);
vertex(-t/2, -t/2, 0);
vertex(-t/2, t/2, 0);
vertex(-t/2, t/2, b);
vertex(-t/2, -t/2, d);
endShape();
beginShape();
fill(cro, transp);
vertex(t/2, t/2, a);
vertex(-t/2, t/2, b);
vertex(t/2, -t/2, c);
endShape();
beginShape();
fill(cro, transp);
vertex(-t/2, t/2, b);
vertex(t/2, -t/2, c);
vertex(-t/2, -t/2, d);
endShape();
}