In this post, I demonstrate an interactive gauge using Google Charts library. It can be embedded into a web page as shown here, and connected to user-interface controls such as buttons with some javascript code. You can also just use it without interactivity to showcase metrics on a dashboard as a visualization.
Go ahead and interact with the buttons below.
As you turn ON the engine or go faster, the pointer showing engine temperature moves up by a certain value. The warning (yellow, in this case), and the extreme (red, in this case) ranges are also customizable on the dial, along with the initial value. The pointer will move according to the value specified. As your turn OFF the engine, the pointer moves back to 0. You'll also notice that pressing the ON/Faster when it's at maximum (set at 280 in this example), it won't go farther. Similarly, when the pointer is at 0, and you press Slower, it won't move past 0. This part has to be handled by your own code.
As far as the audio effects, that's not part of the Google Charts, but I'm using HTML5 along with javascript to implement that. Essentially, using the Audio() function to instantiate a new audio object as per HTML5 specificiation and calling its play() method to play an audio file...which audio file, the logic, has to be coded by your own javascript code.
The key lines of the code to create this gauge are shown below:

The callback function you define above with google.charts.setOnLoadCallback() is up to you to implement. But the key there is to know that you can use getValue() and setValue on the gaugeData object. The interactive buttons are declared somewhere in your html body using standard html tags:
<input type="button" value="ON/Faster" onclick="changeTemp(1)" />
<input type="button" value="Slower" onclick="changeTemp(-1)" />
...etc.
The button handler changeTemp() then must be defined and that's the function that's responsible for setting the current gauge value and therefore, moving the pointer. A simple implementation, without boundary checking or audio, can be:
function changeTemp(changeValue) {
gaugeData.setValue(0, 0, gaugeData.getValue(0, 0) + changeValue * 25);
gauge.draw(gaugeData, gaugeOptions);
}
Then overall process is similar to what I've explained in my previous post, so be sure to check it out as it has links to the full documenation on Google Charts.
I hope this tickled your curiousity. Happy charting, and coding!