How to add d3 (javascript) to a vaadin application?

Question

Good evening guys,

I\'m currently trying to add the visualization functionality of d3 to my vaadin application. If you don\'t know what d3 is, here is a quick link: htt

Answer 1

The most comprehensive way to incorporate an existing javascript library is develop your own custom component. This is a little more involved than "normal" Vaadin development, but will give you full access to javascript methods and objects (via GWT) in the browser.

To just include an external javascript file into the page, extend the ApplicationServlet class, and override the writeAjaxPageHtmlVaadinScripts method. Here is an extract from a current project that includes some external libraries.

You can then utilise those libraries using 'getMainWindow().executeJavaScript(blah)'

Still, from what I can see of d3 it makes more sense to develop a custom Vaadin component. You might find it more prudent to see if there is an existing GWT d3 widget, and then try and utilise that in a Vaadin component.

@Override
protected void writeAjaxPageHtmlVaadinScripts(Window window,
                                              String themeName, Application application, BufferedWriter page,
                                              String appUrl, String themeUri, String appId,
                                              HttpServletRequest request) throws ServletException, IOException {
  page.write("\n");
  super.writeAjaxPageHtmlVaadinScripts(window, themeName, application,
      page, appUrl, themeUri, appId, request);
}