DC.js - Scatter Plot Not Updating

by Chinna

HTML

<script src="http://nickqizhu.github.io/dc.js/js/d3.js"></script>
<script src="http://nickqizhu.github.io/dc.js/js/dc.js"></script>
<script src="http://nickqizhu.github.io/dc.js/js/crossfilter.js"></script>
<link rel="stylesheet" href="http://nickqizhu.github.io/dc.js/css/dc.css">
<div id="ubc-graph" />

JavaScript

var countries = ["Russia", "USA", "Ukraine"];
var chartExample = {
    initChart: function (data) {
        var chart = dc.barChart("#ubc-graph");

        var ndx = crossfilter(countries),
            countryDimension = ndx.dimension(function (d) {
                return d.country;
            }),
            countryGroup = countryDimension.group().reduceSum(function (d) {
                return d.users;
            });

        chart.width(500)
            .height(400)
            .gap(100)
        .centerBar(true)
            .x(d3.scale.ordinal())
            .yAxisLabel("User Count")
            .renderHorizontalGridLines(true)
            .dimension(countryDimension)
            .group(countryGroup)
            .xUnits(dc.units.ordinal);

        dc.renderAll();
    },
    initData: function () {
        var data = [];

        for (var i = 0; i < 100; i++) {
            var country = countries[Math.floor((Math.random() * countries.length))];
            var userCount = Math.floor(Math.random() * 100);
            data.push({
                country: country,
                users: userCount
            });
        }
        chartExample.initChart(data);
    }
};

chartExample.initData();