Getting Arduino data to a web Page

Being new to Arduino I was a bit overwhelmed by the different ways to do things. So this is what I came up with!

I am using an Arduino UNO R3 clone but the connections I believe are the same for most Arduino’s or can be easily modified for your particular model. This project is the beginning of a UROV that I am building from the ground up and this is my first attempt to work with Arduino. I do not want to turn my UNO into a webserver if I can avoid it because of the shortage of memory and this project is just a few of the sensors that I want to use for my project. I am going to start out by using the premise that my project will eventually use RS485 to communicate serially from my UNO to the PC via a tether.

Getting Arduino data to a web Page

Based on this I am going to base all my efforts on Serially retrieving the data and processing it through comma separated variables (CSV). As I am just learning to use the Arduino I will start by figuring out how to retrieve data from a sensor and then start adding motors and other gadgets but this is my first step. I am going to start with the BMP 180 with the HMC5883L magnetometer for my project. I have included the sample code that should be easy to follow and modify for your projects. Like most people starting to use the Arduino it can be a little overwhelming with the amount of information on how to do different things with the Arduino so I fell back on some of the things that I am familiar with PHP, HTML, MySQL but Arduino and Processing is all new to me so some things could have probably been done more efficiently. I will say that knowledge of all of the software is a plus in any case. I am also using WAMP server but you can use any web development platform that includes a MySql database engine and PHP, I have been using WAMP for several years and accustomed to it.

Step 1: Connecting the Hardware

Connect the VCC pin to a 3.3V power source. The V1 of the sensor breakout cannot be used with anything higher than 3.3V so don’t use a 5V supply! V2 of the sensor board has a 3.3V regulator so you can connect it to either 3.3V or 5V if you do not have 3V available.

Connect GND to the ground pin.

Connect the i2c SCL clock pin to your i2c clock pin. On the classic Arduino Uno/Duemilanove/Diecimila/etc this is Analog pin #5

Connect the i2c SDA data pin to your i2c data pin. On the classic Arduino Uno/Duemilanove/Diecimila/etc this is Analog pin #4

Link to wiring diagram:

Software for the BMP085:

Step 2: The Arduino Sketch

The code has been modified for readability and this application. I want the flexibility to use the data for most general applications so I am going to retrieve it with Comma’s following the serial output for each reading. This will allow me to save it to a MySql database, CSV file or .txt file. Doing this will allow me to breakup or separate the serial data in Processing as well as PHP and most other programming and scripting languages very easily. The BMP085 software from Adafruit was used to read the sensor since it was the most complete example I could find and I posted the links above. You will have to import the library in your sketchbook folder. I would also like to note that I wanted my readings in units that I am most familiar with so I modified the code to read in “inHg” of mercury for Pressure, Fahrenheit and Feet. The original code was in Hectopascals, Celsius and Meters.

Sketch file: myurov_database-2.ino





Adafruit_BMP085_Unified bmp = Adafruit_BMP085_Unified(10085);

HMC5883L compass; //The BMP085 has been replaced with the BMP180 but the code still works.

int error = 0;

void displaySensorDetails(void){sensor_t sensor; bmp.getSensor(&sensor);

delay(500);}void setup(void){Serial.begin(9600);

compass = HMC5883L(); // Construct a new HMC5883 compass.


error = compass.SetScale(1.3); // Set the scale of the compass.

if(error != 0) // If there is an error, print it out.

error = compass.SetMeasurementMode(Measurement_Continuous); //Set the measurement mode to Continuous

if(error != 0); // If there is an error, print it out.} void loop(void) {

sensors_event_t event;


if (event.pressure){int pressure = event.pressure; float mercury = 0;

mercury = pressure * 0.029529980164712; // Convert hectopascals to in of mercury.

Serial.print(mercury); // inHg

Serial.print(“,”); // csv seperator

float temperature;


int temp2 = temperature * 1.8000 + 32;


Serial.print(“,”); // csv seperator


int alt = bmp.pressureToAltitude(seaLevelPressure, event.pressure)* 3.2808;

Serial.print(alt); // in Ft

Serial.print(“,”); // csv seperator}else{}delay(1000);

MagnetometerRaw raw = compass.ReadRawAxis();

MagnetometerScaled scaled = compass.ReadScaledAxis();

int MilliGauss_OnThe_XAxis = scaled.XAxis;// (or YAxis, or ZAxis)

float heading = atan2(scaled.YAxis, scaled.XAxis);

float declinationAngle = 0.0526; //0.0457

heading += declinationAngle;

if(heading < 0)

heading += 2*PI;

if(heading > 2*PI)

heading -= 2*PI;

float headingDegrees = heading * 180/M_PI;

Output(raw, scaled, heading, headingDegrees);}void Output(MagnetometerRaw raw, MagnetometerScaled scaled, float heading, float headingDegrees){Serial.print(raw.XAxis); Serial.print(“,”); // csv seperator


Serial.print(“,”); // csv seperator


Serial.print(“,”); // csv seperator


Serial.print(“,”); // csv seperator


Serial.print(“,”); // csv seperator


Serial.print(“,”); // csv seperator


Serial.print(“,”); // csv seperator



For more detail: Getting Arduino data to a web Page

About The Author

Ibrar Ayyub

I am an experienced technical writer with a Master's degree in computer science from BZU Multan University. I have written for various industries, mainly home automation, and engineering. I have a clear and simple writing style and am skilled in using infographics and diagrams. I am a great researcher and is able to present information in a well-organized and logical manner.

Follow Us:
Scroll to Top