{% load ajax_helpers %}

<div id="{{ datatable.table_id }}"></div>

<script>

    (function () {
        var cell_data;
        var table = {{ datatable.model_table_setup }};
        table.find_column = django_datatables.PythonTable.prototype.find_column
        var datasets = [];
        for (var i = 0; i < table.initsetup.colOptions.length; i++) {

            datasets[i] = {
                label: table.row_titles[i],
                value: 0,
                backgroundColor: '#' + table.initsetup.colOptions[i].colour,
            };

            for (var j = 0; j < table.data.length; j++) {
                if (table.initsetup.colOptions[i]['render'] != undefined) {
                    render = new django_datatables.column_render(i, table.initsetup.colOptions[i]['render'], table);
                    cell_data = render(table.data[j][i], null, table.data[j]);
                } else {
                    cell_data = table.data[j][i];
                }
                datasets[i].value = cell_data;
            }
        }

    const options = {
        block: {
            dynamicHeight: true,
            minHeight: 100,
        },
    };
    const chart = new D3Funnel('#{{ datatable.table_id }}');
    chart.draw(datasets, options);
    $( window ).resize ( function () {
        chart.draw(datasets, options);
    } );


    })();

</script>