Gauges for ESP devices

@ve3cga

Is this the sort of thing you are writing about?

https://randomnerdtutorials.com/esp32-web-server-gauges/

@robotbuilder 

Amazing!

As if "Made to order ..."

Nice find.

@robotbuilder Perfect, exactly what he was looking for.

@robotbuilder hi, I have been using their gauges for some time now - amazing site and info

The problem is that the canvas-gauge after calling up the esp32 webpage, the gauge will move about 1/2 way up and 1/2 way to the left. which positions it 1/2 off the card

I looked on the site for the the jscript:

 http://cdn.rawgit.com/Mikhus/canvas-gauges/gh-pages/download/2.1.7/all/gauge.min.js 

and there are reports of this happening to others plus requests to Mikhus to look into it.

here is what the screen looks like when accessed:

and here is what it ends up as after a short time:

I have downloaded the Mikhus jscript and its part of the spiff files since I need this to work offline

I managed to get google gauges to work and they dont do this shifting, Problem is that google wont let you download their gauge script. We lost our internet last week this gauge disappeared and all that was left was the red square and the info under it.

currently I'm trying to get the SVG gauge to work but for the life of me can't get the variable from the ESP32 into the gauge value. Using console log, I can verify that data from the esp32 is received in the jscript but doesnt get into the gauge value.

Its likely I dont know the correct code method to do this. It doesnt work the same as with canvas-gauges or google gauge.

I can zip up the files and attach them if needed

 final update:

I gave up on others gauge libraries and radial gauges, the linear gauges are simple using svg grafix

I'm using svg gauges, no libraries to download!!

Been working perfectly for over a month now on my pool temp display and the house monitor

 the gauge scales are cut n paste from actual outdoor temperature thermometers

simple to do but some fiddling to get the vertical line min & max to match actual reading on the 

scale grafix, but simple to do, just fiddley to get range, span and grafix centered to match the variable line from low to hi. Once that adjusting is done its copy n paste the degC & degF picture and the vertical line to each temp readout, same for voltage or what ever

The overall code is smaller as well since theres no embedding downloaded libs into the spiff files

I put a writeup on qrz in this forum:  https://forums.qrz.com/index.php?threads/chartgauge-problem.942693/

Those graphics look really nice ! I will have to check this out for future projects. Thanks for sharing the results of your hard work !

These color graphics are really vibrant and nice. Working wirh arduino IoT cloud would be much easier, no? Widgetd in arduino IoT cloud are ugly, but works fine