Mithat Konar (the wiki)

User Tools

Site Tools

You are here: Mithat Konar (the wiki) » Processing stuff » How to make a thermometer
processing:thermometer_example

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revisionPrevious revision
Next revision		Previous revision
processing:thermometer_example [2013/08/04 02:44] – mithatprocessing:thermometer_example [2013/08/04 03:55] (current) – [How to make a thermometer] mithat
Line 1: Line 1:
-====== Thermometer example ======+====== How to make a thermometer ======
  
 {{:processing:processing_thermometer.png}} {{:processing:processing_thermometer.png}}
Line 12: Line 12:
 You won't find much description below. I may add some later, but my intent here is just to do a structured code dump. You won't find much description below. I may add some later, but my intent here is just to do a structured code dump.
  
-<WRAP center round important 60%> +<WRAP center round info 60%> 
-Because applet support has been removed in Processing 2 and Processing.js doesn't allow downloading arbitrary files, linking to live examples that work in the browser from this page is not possible.+Because applet support has been removed in [[http://processing.org/|Processing 2]] and [[http://processingjs.org/|Processing.js]] doesn't allow downloading arbitrary files, linking to live examples that work in the browser from this page is not possible.
 </WRAP> </WRAP>
  
 ===== Getting files from the Internet ===== ===== Getting files from the Internet =====
 +{{:processing:processing_get_internet_page.png?nolink&480|}}
 +
 The built-in function ''loadStrings'' will load local files or URLs. The built-in function ''loadStrings'' will load local files or URLs.
  
Line 93: Line 95:
  
 ===== Scraping XML for data ===== ===== Scraping XML for data =====
 +{{:processing:processing_get_xml_page.png?nolink&480|}}
  
 Grabbing selected data from an XML source is easy with Processing's ''XML'' class. In this example, we load an RSS feed (which is XML) and extract some data from it. Grabbing selected data from an XML source is easy with Processing's ''XML'' class. In this example, we load an RSS feed (which is XML) and extract some data from it.
Line 159: Line 162:
  
 ===== A digital thermometer ===== ===== A digital thermometer =====
 +
 +{{:processing:processing_thermometer_digital.png?nolink|}}
  
 Fonts are graphics in Processing. To get the following to work, you'll need to create the *.vlw file using the //Tools > Create Font...// menu item. Fonts are graphics in Processing. To get the following to work, you'll need to create the *.vlw file using the //Tools > Create Font...// menu item.
Line 297: Line 302:
  
 ===== Adding a graphic meter ===== ===== Adding a graphic meter =====
 +
 +{{:processing:processing_thermometer_meter.png?nolink|}}
  
 Representing quantities graphically. Note also the use of Javadoc-style documentation comments for the functions. Representing quantities graphically. Note also the use of Javadoc-style documentation comments for the functions.
