From Hamsterworks Wiki!

Jump to: navigation, search

An Arduino project to display the temperature using a Google graph. Uses a Ethernet shield and a TMP36 sensor.

  Temperature Web  Server
 A simple web server that shows the temperature using a TMP36
 connected onthe analog input pin A(0).
 Either using an Arduino Wiznet Ethernet shield and Google charts.

 * Ethernet shield attached to pins 10, 11, 12, 13
 * TMP36 Analog temp sensor on +5V, A(0) and GND.
#include <SPI.h>
#include <Ethernet.h>

// Enter a MAC address and IP address for your controller below.
// The IP address and gateway will be dependent on your local network:
byte mac[] = { 0xDE, 0xAD, 0xBE, 0xEF, 0xFE, 0xED };
byte ip[] = { 10,200,10, 99 };
byte gw[] = { 10,200,10, 254 };

// Initialize the Ethernet server library
// with the IP address and port you want to use 
// (port 80 is default for HTTP):
EthernetServer server(80);

void setup()
  // start the Ethernet connection and the server:
  Ethernet.begin(mac, ip, gw);

void loop()
  // listen for incoming clients
  EthernetClient client = server.available();
  if (client) {
    // an http request ends with a blank line
    boolean currentLineIsBlank = true;
    while (client.connected()) {
      if (client.available()) {
        char c =;
        // if you've gotten to the end of the line (received a newline
        // character) and the line is blank, the http request has ended,
        // so you can send a reply
        if (c == '\n' && currentLineIsBlank) {
          int temp = analogRead(0)*(5.0/1024*1000)-500; //0.75v = 25v, +- 0.01V per degree, 10 bits for 5v sample

          // send a standard http response header
          client.println("HTTP/1.1 200 OK");
          client.println("Content-Type: text/html");

          // output the value of analog input 0 pin
          client.println("  <html>");
          client.println("  <head>");
          client.println("    <meta http-equiv='refresh' content='15'>");
          client.println("    <script type='text/javascript' src=''></script>");
          client.println("    <script type='text/javascript'>");
          client.println("      google.load('visualization', '1', {packages:['gauge']});");
          client.println("      google.setOnLoadCallback(drawChart);");
          client.println("      function drawChart() {");
          client.println("        var data = new google.visualization.DataTable();");
          client.println("        data.addColumn('string', 'Label');");
          client.println("        data.addColumn('number', 'Value');");
          client.println("        data.addRows(3);");
          client.println("        data.setValue(0, 0, 'Temprature');");
          client.print("        data.setValue(0, 1,");   client.print(temp/10); client.print(".");  client.print(temp%10); client.println(");");
          client.println("        var chart = new google.visualization.Gauge(document.getElementById('chart_div'));");
          client.println("        var options = {width: 160, height: 160, redFrom: 30, redTo: 35,");
          client.println("            yellowFrom:28, yellowTo: 33, minorTicks: 5, min: 10, max: 35};");
          client.println("        chart.draw(data, options);");
          client.println("      }");
          client.println("    </script>");
          client.println("  </head>");
          client.println("  <body>");
          client.println("    <div id='chart_div'></div>");
          client.println("  </body>");
        if (c == '\n') {
          // you're starting a new line
          currentLineIsBlank = true;
        else if (c != '\r') {
          // you've gotten a character on the current line
          currentLineIsBlank = false;
    // give the web browser time to receive the data
    // close the connection:

Personal tools