как создать простую круговую диаграмму с invient-диаграммами в vaadin?

последние три часа я пытался создать простую круговую диаграмму с надстройкой invient-charts в vaadin. Я много читал об этом и поместил jquery.js и highcharts.js в файл веб-контента. Я изменил свой XML-файл, чтобы он ссылался на мой сервлет приложения. Но это все еще не работает. Я тоже думаю, что делаю эти вещи неправильно. Теперь это сводит меня с ума. Может ли кто-нибудь предоставить мне простой учебник по созданию круговой диаграммы или любого другого примера диаграммы?


java vaadin
person yns    schedule 18.09.2012    source источник
comment
во-первых, не могли бы вы рассказать нам немного больше? например, какое исключение генерируется или если приложение работает, но графики не отображаются...   -  person Franco    schedule 18.09.2012

Ответы (1)


arrow_upward
1
arrow_downward

Поскольку вы не предоставили много информации, я публикую здесь шаги, которые я предпринял...

Во-первых, я добавляю файлы javascript jquery и highcharts в папку webapp/js.

теперь отредактируйте сервлет вашего приложения (тот, который расширяет AbstractApplicationServlet)... есть метод writeAjaxPageHtmlHeader, где вы должны добавить URL-адрес для двух вышеуказанных js-файлов. это здесь: https://vaadin.com/forum/-/message_boards/view_message/254632#_19_message_254632

я использую maven в своем проекте, поэтому добавьте зависимости (если вы не используете maven, добавьте банки в папки WEB-INF/lib)

позже я перекомпилирую набор виджетов приложения с помощью плагинов gwt:clean, vaadin:update-widgetset и gwt-compile maven (если не использовать maven, я думаю, что команда Ctrl+6)

наконец, код для добавления диаграммы в компонент может быть таким:

package com.x.y.z;

import java.util.LinkedHashSet;
import java.util.Map;
import com.invient.vaadin.charts.InvientChartsConfig;
import com.x.y.Manager;
import com.x.y.util.ApplicationHelper;

public class SalesChat extends AbstractChart {

    private static final long serialVersionUID = -793793426045107314L;

    public SalesChat(InvientChartsConfig chartConfig) {
        super(chartConfig);
    }

    @Override
    public void build() {

        Manager manager = (Manager)ApplicationHelper.getApplicationContext().getBean("manager");
        Map<String, Integer> sales = manager.weeklySales();

        XYSeries series = new XYSeries("Sales");
        LinkedHashSet<DecimalPoint> points = new LinkedHashSet<DecimalPoint>();

        for( String string : sales.keySet() ){

            DecimalPoint point = new DecimalPoint(series, string, sales.get(string));
            point.setName( string + " " + sales.get(string).toString());
            points.add( point );
        }

        series.setSeriesPoints(points);
        addSeries(series);
        setWidth("279px");
        setHeight("240px");

    }
}

потом...

InvientChartsConfig chartConfig = new InvientChartsConfig();
chartConfig.getTitle().setText("Sales");
chartConfig.getGeneralChartConfig().setType(SeriesType.PIE);

SalesChat chart = new SalesChat(chartConfig);
chart.build();

VerticalLayout layout = new VerticalLayout();
layout.addComponent(chart);
person Franco    schedule 18.09.2012