I needed some web-based gauges for my ArduinOil project frontend and I wanted them to be driven from PHP if possible. I came across Flash Open Gauges (FOG) written by Charles Nichols, which looked really slick and gave plenty of options as to the style of gauge and the methods that you feed it data. I started playing around with the scripts to customize them for my purposes. As I was learning about the feature of dynamically feeding the gauges data via PHP, I started thinking about how easy it would be to make the gauges live. A little tinkering, and voila! This won’t be particularly helpful in any of the projects I have going on at the moment, but I thought it might help someone else, so here’s how you’d make it work:
I recorded a quick demo this morning of the script in action which you can find below. Also, keep in mind that I just threw this together on a side trail to a larger project that I’m currently working on, so there may be some refining that should be done to the code. I just don’t want to spend the time on it now, but if you need this functionality, it might be worth your while to poke at the code and try to improve it. Have fun!
Thanks for the article. I was just looking at Open Gauges and my first attempts at custom code had failed. A few seconds looking at your code and the light dawned. You’ve a nice series of articles which I look forward to reading and it’s nice to chat to another Pachube user too.
Regards
Ken
Nice one. Thanks.
Man you are the best!!! Thank you very much for opening this project. This saved my life. Thank you.
Marcos,
From Brazil.
Hey Marcos…thanks. I hope you get some good use out of the code and concept. I’d be really interested to know how you’re using it once you finish your project.
Dan, you dont mind how long I´ve been searching for something that fits my knows to build my arduino project.
I work with PHP, flash etc…
I was trying to learn C++ or VB justo build one interface like yours.
When I sew that on Flash + PHP… Man that was incredible!!!!
I have asked an Ethernet Shied to try to do something like your example.
Instead of potenciometer I will use an pressure sensor and a LM35, but a need to display that just like you did.
If you want, my e-mail is apzeiro@gmail.com, then I could tell about the project.
Man you are the best!!! Sorry about my english.
Marcos…that’s really awesome man! I’m glad you’re getting some practical use out of the code. I’d be REALLY interested in knowing more about your project, so I’ll shoot you an email in a bit. And I’d love if you could post a link to the finished project as well!
Hi,
I am so glad I came across your site. I found you by doing a search on you-tube. Well I am starting a project that consists of two temperature sensors a PH probe and a couple digital outs for a aquarium controller. I just began the start up of a server to host the guages. I think I have followed your directions, but all I get is a blank black page. I have Ubuntu running with apache2, PHP5, and java6.
Thanks Again,
Scott
It’s hard to say exactly what’s going on, but assuming you didn’t change the source code, I would check permissions on all of the files/folders. Also, ensure you have the FOG source downloaded and extracted into a subfolder of your index.html called “flash”. Hope that helps!
Hi, Again I have made changes to the permissions and got a bit more working but the data is not making the bridge. If I go to index the meter shows up no data. If I go directly to the arduino_fetch_output.php I get this output #!/usr/bin/php -q &value=1023&range=1024 It looks like it,s reading the arduino. So I think I am close. Thanks again, Scott
Sorry for all the posts, but I was able to get it going on a windows box. This is great! Thanks again
No problem, I’m just glad you got it up and running! Good job!
Is it possible to use multiple gauges on one page?
I am having trouble. I can see the value of Pin five when I go staight to my Arduino’s IP address and port 80. However, the Flash Gauge doesn’t work. Needle pegged at zero. I noticed in your sample video, there are data values for the red, yellow green zones on the meter, in my site there is just 0.0
Dan, mu ethernetshield has arrived. I tryed to folow your tutorial but it didn´t work.
However I folowed another example and worked fine.
Is there any kind of test that could I do?
Here is the code that worked:
Upload to arduino and browse the indicated IP (you can change to fit better your network)
// you can change this line if you want to serve, for example, XML or some other content type
#define HTTP_HEADER “HTTP/1.0 200 OKrnServer: arduinornContent-Type: text/htmlrnrn”
void setup(){
setupEthernet(“010.000.000.011″, 80); // Arduino IP 10.0.0.11
}
void loop(){
//put your code here
// then check for requests, and if so, serve the webpage
if (ethernetRequest()){
writeHeader();
writePage(“Seja bem vindo ao Arduino!”);
writePage(“Valores analogicos que estou lendo:”);
for (int i = 0; i < 6; i++)
{
writePage("”);
writePage(analogRead(i));
}
servePage();
}
}
Here is your example. See if do I have to make some change, please. The IP I need to use is 10.0.0.11 (255.0.0.0):
// Arduino_live_gauge
// =======================================================================================
// This sketch takes puts the information on A5 out through the ethernet connection when
// there is a connection on port 23. There is a corresponding script that connects, then
// displays the information in a gauge via PHP and Open Flash Gauges
// (http://www.digitaldarknet.net/flash/).
//
// Written By: Dan Wagoner – http://www.nerdybynature.com
// Date: 07/26/2009
#include
#include
#include
//LED de teste
int LED = 7;
// define ethernet properties
byte mac[] = { 0xDE, 0xAD, 0xBE, 0xEF, 0xFE, 0xED };
//byte ip[] = { 192, 168, 1, 10 };
byte ip[] = { 10, 0, 0, 11 }; //ip que eu escolhi
byte gateway[] = { 10, 0, 0, 138}; //gateway
//byte subnet[] = { 255, 255, 255, 0};
byte subnet[] = { 255, 0, 0, 0}; //mascara da minha rede
Server server = Server(23); // listen on port 23
//Server server = Server(80); // listen on port 80
void setup()
{
pinMode( 5, INPUT );
pinMode( LED, OUTPUT); //pino do LED
Serial.begin(9600);
Ethernet.begin(mac, ip, gateway, subnet);
server.begin();
delay(1000);
}
void loop(){
//pisca o led pra testar se o código está ok
digitalWrite (LED, HIGH);
delay(1000);
digitalWrite (LED, LOW);
delay(1000);
Client client = server.available();
if (client){
client.print(analogRead(5));
Serial.println(analogRead(5));
delay(200);
client.stop();
Ethernet.begin(mac, ip, gateway, subnet);
}
}
Marcos,
I noticed you changed the port that the Arduino server is listening on. If you would rather have it listen on port 23 instead of 80, you will need to make a change to the PHP code so it looks for the arduino on the correct port. Hopefully that helps!
Dan
Hi,
Been looking at your Arduino flash gauge examples and it has inspired me to create a temperature varient of your code. How does the flash update live time as my gauge doesn’t update
I know this is an old post, but hopefully you are able to guide me a little
The “arduino_fetch_data.php” file does the heavy lifting of pulling the information from the arduino and passes the information to the flash script. It’s been a while since I’ve looked at the source, but if you’re still having trouble, send me the symptoms and I would be happy to help.
Many thanks Dan, appriciate any input. Do you have an email address we can perhaps chat on or messenger ?
Basically it reads the value from the Arduino, but unless I call the php manually and hit F5, the value is not updated on the flash object. Where it appears on your demo the flash object is constantly updated.
Thanks again.