Line 339: Line 346:
          
     background(#296783);     background(#296783);
-    drawDigitalTemp(condition.getInt(ATTRIBUTE_CONDITION_TEMPERATURE), +     
-        units.getString(ATTRIBUTE_UNIT_TEMPERATURE), width/2, height/2); +    int temperature = condition.getInt(ATTRIBUTE_CONDITION_TEMPERATURE); 
-    drawMeter(70, -40, 120, 10, height-2*BORDER, width-10-BORDER, BORDER);+    drawDigitalTemp(temperature, units.getString(ATTRIBUTE_UNIT_TEMPERATURE), 
 +                    width/2, height/2); 
 +    drawMeter(temperature, -40, 120, 10, height-2*BORDER, width-10-BORDER, BORDER);
   }   }
   catch (Exception e) {   catch (Exception e) {
Line 358: Line 367:
  
 /** /**
- * Render the temperature numerically at a given canvas location.+ * Render a temperature numerically at a given canvas location.
  *  *
  * @param temperature the temperature to be drawn (int)  * @param temperature the temperature to be drawn (int)
Line 378: Line 387:
  
 /** /**
- * Render the temperature graphically.+ * Render a value on a vertical meter.
  *  *
  * @param val      the value to be drawn (float)  * @param val      the value to be drawn (float)
Line 409: Line 418:
  
 ===== Updating the data ===== ===== Updating the data =====
-Don't sleep. Poll instead.+Don't sleep. Poll instead. The following updates the temperature display every minute.
  
 <file java thermometer_update.pde> <file java thermometer_update.pde>
Line 416: Line 425:
  * as well as numerically; updates periodically.  * as well as numerically; updates periodically.
  *   * 
- * Copyright (C) 2012 Mithat Konar+ * Copyright (C) 2012-2013 Mithat Konar
  */  */
  
-// Change the following to get the desired location and scale. +// Constants: 
-// See http://developer.yahoo.com/weather/+// change the URL to get the desired location and units 
 +// (see http://developer.yahoo.com/weather/).
 final String URL = "http://weather.yahooapis.com/forecastrss?w=12781882&u=f"; final String URL = "http://weather.yahooapis.com/forecastrss?w=12781882&u=f";
  
-// These should only need changing if Yahoo! changes the RSS feed structure. +// path in XML data to current conditions: 
-final String CHILD_CONDITION="channel/item/yweather:condition";+final String ELEMENT_CONDITION="channel/item/yweather:condition"; 
 + 
 +// attribute name in element above for current temperature:
 final String ATTRIBUTE_CONDITION_TEMPERATURE = "temp"; final String ATTRIBUTE_CONDITION_TEMPERATURE = "temp";
-final String CHILD_UNITS = "channel/yweather:units";+ 
 +// path in XML data to element that holds units of measurement: 
 +final String ELEMENT_UNITS = "channel/yweather:units"; 
 + 
 +// attribute name in element above that holds units for temperature:
 final String ATTRIBUTE_UNIT_TEMPERATURE = "temperature"; final String ATTRIBUTE_UNIT_TEMPERATURE = "temperature";
  
 +// misc.
 final int BORDER=10; final int BORDER=10;
  
-int oldMinute;+// Global variables: 
 +int oldMinute;  // used to keep track of time last update was made.
  
 +// Functions:
 void setup() { void setup() {
   size(200, 100);   size(200, 100);
   smooth();    smooth(); 
 +  background(#296783); 
   oldMinute = minute();   oldMinute = minute();
-  background(#296783); 
   updateTemp();   updateTemp();
 } }
  
 void draw() { void draw() {
-  // updateTemp every minute.+  // updateTemp every minute
   int currentMinute = minute();   int currentMinute = minute();
-  if (oldMinute != currentMinute) +  if (oldMinute != currentMinute) {
-  {+
     updateTemp();     updateTemp();
     oldMinute = currentMinute;     oldMinute = currentMinute;
Line 451: Line 469:
 } }
  
 +/**
 + * Update the display of the current temperature.
 + *
 + * @return void
 + */
 void updateTemp() { void updateTemp() {
   try {   try {
-    println("updateTemp() called at "+ hour()+":"+minute()+":"+second()); +    XML weather = loadXML(URL);  // instantiate an XML object from URL 
-    background(#ffff00); +    XML condition = weather.getChild(ELEMENT_CONDITION);  // pull current cond. 
-    XMLElement weather = new XMLElement(this, URL); +    XML units = weather.getChild(ELEMENT_UNITS);  // pull units data 
-    XMLElement condition = weather.getChild(CHILD_CONDITION); +
-    XMLElement units = weather.getChild(CHILD_UNITS);+
     background(#296783);     background(#296783);
-    drawDigitalTemp(condition.getInt(ATTRIBUTE_CONDITION_TEMPERATURE),  +    int temperature = condition.getInt(ATTRIBUTE_CONDITION_TEMPERATURE); 
-        units.getString(ATTRIBUTE_UNIT_TEMPERATURE), width/2, height/2); +    drawDigitalTemp(temperature, units.getString(ATTRIBUTE_UNIT_TEMPERATURE), 
-    drawMeter(70, -40, 120, 10, height-2*BORDER, width-10-BORDER, BORDER);+                    width/2, height/2); 
 +    drawMeter(temperature, -40, 120, 10, height-2*BORDER, width-10-BORDER, BORDER); 
 + 
 +    // uncomment println below for debugging.  
 +    // println("updateTemp() called at " + hour() + ":" + minute() + ":" + second() +  
 +    //         ". " + condition.getInt(ATTRIBUTE_CONDITION_TEMPERATURE) + " degrees.");
   }   }
   catch (Exception e) {   catch (Exception e) {
     println("Problem loading " + URL);     println("Problem loading " + URL);
     println(e);     println(e);
-    +
     // Turn the canvas red with a big 'X' in it to indicate error.     // Turn the canvas red with a big 'X' in it to indicate error.
     background(#ff0000);     background(#ff0000);
Line 475: Line 502:
 } }
  
-void drawDigitalTemp(int temperature, String units, int x, int y) +/** 
-/* + * Render the temperature numerically at a given canvas location. 
- * Print the temperature and units to the canvas centered around (x,y).+ * 
 + * @param temperature the temperature to be drawn (int) 
 + * @param units       the units of measure used for temperatre (String) 
 + * @param x           the horizontal location of the display (int) 
 + * @param y           the vertical location of the display (int) 
 + * 
 + * @return void
  */  */
 +void drawDigitalTemp(int temperature, String units, int x, int y)
 { {
   PFont font;   PFont font;
   font = loadFont("Monospaced.bold-48.vlw");    font = loadFont("Monospaced.bold-48.vlw"); 
-  fill(#ffffff); 
   textFont(font, 48);   textFont(font, 48);
   textAlign(CENTER, CENTER);   textAlign(CENTER, CENTER);
 +  fill(#ffffff);
   text(temperature + "\u00b0" + units, x, y);   text(temperature + "\u00b0" + units, x, y);
 } }
  
-void drawMeter(float val, float minimum, float maximum, int w, int h, int x, int y) +/** 
-/*  + * Render a value on a vertical meter. 
- * Represent a value in a vertical meter. Parameters: + * 
- *   val: the value to be represented + * @param val      the value to be drawn (float) 
- *   minimum: val's value that corresponds to no deflection. + * @param minimum  val's value that corresponds to no deflection (float) 
- *   minimum: val's value that corresponds to maximum deflection. + * @param minimum  val's value that corresponds to maximum deflection (float) 
- *   w: the width of the meter + * @param w        the width of the meter (int) 
- *   h: the height of the meter + * @param h        the height of the meter (int) 
- *   x, y: the location of the meter+ * @param x        the horizontal location of the meter (int) 
 + * @param y        the vertical location of the meter (int) 
 + * 
 + * @return void
  */  */
 +void drawMeter(float val, float minimum, float maximum, int w, int h, int x, int y)
 { {
   // calculate height of indicator in pixels   // calculate height of indicator in pixels
processing/thermometer_example.1375584242.txt.gz · Last modified: 2013/08/04 02:44 by mithat
Donate Powered by PHP Valid HTML5 Valid CSS Driven by DokuWiki