An SVG chart using CSS3 animations


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 id="chart-container" style="600px; height: 250px; display: inline-block"></div>
This is the code that generates the chart:
<script>
    var bar = new RGraph.SVG.Bar({
        id: 'chart-container',
        data: [4,5,3,8,4,9,6],
        options: {
            xaxisLabels: ['Mon','Tue','Wed','Thur','Fri','Sat','Sun']
        }
    }).draw();


    // The swap function
    function selectAnimation(effect)
    {
        var div = document.getElementById('chart-container');

        div.className = '';
        div.className = 'animated ' + effect;
    }
</script>