Как добавить d3 (javascript) в приложение vaadin?

Добрый вечер, ребята,

в настоящее время я пытаюсь добавить функциональность визуализации d3 в мое приложение vaadin. Если вы не знаете, что Д3, вот ссылка: http://d3js.org/

но я застрял с некоторыми проблемами:

  • Как я могу добавить "d3.П2.JS " javascript файл/библиотека, что необходимо для разработки С d3? Я попытался добавить его в собственную тему (WebContent/VAADIN/themes/myOwnTheme/..), но через обновление в eclipse я получаю сообщение: "ошибки произошли во время сборки. Ошибки запуска построителя "JavaScript Validator" в проекте "VaadinD3Testproject". 14". Я думаю, это потому, что js-файл может быть слишком большим С около 8000 строк ? Я читал о том, как каким-то образом добавить файл в интернет.в XML? Есть ли способ?

  • Как я могу добавить код javascript в мое приложение vaadin? После моих исследований я знаю, что есть варианты использования:

    • getMainWindow ().executeJavaScript ("alert ('foo');")

    или

    • Label test = новая метка ("переместите мышь сюда..",Этикетка.CONTENT_XHTML);

--> существуют ли другие способы интеграции кода javascript ?

может ли кто-нибудь помочь мне с своего рода "пошаговым" объяснением, как решить оба пути? Помощь действительно была бы оценена здесь, так как я не так опытен с этот.

------- обновление -----------

Как я могу добавить "d3.П2.JS " javascript файл/библиотека, что необходимо для разработки С d3? Я попытался добавить его в собственную тему (WebContent / VAADIN / темы / myOwnTheme/..), но через освежать я получаю сообщение: "произошли ошибки во время сборки. Ошибки при работе построитель "JavaScript Validator" в проекте "VaadinD3Testproject". 14". Я думаю, это потому, что js-файл может быть слишком большим Восемь тысяч линии ? Я читал о том, как каким-то образом добавить файл в интернет.в XML? Быть там способ?

я исправил эту ошибку, это была проблема с моим eclipse и встроенным JavaScript-валидатором. Теперь я смог загрузить js-файл в свое приложение, перезаписав класс ajax собственным сервлетом, как это было описано здесь в нескольких сообщениях.

теперь я попробовал несколько способов:

  • getMainWindow.executeJavaScript() не работает таким образом, я мог бы использовать d3, как-то, как только я хочу добавить код d3, например "d3.выберите("тело") .append ("svg");", он просто не выполняет его (независимо от того, делаю ли я теги вокруг или нет, но я заметил, что код в тегах не будет выполнен)

  • Я попытался использовать CustimLayout, как это было показано в некоторых примерах этого форума, но это снова, как описано выше. Когда я проверяю исходный код веб-сайтов, мой код просто отсутствует или анализируется вон!--1-->

  • метки больше не будут работать, независимо от того, если XHTML или RAW-режим, происходит исключение

  • перезапись другого метода сервлета, который вызывается при построении bodys при запуске сервера, в результате я получил сообщение об ошибке, что vaadin больше не может загрузить widgetset по умолчанию.

Итак, что осталось? Действительно ли нет способа интегрировать d3 с vaadin? Неужели никто никогда не пробовал? Я тоже много читаю вчера о предстоящем vaadin 7. Но будет ли это даже вариант использовать альфа-версию, из которой я понятия не имею о ее стабильности (я думаю, поэтому она называется alpha )

Спасибо за каждую мысль, которую Вы делитесь со мной

2 ответов


самый полный способ включить существующую библиотеку javascript-это разработать свой собственный пользовательский компонент. Это is немного больше, чем "нормальная" разработка Vaadin, но даст вам полный доступ к методам и объектам javascript (через GWT) в браузере.

чтобы просто включить внешний файл javascript на страницу, расширить класс ApplicationServlet и переопределить writeAjaxPageHtmlVaadinScripts метод. Вот выдержка из текущего проекта это включает некоторые внешние библиотеки.

затем вы можете использовать эти библиотеки, используя ' getMainWindow ().executeJavaScript (бла)'

тем не менее, из того, что я вижу в d3, имеет смысл разработать пользовательский компонент Vaadin. Вы можете найти более разумным, чтобы увидеть, есть ли существующий виджет GWT d3, а затем попытаться использовать его в компоненте Vaadin.

@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("<script type=\"text/javascript\">\n");
  page.write("//<![CDATA[\n");
  page.write("document.write(\"<script language='javascript' src='" + appUrl + "/VAADIN/scripts/jquery/jquery-1.4.4.min.js'><\/script>\");\n");
  page.write("document.write(\"<script language='javascript' src='" + appUrl + "/VAADIN/scripts/highcharts/highcharts.js'><\/script>\");\n");
  page.write("document.write(\"<script language='javascript' src='" + appUrl + "/VAADIN/scripts/highcharts/modules/exporting.js'><\/script>\");\n");
  page.write("//]]>\n</script>\n");
  super.writeAjaxPageHtmlVaadinScripts(window, themeName, application,
      page, appUrl, themeUri, appId, request);
}

Я знаю, что слишком поздно, но я начал с интеграции D3js и Vaadin . У меня есть кое-какие ресурсы . Это может помочь тому, кто на этом пути Во-первых, Лучшая книга для Vaadin-это Книги Фреймворк Vaadin эта книга поможет вам получить полное знание фреймворк Vaadin также было рекомендовано для сертификации фреймворк Vaadin

Нажмите здесь, чтобы загрузить Книги Фреймворк Vaadin

1) Freecode Диаграммы И D3 Обертка

2) интеграция D3 с Vaadin

Если вы получите какую-либо ошибку в этом уроке, попробуйте сослаться на эту ссылку --> форум фреймворк Vaadin

3)прямое использование D3 libraray