T^T Barchart T^T

T^T Barchart T^T

~ ร้อยละของประชากรอายุ 6 ปีขึ้นไปที่ใช้โทรศัพท์มือถือ จำแนกตามภาค ในระหว่าง ปี 2551-2555 ~

Barchart Processing.js code
/*หัวข้อ : ร้อยละของประชากรอายุ 6 ปีขึ้นไปที่ใช้โทรศัพมือถือจำแนกตามภาค ในระหว่าง ปี 2551-2555
มาจาก : สำนักงานสถิติแห่งชาติ : รายการสถิติ >> เทคโนโลยีสารสนเทศและการสื่อสาร >> การมีการใช้เทคโนโลยีสารสนเทศและการสื่อสารในครัวเรือน >> สรุปผลที่สำคัญ : ฉบับ Pocket Book (771 KB) หน้า 7
เข้าถึง : http://service.nso.go.th/nso/nsopublish/themes/theme_5-1-3.html
*/

//นำค่าที่ได้จากสถิติร้อยละที่ได้ กำหนดเข้าไปในตัวแปร float
float bangkok = 84.0;
float central = 75.1;
float northern = 68.9;
float northeast = 64.1;
float southern = 67.8;
float nationwide; //ประกาศตัวแปร nationwide

//พิมพ์ชื่อแต่ละภาคที่จำแนก ใส่ลงไปในช่องอาเรย์ float ตัวแปรที่แสดงผลเลขทศนิยมได้
float[] b = { bangkok, central, northern, northeast, southern};

//พิมพ์ชื่อแต่ละภาคที่จำแนก ใส่ลงไปในช่องอาเรย์ String["ตัวอักษร"]
String[] region = {"Bangkok", "Central", "Northern", "Northeast", "Southern","Nationwide"};


void setup(){
  size(500,300); //กำหนดขนาด size = 500,300 ตามแกน x,y
  textFont(createFont("NantatOO1.1.1-48",12)); //กำหนดฟอนต์ตัวอักษรและขนาด
  background(255,238,178); //กำหนดสีพื้นหลังสีส้อมอ่อนๆ ตามค่า RGB
  cal(); //เรียกใช้ฟังก์ชัน cal
  Barchart(); //เรียกใช้ฟังก์ชัน Barchart
}

int i = 0; //กำหนด ตัวเช็ครอบ การวนลูป และ แทนค่าของช่องอาเรย์ ที่เปลี่ยนไปในแต่ละการวนลูป

void Barchart(){
  int y = 230; //ประกาศและกำหนด ค่า y แทน จุดเริ่มต้นการสร้าง สี่เหลี่ยมแผนภูมิ ในแกน y
  int x = 40; //ประกาศและกำหนด ค่า x แทน จุดเริ่มต้นการสร้าง สี่เหลี่ยมแผนภูมิ ในแกน x
  i = 0;
  while(i < b.length){
     fill(255,118,230); //ใส่สีชมพูอ่อนๆ โดยกำหนดตามค่า RGB ให้คำสั่งต่อไป
     rect(x,y-b[i],20,b[i]); //วาดสี่เหลี่ยมที่มีจุดเริ่มต้นในแนวแกน x,y = ค่าตัวแปร x,ค่าตัวแปร y - ค่าตัวแปรอาเรย์ตามช่อง b[i] ยาวในแนวแกน x,y = 20,ค่าตัวแปรอาเรย์ b[i]
     fill(205,0,216); //ใส่สีชมพูออกม่วง โดยกำหนดค่า RGB ให้คำสั่งต่อไป
     text(region[i],x-15,y+15);
   /* คำสั่ง แสดงผลเป็น ตัวอักษรหรือข้อความ โดยให้แสดงผลคือ
    ชื่อภาคตามช่องอาเรย์ region[i] นั้น,
    ตำแหน่งเริ่มต้นแกน x ที่ ด้านซ้ายจากค่า x - 15 หน่วย ,
    ตำแหน่งเริ่มต้นแกน y ที่ ด้านล่างของ y + 15 หน่วย */
     text(b[i],x,y-b[i]-10);
    /* คำสั่ง แสดงผลเป็น ตัวอักษรหรือข้อความ โดยให้แสดงผลคือ
    ชื่อภาคตามช่องอาเรย์ region[i] นั้น,
    ตำแหน่งเริ่มต้นแกน x ที่ ด้านซ้ายจากค่า x,
    ตำแหน่งเริ่มต้นแกน y ที่ ด้านล่างของ y - 10 หน่วย - ค่าของช่องในอาเรย์ b นั้น */
     x = x+60; //กำหนดให้ค่า x บวกเพิ่มอีก 60
     i = i+1; //เพิ่มรอบการวนลูป ให้กลับไปพิจารณาเงื่อนไขการวนลูปและเลื่อนช่องแสดงค่าอาเรย์
   }if(i==b.length){ //เงื่อนไข ถ้าค่า i ที่ได้ เท่ากำบจำนวนช่องอาเรย์ให้ทำต่อไปนี้
     fill(252,132,10); //เติมสีส้ม ตามค่า RBG
     text(region[i],x-15,y+15); //แสดงผลของค่า region[i] ที่ค่า i = b.length 
     text(nationwide,x,y-nationwide-10); 
    //ปริ้นท์ค่า nationwide ออกทางหน้าจอ โดยกำหนดตำแหน่งอักษรที่แสดง
     rect(x,y-nationwide,20,nationwide);
    //วาดสี่เหลี่ยมที่มีจุดเริ่มต้นในแนวแกน x,y = ค่าตัวแปร x,ค่าตัวแปร y - ค่าตัวแปร nationwide ยาวในแนวแกน x,y = 20,ค่าตัวแปร nationwide
   }
  fill(242,122,5);
  textFont(createFont("NantatOO1.1.1-48",20)); //กำหนดฟอนต์ตัวอักษรและขนาดอักษร
  text("Percent's people use the phone in Thailand.",50,30);
}


