# A Pie chart with the key in gutter mode

This goes in the documents header:

    <script src="RGraph.common.core.js"></script>
    <script src="RGraph.common.key.js"></script>
    <script src="RGraph.common.dynamic.js"></script>
    <script src="RGraph.drawing.rect.js"></script>
    <script src="RGraph.pie.js"></script>

Put this where you want the chart to show up:

    <canvas id="cvs" width="450" height="350" style="border: 1px solid gray">
        [No canvas support]
    </canvas>

This is the code that generates the chart:

    <script>
        window.onload = function ()
        {
            var pie = new RGraph.Pie({
                id: 'cvs',
                data: [45,43,23,68,84,41],
                options: {
                    title: 'A pie chart showing gutter mode',
                    titleY: 30,
                    key: ['John','Fred','Lou','Pete','Kevin','Gary'],
                    keyColors: ['red','#ccc','#0f0','#00f','pink','yellow'],
                    keyInteractive: true,
                    keyRounded: false,
                    keyPosition: 'gutter',
                    keyPositionY: 315,
                    radius: 125,
                    linewidth: 1
                }
            }).draw();
        };
    </script>

« Back