waveform display in browser

I'm designing a tachometer box and it will have a web page interface as one way to talk to it. I thought it would be cool to include an ADC so we could display waveforms, too. My software guys here are mostly embedded types so we don't know a lot about Javascript and such. I did a little searching and mostly found things for displaying audio envelope cartoons; I want a real oscilloscope-looking thing, so users can see what happens as they change gains and filtering and trigger level settings. Dual trace would be nice, the analog waveform and corresponding comparator outputs.

Has anybody done this? We'd consider getting outside help, either advice or actual coding.

I assume our box will, through some port, deliver HTML, Javascript, and maybe some zipped JS libraries to the browser. And the company logo of course. The browser will send us text strings to parse if the user wants to change parameters or such. We would also deliver blocks of waveform data on request. That's my PHB perspective on things; I'm just the hardware designer.

An easy method for non-programmer types is this:

Comes in various flavors from free to full bore. A "Shazam!" reaction at a client happened when they found their company logo integrated into the control screen which was no more effort than copy-paste.

One approach is a CGI script that runs gnuplot under the covers. IIRC quite a few folks do that. (I'm a static HTML guy myself.)

Cheers

Phil Hobbs

Isn't there an actual oscilloscope display package under Linux? It should be fairly straightforward to drive that from an internet connection. I guess requiring the customer to installing such a package is not preferred.

He is after a browser plugin - something like VNC, the way I do it on our spectrometers (I do not use a plugin but I could if I wanted to).

However this implies a fullblown RFB connection to a stand alone system having its display and GUI locally (within his oscilloscope thing) which is far from being trivial.

Dimiter

------------------------------------------------------ Dimiter Popoff, TGI

------------------------------------------------------

I've used a JS graphing package called "flot" that could probably be modified to display scrolling or static waveforms. I think it's based on HTML5 canvas and/or SVG DOM. I made some small tweaks and found it to be well written.

Yeah, I get what he is after, but there is more than one way to skin a cat. Another would be to allow a remote desktop connection. Then no software of any kind is needed for the client other than the RDP app. Still more work on the client end but installing a canned app isn't that hard. Browser based apps can be work to get running on multiple browsers and keep running with browser updates. A friend is in that line of work and there is *soooooo* much work keeping all the different versions working.

Actually, I don't want a plugin, just a way for the browser to display a waveform, using some javascript. We can store any reasonable zipped javascript libraries in our gadget and deliver them to the browser.

The tach box will have no display or GUI, and in fact no official OS.

I am not sure I have seen that done for live graphics - then scaling, perhaps autoranging etc., even if doable it would be a massive pain to support with all browsers as they keep on evolving. Your best bet might be to produce locally a .gif (or .png or whatever) bitmap, maintain it live and persuade the browser to refresh it regularly. Don't know how the latter is to be done though.

Not having a display is not a problem, some of our spectrometers do not have one, they just maintain the display bitmap in system memory - which is viewed via RFB (VNC)(RDP which Rick suggested is very similar, same thing really but over a non-public protocol). Not having an OS - nor a VNC server nor the image to be displayed - obviously makes this impractical in your case.

Dimiter

------------------------------------------------------ Dimiter Popoff, TGI

------------------------------------------------------

We could do that in the FPGA! If nobody murders me for suggesting it.

Lasse also suggested flot. That looks promising.

Wanna help?

If a simple GIF image is good enough, I'm pretty sure you can imbed that in an HTML page that will auto refresh periodically. How often does it need to update?

I don't know how to persuade a browser to auto-refresh, but GIF format uses run-length limiting for compression. That means that line drawings of few colors tend to be very small -- you'll use up way more bits on text than on the pictures.

There is some simple HTML thing that makes a page reload periodically. That's apparently easy to do.

A BMP would be easy to make inside the FPGA, but that would be slow to load. Maybe the ARM could make a GIF or PNG. That would avoid all the javascript nonsense. We'd just have to find the code somewhere.

This bmp is 556K bytes.

That wouldn't be really terrible to send once a second or so over 100 MBPS Ethernet. But my FPGA doesn't have enough RAM.

Bumpfiles are simple, so that's a win. I usually generate those in my code, then (in a script) call ImageMagick's 'convert' to make them into .jpg or .png or whatever.

Cheers

Phil [system("convert foo.bmp foo.png") covers a multitude of sins]Hobbs

Java might be a tad slow. SVG might be better. But thers a bunch of API's out there, search javascript stripcharts.

Cheers

Yeah, svg looks promising. If I let the FPGA do the acquisition (some clever auto-trigger-oscilloscope algorithm based on the ADC data?) and buffer maybe 250 or so points per waveform, the ARM could read that data and build a not-absurdly long svg/html thing to send back, once a second maybe.

Might be worth you talking to Bob Masta (sp?) who does Daqarta.

Not sure if any of his stuff is in Java though.

AJAX, works ok. Theres a difference in implemntation between browsers tho. I used that to send indicator/display information. Be willing to support future browsers with a firmware update.

Cheers