0

在过去的三个小时里，我一直在尝试使用 vaadin 中的 invient-charts 插件创建一个简单的饼图。我已经阅读了很多关于它的内容，并将 jquery.js 和 highcharts.js 放入 webcontent 文件中。我修改了我的 xml 文件以引用我的应用程序 servlet。但它仍然不起作用。我想我也做错了这些事情。它现在让我发疯。有人可以为我提供有关创建饼图或任何其他图表示例的简单教程吗？

4

1 回答 1

1

因为您没有提供太多信息，所以我在这里发布了我采取的步骤...

首先，我将 jquery 和 highcharts javascript 文件添加到 webapp/js 文件夹中

现在，编辑您的应用程序 servlet（扩展 AbstractApplicationServlet 的那个）...有一种方法writeAjaxPageHtmlHeader，您必须为上述两个 js 文件添加 url。就是在这里：https ://vaadin.com/forum/-/message_boards/view_message/254632#_19_message_254632

我在我的项目中使用 maven，所以，添加依赖项（如果您不使用 maven，请将 jars 添加到 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);
于 2012-09-18T16:00:36.750 回答