This is a demonstration of a chart that has been made to look like the
"Who wants to be a millionaire" Bar chart (for the "Ask the audience"
question results). It uses a CSS gradient for the background and adds
custom text to the chart using the RGraph API (though it doesn't use the
draw event because SVG doesn't need to). It uses the
coordinates that are stored on the chart object for this (the obj.coords
variable).
There's a canvas version of this chart here.
This goes in the documents header:<script src="RGraph.svg.common.core.js"></script> <script src="RGraph.svg.bar.js"></script>, Put this where you want the chart to show up:
<div style="width: 300px; height: 250px; border-radius: 6px; background-image: linear-gradient(45deg, black, blue, black); box-shadow: #aaa 2px 2px 2px" id="cc"></div>This is the code that generates the chart: