gsp.bi.stage.requireLibraries(function(gvc, dc, d3, cf) {
    gsp.bi.stage.findStage(null, function(stage) {
        var stageModel = stage.stageModel();


        var element = document.createElement("div");
        var dcWidget = dc.someWidget(element); /* create custom DC.js widget code here */

        // create wrapper for dcWidget
        var customWidget = gvc.chart.base(dcWidget);

        // configure grouping with key property
        customWidget.group(function(d) {
            return d.key
        });

        // IMPORTANT: all widgets must provide "colors" method even if it does not do something.
        // dataTable.colors = function() {}; // add it if DC widget does not provide one

        // add the widget to the stage and add it to DOM in a callback
        gsp.bi.stage.addWidget({
            descriptor: {
                chartM: {
                    id: "my-custom-widget",
                    name: "My custom widget",
                    title: "Custom Widget",
                    key: stageModel.fields[0].id, // modify
                    values: [stageModel.values[0].id] // modify
                },
                chart: dataTable
            }
        }, function(success) {
            var container = document.querySelector(".my-custom-widget").querySelector(".widget-chart");
            container.innerHTML = "";
            container.classList.add("my-custom-widget-interior");
            container.appendChild(element);

        }, function(error) {
            console.error(error);
        });

    });
});