I’ve tried just about everything, but still see a ‘blank’ screen. Is this related to the way Vaadin and LifeRay interact? Yes, I’ve copied the js files from the Invient Charts add-on and put them under the VAADIN folder. Porltet, servlet, web.xml, and exact copy of a chart are below! Please help!
This is my main ‘portlet’ class, com.isidorey.vaadin.portlet.ChartPortlet.java
public class ChartPortlet extends Application {
/*
* Portlet
*/
Window main = new Window();
PortletApplicationContext2 ctx;
String portletEmail;
String portletSession;
String WINDOW_NAME = "Charts";
/*
* Logging
*/
private Logger log = Logger.getLogger(ChartPortlet.class.getName());
@Override
public void init() {
/*
* Portlet settings
*/
main.setName(WINDOW_NAME);
main.setSizeFull();
setMainWindow(main);
/*
* Set listener
*/
if (getContext() instanceof PortletApplicationContext2) {
ctx = (PortletApplicationContext2) getContext();
ctx.addPortletListener(this, new ChartPortletListener());
} else {
new VaadinError(getMainWindow(), "Portlet Error",
"Not inited via portal.");
}
}
private class ChartPortletListener implements PortletListener {
@Override
public void handleRenderRequest(RenderRequest request,
RenderResponse response, Window window) {
/*
* Remove all components on refresh
*/
main.removeAllComponents();
/*
* Portal variables
*/
ThemeDisplay themeDisplay = (ThemeDisplay) (request
.getAttribute(WebKeys.THEME_DISPLAY));
/*
* Set globals
*/
portletEmail = themeDisplay.getUser().getEmailAddress();
portletSession = request.getRequestedSessionId();
log.info(portletEmail);
log.info(portletSession);
/*
* Show Chart
*/
LineChart line = new LineChart();
InvientCharts lineChart = line.line();
VerticalLayout verticalLayout = new VerticalLayout();
verticalLayout.setHeight("800px");
verticalLayout.setWidth("600px");
verticalLayout.setMargin(true);
verticalLayout.addComponent(lineChart);
main.addComponent(verticalLayout);
}
@Override
public void handleEventRequest(EventRequest request,
EventResponse response, Window window) {
}
/*
* Unused
*/
@Override
public void handleActionRequest(ActionRequest request,
ActionResponse response, Window window) {
}
@Override
public void handleResourceRequest(ResourceRequest request,
ResourceResponse response, Window window) {
}
}
}
This is my custom servlet class, com.isidorey.vaadin.portlet.CustomServlet.java
public class CustomServlet extends ApplicationServlet {
/*
* Logging
*/
private Logger log = Logger.getLogger(CustomServlet.class.getName());
@Override
protected void writeAjaxPageHtmlVaadinScripts(Window window,
String themeName, Application application, BufferedWriter page,
String appUrl, String themeUri, String appId,
HttpServletRequest request) throws ServletException, IOException {
log.info("THIS IS GETTING EXEC");
page.write("<script language='javascript' src='./VAADIN/jquery/jquery-1.4.4.min.js'></script>\n");
page.write("<script language='javascript' src='./VAADIN/js/highcharts.js'></script>\n");
page.write("<script language='javascript' src='./VAADIN/js/modules/exporting.js'></script>\n");
super.writeAjaxPageHtmlVaadinScripts(window, themeName, application,
page, appUrl, themeUri, appId, request);
}
}
This is my web.xml file:
<?xml version="1.0" encoding="UTF-8"?>
<web-app id="WebApp_ID" version="2.4" xmlns="http://java.sun.com/xml/ns/j2ee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee http://java.sun.com/xml/ns/j2ee/web-app_2_4.xsd">
<display-name>IsidoreyVaadinChartPortlets</display-name>
<context-param>
<description>Vaadin production mode</description>
<param-name>productionMode</param-name>
<param-value>false</param-value>
</context-param>
<servlet>
<servlet-name>Isidoreyvaadingraphingportlets Application</servlet-name>
<servlet-class>com.isidorey.vaadin.portlet.CustomServlet</servlet-class>
<init-param>
<description>Vaadin application class to start</description>
<param-name>application</param-name>
<param-value>com.isidorey.vaadin.portlet.ChartPortlet</param-value>
</init-param>
<init-param>
<param-name>widgetset</param-name>
<param-value>com.isidorey.vaadin.portlet.widgetset.IsidoreyvaadingraphingportletsWidgetset</param-value>
</init-param>
<load-on-startup>1</load-on-startup>
</servlet>
<servlet-mapping>
<servlet-name>Isidoreyvaadingraphingportlets Application</servlet-name>
<url-pattern>/*</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>Isidoreyvaadingraphingportlets Application</servlet-name>
<url-pattern>/VAADIN/*</url-pattern>
</servlet-mapping>
<welcome-file-list>
<welcome-file>index.html</welcome-file>
<welcome-file>index.htm</welcome-file>
<welcome-file>index.jsp</welcome-file>
<welcome-file>default.html</welcome-file>
<welcome-file>default.htm</welcome-file>
<welcome-file>default.jsp</welcome-file>
</welcome-file-list>
<jsp-config>
<taglib>
<taglib-uri>http://java.sun.com/portlet_2_0</taglib-uri>
<taglib-location>
/WEB-INF/tld/liferay-portlet.tld
</taglib-location>
</taglib>
<taglib>
<taglib-uri>http://liferay.com/tld/aui</taglib-uri>
<taglib-location>/WEB-INF/tld/liferay-aui.tld</taglib-location>
</taglib>
</jsp-config>
<session-config>
<session-timeout>90</session-timeout>
</session-config>
</web-app>
This is my implementation of the line chart example
public class LineChart {
public InvientCharts line() {
InvientChartsConfig chartConfig = new InvientChartsConfig();
chartConfig.getGeneralChartConfig().setMargin(new Margin());
chartConfig.getGeneralChartConfig().getMargin().setRight(130);
chartConfig.getGeneralChartConfig().getMargin().setBottom(25);
chartConfig.getTitle().setX(-20);
chartConfig.getTitle().setText("Monthly Average Temperature");
chartConfig.getSubtitle().setText("Source: WorldClimate.com");
chartConfig.getTitle().setX(-20);
CategoryAxis categoryAxis = new CategoryAxis();
categoryAxis.setCategories(Arrays.asList("Jan", "Feb", "Mar", "Apr",
"May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"));
LinkedHashSet<XAxis> xAxesSet = new LinkedHashSet<InvientChartsConfig.XAxis>();
xAxesSet.add(categoryAxis);
chartConfig.setXAxes(xAxesSet);
NumberYAxis numberYAxis = new NumberYAxis();
numberYAxis.setTitle(new AxisTitle("Temperature (°C)"));
NumberPlotLine plotLine = new NumberPlotLine("TempAt0");
plotLine.setValue(new NumberValue(0.0));
plotLine.setWidth(1);
plotLine.setZIndex(1);
plotLine.setColor(new RGB(128, 128, 128));
numberYAxis.addPlotLine(plotLine);
LinkedHashSet<YAxis> yAxesSet = new LinkedHashSet<InvientChartsConfig.YAxis>();
yAxesSet.add(numberYAxis);
chartConfig.setYAxes(yAxesSet);
Legend legend = new Legend();
legend.setLayout(Layout.VERTICAL);
Position legendPos = new Position();
legendPos.setAlign(HorzAlign.RIGHT);
legendPos.setVertAlign(VertAlign.TOP);
legendPos.setX(-10);
legendPos.setY(100);
legend.setPosition(legendPos);
legend.setBorderWidth(0);
chartConfig.setLegend(legend);
// Series data label formatter
LineConfig lineCfg = new LineConfig();
chartConfig.addSeriesConfig(lineCfg);
// Tooltip formatter
chartConfig
.getTooltip()
.setFormatterJsFunc(
"function() { "
+ " return '<b>' + this.series.name + '</b><br/>' + this.x + ': '+ this.y +'°C'"
+ "}");
InvientCharts chart = new InvientCharts(chartConfig);
XYSeries seriesData = new XYSeries("Tokyo");
seriesData.setSeriesPoints(getPoints(seriesData, 7.0, 6.9, 9.5, 14.5,
18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6));
chart.addSeries(seriesData);
seriesData = new XYSeries("New York");
seriesData.setSeriesPoints(getPoints(seriesData, -0.2, 0.8, 5.7, 11.3,
17.0, 22.0, 24.8, 24.1, 20.1, 14.1, 8.6, 2.5));
chart.addSeries(seriesData);
seriesData = new XYSeries("Berlin");
seriesData.setSeriesPoints(getPoints(seriesData, -0.9, 0.6, 3.5, 8.4,
13.5, 17.0, 18.6, 17.9, 14.3, 9.0, 3.9, 1.0));
chart.addSeries(seriesData);
seriesData = new XYSeries("London");
seriesData.setSeriesPoints(getPoints(seriesData, 3.9, 4.2, 5.7, 8.5,
11.9, 15.2, 17.0, 16.6, 14.2, 10.3, 6.6, 4.8));
chart.addSeries(seriesData);
return chart;
}
private static LinkedHashSet<DecimalPoint> getPoints(Series series,
double... values) {
LinkedHashSet<DecimalPoint> points = new LinkedHashSet<DecimalPoint>();
for (double value : values) {
points.add(new DecimalPoint(series, value));
}
return points;
}
}