FusionCharts - Gallery Example - Funnel Chart in JavaScript

Created using FusionCharts Suite XT - www.fusioncharts.com

by FusionCharts

HTML

<script src="https://cdn.fusioncharts.com/fusioncharts/latest/fusioncharts.js"></script>
<script src="https://cdn.fusioncharts.com/fusioncharts/latest/themes/fusioncharts.theme.fusion.js"></script>
<!-- Funnel chart showing conversation of website visits to purchase -->
<div id="chart-container">FusionCharts will render here</div>

JavaScript

FusionCharts.ready(function() {
  var conversionChart = new FusionCharts({
    type: 'funnel',
    renderAt: 'chart-container',
    width: '500',
    height: '400',
    dataFormat: 'json',
    dataSource: {
        "chart": {
            "caption": "Website - Harry's SuperMart",
            "subcaption": "Visit to purchase - Conversion analysis for last year",
            "decimals": "1",
            "isHollow": "1",
            "labelDistance": "15",
            "is2D": "1",
            "plotTooltext": "Success : $percentOfPrevValue",
            "showPercentValues": "1",
            "theme": "fusion"
        },
        "data": [{
                "label": "Unique Website Visits",
                "value": "1460000"
            },
            {
                "label": "Programme Details Section Visits",
                "value": "930000"
            },
            {
                "label": "Attempts to Register",
                "value": "540000"
            },
            {
                "label": "Successful Registrations",
                "value": "210000"
            },
            {
                "label": "Logged In",
                "value": "190000"
            },
            {
                "label": "Purchased on Introductory Offers",
                "value": "120000"
            }
        ]
    }
}).render();
});