gwtdc.jsgquery

Usage of JsniBundle: calling methods on initialized js library


When I initialize d3.js and dc.js using JsniBundle there is no global variable "dc" or "d3" that is created. But I initialze crossfilter in the same way and there is window.crossfilter present.

My question is: what is the best way to call methods from the dc library using JsniBundle? Is using JsUtils.prop(window, "dc") the correct way to get a reference to the library object?

In the method drawBarChartWidget() below, the variable "dc" is null.

public interface D3Bundle extends JsniBundle {
    @LibrarySource("d3.js")
    public void initD3();
}

public interface CrossfilterBundle extends JsniBundle {
    @LibrarySource("crossfilter.js")
    public abstract void initCrossfilter();
}

public abstract static class DCBundle implements JsniBundle {
    @LibrarySource("dc.js")
    public abstract void initDC();

    public void drawBarChart(Widget container, JSONValue data, Properties chartConfig) {
        JavaScriptObject dc = JsUtils.prop(window, "dc");
    }
}

LayoutPanel layoutPanel = new LayoutPanel();
SimplePanel chartPanel = new SimplePanel();

public ChartDemo() {

    D3Bundle d3 = GWT.create(D3Bundle.class);
    CrossfilterBundle crossfilter = GWT.create(CrossfilterBundle.class);
    final DCBundle dc = GWT.create(DCBundle.class);

    d3.initD3();
    crossfilter.initCrossfilter();
    dc.initDC();

Solution

  • Maybe not a direct answer to your question, but if you want to use d3.js with GWT, there is a wrapper that cover most of the main APIs from d3.js : https://github.com/gwtd3/gwt-d3