An SVG 3D Bar chart

A blue Bar chart which uses tooltips. It uses some custom code to prepare the tooltips and the tooltip event to apply a colored border to it.

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: 550px; height: 300px" id="chart-container"></div>
This is the code that generates the chart:
<script>
    data     = [4,8,6,1,2,3,4];
    tooltips = RGraph.SVG.arrayLinearize(data);

    tooltips.forEach(function (v,k,arr)
    {
        arr[k] = 'Result: {1},000m'.format(
            arr[k]
        );
    });

    var bar = new RGraph.SVG.Bar({
        id: 'chart-container',
        data: data,
        options: {
            variant: '3d',
            colorsStroke: 'rgba(0,0,0,)',
            colors: ['Gradient(#aaf:#bbf)'],
            marginTop: 30,
            marginLeft: 45,
            marginBottom: 80,
            xaxisLabels: ['Mon','Tue','Wed','Thu','Fri','Sat','Sun'],
            xaxisColor: '#ddd',
            xaxisTickmarks: false,
            yaxisColor: '#ddd',
            yaxisScaleUnitsPost: 'km',
            yaxisTickmarks: false,
            tooltips: tooltips,
            shadow: false,
            backgroundGridColor: '#eee',
            title: 'Distance run in the past week',
            hmargin: 15
        }
    }).wave().on('tooltip', function (obj)
    {
        var tooltip = RGraph.SVG.REG.get('tooltip'),
            idx     = RGraph.SVG.sequentialIndexToGrouped(tooltip.__index__, obj.data),
            colors  = ['red','#0f0','blue'];

        tooltip.style.borderColor = 'blue';
    });

    // Some CSS that gets used for the tooltips
    RGraph.SVG.tooltips.style.fontSize        = '105%';
    RGraph.SVG.tooltips.style.fontFamily      = 'Arial, sans-serif';
    RGraph.SVG.tooltips.style.fontWeight      = 'bold';
    RGraph.SVG.tooltips.style.paddingRight    = '10px';
    RGraph.SVG.tooltips.style.paddingLeft     = '10px';
    RGraph.SVG.tooltips.style.paddingTop      = '10px';
    RGraph.SVG.tooltips.style.paddingBottom   = '10px';
    RGraph.SVG.tooltips.style.textAlign       = 'center';
    RGraph.SVG.tooltips.style.backgroundColor = 'white';
    RGraph.SVG.tooltips.style.border          = '3px black solid';
    RGraph.SVG.tooltips.style.borderWidth     = '3px';
</script>