float cal(){ //สร้างฟังก์ชัน cal ที่สามารถส่งกลับค่าที่เป็นเลขทศนิยมได้
   noStroke(); //เรียกใช้ฟังก์ชันไม่มีเส้นขอบ
   fill(255,241,219); //ใส่สีส้อมอ่อนสุดๆ ตามค่า RGB
   rect(20,50,460,220); 
 //วาดสี่เหลี่ยมที่มีจุดเริ่มต้นในแนวแกน x,y = 20,50 ยาวในแนวแกน x,y = 460,220
   fill(255,219,250); //ใส่ชมพูอมอ่อนสุดๆ ตามค่า RGB
   rect(372,65,98,60); //วาดสี่เหลี่ยมที่มีจุดเริ่มต้นในแนวแกน x,y = 372,65 ยาวในแนวแกน x,y = 98,60
   float avg = 0; //ประกาศและกำหนดค่าตัวแปร avg
   float min = b[0]; //ประกาศและกำหนดค่าตัวแปร min เป็นค่าแรกในอาเรย์
   float max = b[0]; //ประกาศและกำหนดค่าตัวแปร max เป็นค่าแรกในอาเรย์
   i = 0; //ให้ค่า i กลับมาที่ 0
   while(i < b.length){ //สร้างลูป ตั้งแต่ 0 ถึงจำนวนช่องอาเรย์ b.length
      if(b[i] <= min){ //เงื่อนไข ถ้า ช่องอาเรย์นั้นๆ มีค่าน้อยกว่าค่า min ให้ค่า min = b[i] นั้น
        min = b[i];
      }if(b[i] >= max){ //เงื่อนไข ถ้า ช่องอาเรย์นั้นๆ มีค่ามากกว่าค่า max ให้ค่า max = b[i] นั้น
        max = b[i];
    }
    avg = avg+b[i]; //ให้ค่า avg = avg+b[i] จะได้ค่ารวมทั้งหมดของ b[i]
    i = i+1; //เพิ่มรอบการวนลูป ให้กลับไปพิจารณาเงื่อนไขการวนลูปและเลื่อนช่องแสดงค่าอาเรย์
   }
   fill(180,96,11); //ใส่สี น้ำตาลให้กำบคำสั่งข้างล่าง
   nationwide = avg/b.length; 
  //กำหนดให้ค่า nationwide เท่ากับผลรวมของค่าอาเรย์และละช่องหารด้วยจำนวนช่อง
   text("min is "+min,375,80); //ปริ้นท์ค่า min ออกทางหน้าจอ โดยกำหนดตำแหน่งอักษรที่แสดง
   text("max is "+max,375,100); //ปริ้นท์ค่า max ออกทางหน้าจอ โดยกำหนดตำแหน่งอักษรที่แสดง
   text("average is "+nationwide,375,120); //ปริ้นท์ค่า average ออกทางหน้าจอ โดยกำหนดตำแหน่งอักษรที่แสดง
   return nationwide; //ส่งกลับค่า nationwide
}