Fusion Charts intergration with JSF

[srividya_sharma]

Hi

Feels good to hear that the tag library has been useful!

The FusionCharts tag library does not work with FusionMaps. It would take a month or so before the development of Tag library for FusionMaps can begin.

If you can wait, that is good.

In the meantime, if you want to give it a try, I have attached the source code for the FusionCharts tag library here.

Hope you get it working.

Please share the tag library if you succeed.

Thanks.

Srividya

fusionchartstaglibJSF1_2SRC.zip

[Jaimico]

srividya_sharma (7/15/2009)

---

Hi

 

 

 

Feels good to hear that the tag library has been useful!

 

 

 

The FusionChartstag library does not work with FusionMaps. It would take a month or so before the development of Tag library for FusionMaps can begin.

 

 

 

If you can wait, that is good.

 

 

 

In the meantime, if you want to give it a try,I have attachedthe source code for the FusionCharts tag library here.

 

 

 

Hope you get it working.

 

 

 

Please share the tag library if you succeed.

 

 

 

Thanks.

 

 

 

Srividya

 

 

 

Thanks Srividya, I'll start working on that (also will try to fix the bug of the div id) and post my results... em... how can I build the source? just a simple command like javac -jar??

 

 

 

Greetings!!!

[srividya_sharma]

Yes, compiling the source is as simple as that.

What is the bug with div id? Can you please elaborate?

srividya

[Jaimico]

srividya_sharma (7/16/2009)

---

Yes, compiling the source is as simple as that.

 

 

 

What is the bug with div id? Can you please elaborate?

 

 

 

srividya

 

 

 

Jaimico (7/16/2009)

---

Edit: I'm using your taglib in aportlet environment (Liferay + ICEfaces) and it works fine... unless I put two or more portlets on the same page, seems that the div generadted by the taglib doesn't have a composed ID (e.g. portletid:formid:containerid:... etc) but a simple one: "chartDiv". So I end up with many elements with the same ID on page and no matter which portlet I interact with the changes are always made on the first portlet on page.

 

 

 

It's on an edit on my first post XD.

 

 

 

Jaimico

[srividya_sharma]

Hi

Just give a different chartId for each chart.  That should work.

Srividya

[Jaimico]

srividya_sharma (7/16/2009)

---

Hi

 

 

 

Just give a different chartId for each chart. That should work.

 

 

 

Srividya

 

 

 

Good point... didn't think of that XD.

 

 

 

But anyway, that would be easier if the various graphs where on the same portlet, but if they're on different portlets I would have to assign the id dinamically and ensure it's unique (perhaps trying to get the protlet id from the managed bean). Wouldn't be much better if the framework ensures that the id is unique by composing it (like it does with other elements)?

 

 

 

Jaimico

[srividya_sharma]

I am not quite convinced that the tag library should handle it. The ids need to be unique in a page and each tag is unaware of other tags in the page. So, the page that embeds these tags should provide unique ChartId value.

Hope you buy my argument.

Srividya

[Jaimico]

srividya_sharma (7/16/2009)

---

I am not quite convinced that the tag library should handle it. The ids need to be unique in a page and each tag is unaware of other tags in the page. So, the page that embeds these tags should provide unique ChartId value.

 

 

 

Hope you buy my argument.

 

 

 

Srividya

 

 

 

Hello

 

 

 

Well... I'm not quite sure it's the taglib that handles it... maybe it's the portlet bridge.

 

 

 

In my portlet source code I have this:

 

 

 

<ice:form id="form1">

 

 

 

And for the FusionCharts taglib:

 

 

 

<fc:render chartId="chart">

 

 

 

If I place two portlets on page and look at the page source I see that the ids of the forms (of each portlet) are:

 

 

 

_PruebaIcefacesPortlet_WAR_pruebaicefacesfusionchartportlet_INSTANCE_uJI8_:form1

 

_PruebaIcefacesPortlet_WAR_pruebaicefacesfusionchartportlet_INSTANCE_50fH_:form1

 

 

 

But the ids of the div that conatins the chart are both chartDiv.

 

 

 

Something handled my form's id so, in a porltet that is instanceable, I don't have to manually ensure that the ids are unique; but my div's ids wheren't modified. That's why I thought It was something related with the taglib.

 

 

 

What do you think Srividya.

 

 

 

Jaimico

Edited July 16, 2009 by Guest

[srividya_sharma]

Hi Jaimico,

See if you can get the portlet id or name from the PortletConfig. If you can get it, prefix it to the chartId.

Hope this helps.

Srividya

[Jaimico]

srividya_sharma (7/16/2009)

---

Hi Jaimico,

 

 

 

See if you can get the portlet id or name from the PortletConfig. If you can get it, prefix it to the chartId.

 

 

 

Hope this helps.

 

 

 

Srividya

 

 

 

Hello Srividya!!

 

 

 

Thank you very much for your tip , you mean to prefix the id at my portlet source or at the taglib source?

 

 

 

Greetings!!!!

[srividya_sharma]

Hi Jaimico,

I meant in simple terms,

String chartId = portletId+"SalesChart";

<fc:render chartId="<%=chartId%>">

Srividya

[esanin]

Hello,

Thanks for sharing integration of FusionChart with JSF. Do you have any similar integration solution for Struts 2 as well.

Recently I'm wokring on the same for my latest project, where we are preparing some dashboard like view that will display multiple FusionChart on same page and sometimes in different tabbed pane.

For that I have used an raw approach :

Here is a code snippet from my jsp

<

sx:tabbedpanel id="chartTabs" cssStyle="overflow-x: hidden;" cssClass="tabmenu" selectedTab="1">

<sx:div id="chart" label="Sample Chart" href="chartData" theme="ajax" loadingText="Loading..">

</sx:div>

where chartData is my action class which on the turn returns another jsp page

<

script type="text/javascript">

var responseXML = ajaxCall('type=chart');

var myChart = new FusionCharts("WebTrack/Chart/FCF_MSLine.swf", "myChartId", "400", "270", "0", "0");

myChart.setDataXML(responseXML);

myChart.render(

"chart");

</

script>

Here the method ajaxCall calls the another servlet for input xml.

It's working fine, but definately I'm hacking the Struts Framework.

Can you share related tld for the same?

My environment:

1. Tomcat 6.0.14

2. Struts 2 (struts2-core-2.1.6.jar & xwork-2.1.2.jar)

Thanx

/Abhi

[srividya_sharma]

Hi

Currently, we do not have a tag library that can be used with Struts 2.

I will try to work on it soon.

You could use sx:include to include the FusionChartsRenderer.jsp within the tabbed panel.

Pass the xml obtained from the action as parameter to this jsp.

Srividya

[esanin]

Thanks Srividya.

So you are suggesting to include the fusion chart rendered JSP using sx:include? Ok, how that jsp will be populated, from tabbedpanel should I call the respective jsp and get it populated?

Pls keep me posted.

Thanks

/Abhi

[srividya_sharma]

Hi Abhi,

Have an action class ( say, SalesAction ) which will contact database ( using DAO, DBConnection class ) and create the xml string.

The action can then set the xml and any other value in request attribute.

The result of this action should be defined in the struts.xml as the jsp page containing the chart. ( say, SalesChart.jsp )

In the SalesChart.jsp, you would use sx:include to include the FusionChartsRenderer.jsp in the following manner:

<sx:include value="../Includes/FusionChartsRenderer.jsp">
<sx:param name="chartSWF" value="%{'FusionCharts/Pie3D.swf'}" />
<sx:param name="strURL" value="" />
<sx:param name="strXML" value="%{#request.xmlString}"/>
<sx:param name="chartId" value="%{'FactorySum'}" />
<sx:param name="chartWidth" value="600" />
<sx:param name="chartHeight" value="300" />
<sx:param name="debugMode" value="false" />
<sx:param name="registerWithJS" value="false" />
</sx:include>

In the above code, please substitute with the correct path.

Hope this helps!

Srividya

Edited August 18, 2009 by Guest

[srividya_sharma]

Hi Abhi,

I have posted a small example application here: http://www.fusioncharts.com/forum/Topic17334-33-1.aspx

Please see if that helps too.

Srividya

[srividya_sharma]

Hi everybody,

The latest jar for JSF 1.2 has been posted here: http://www.fusioncharts.com/forum/FindPost17718.aspx

Hope this solves all issues.

Srividya

[phantom]

hi,

When i tried deploying this in my server, i got the error mentioned below,

javax.servlet.ServletException: java.lang.UnsupportedClassVersionError: Bad version number in .class file	org.apache.jasper.servlet.JspServlet.service(JspServlet.java:274)	javax.servlet.http.HttpServlet.service(HttpServlet.java:803)	com.sun.faces.context.ExternalContextImpl.dispatch(ExternalContextImpl.java:410)	com.sun.faces.application.ViewHandlerImpl.executePageToBuildView(ViewHandlerImpl.java:473)	com.sun.faces.application.ViewHandlerImpl.renderView(ViewHandlerImpl.java:141)	com.sun.faces.lifecycle.RenderResponsePhase.execute(RenderResponsePhase.java:109)	com.sun.faces.lifecycle.Phase.doPhase(Phase.java:100)	com.sun.faces.lifecycle.LifecycleImpl.render(LifecycleImpl.java:139)	javax.faces.webapp.FacesServlet.service(FacesServlet.java:266)

I am using Tomcat 6.0 , JRE6. Is there any problem related to the version of Java i m using here?

thanks,

Phantom

[srividya_sharma]

Hi Phantom,

The jar should work for java6.

Please verify that you do not have any older class files or jars in your classpath ( WEB-INF/classes or WEB-INF/lib ).

Srividya

Edited September 4, 2009 by Guest

[mario]

supreme srividya

 

 

 

sorry my ignorance...

 

but i don't understand how i get the information from a xml to use in fusioncharts... the result of my page say "no data to display"

 

my page is this

 

 

 

<%@ page language="java" contentType="text/html; charset=UTF-8"

 

pageEncoding="UTF-8"%>

 

<%@ taglib prefix="f" uri="http://java.sun.com/jsf/core"%>

 

<%@ taglib prefix="h" uri="http://java.sun.com/jsf/html"%>

 

<%@ taglib prefix="fc" uri="http://localhost/"%>

 

<%@ taglib prefix="rich" uri="http://richfaces.org/rich"%>

 

 

 

 

 

Gr

charts.tld.txt

basicChart.java.txt

[srividya_sharma]

Hi Mario,

Since you are using FusionCharts Free, the outermost tag in the xml has to be <graph> instead of <chart>.

FusionCharts Free uses <graph> tag whereas FusionCharts v3 uses <chart> tag and v3 also has several attributes which are not present in free version.

FusionCharts v3 introduces a debug mode for each chart. The debug mode helps you to look into what's happening in the chart behind the scenes. You can see how the chart is initializing, getting its data and interacting with JavaScripts. Various errors generated are also shown in this. So, whenever you see an error on the chart now, all you need to do is switch to debug mode and fix it up. --- from the documentation

Hope this helps. 

If not, please attach the xml file also.

Thanks.

Srividya

[devika]

Hi,

 

 

 

i have followed all the steps shown in this forum, but i am getting output something like this. can anybody find the sollution.

 

 

 

Welcome to Custom tags in End of the Tag

[devika]

/p>

 

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 

 

xmlns:s="http://jboss.com/products/seam/taglib"

 

xmlns:ui="http://java.sun.com/jsf/facelets"

 

xmlns:f="http://java.sun.com/jsf/core"

 

xmlns:h="http://java.sun.com/jsf/html"

 

xmlns:rich="http://richfaces.org/rich"

 

xmlns:fs="http://www.fusioncharts.com"

 

template="layout/template.xhtml">

 

 

 

 

 

 

Welcome to Custom tags in

 

 

#{exampleChartData.xml}

 

 

End of the Tag

 

 

#{exampleChartData.xml}

 

 

 

 

 

 

This is my TestFusion.xhtml file pls somebody help in this.

[srividya_sharma]

Hi Devika,

Can you please tell me the steps that you have followed and the error/problem that you are facing.

Also, tell me the versions of 

a. tag library b. java c. FusionCharts

that you are using

Thanks

Srividya

[devika]

Hi SriVidya,

 

 

 

First Thank you very much for your response.

 

 

 

i am using JSF1.2 and Java file from u r source code folder. i am following steps but output is just text not as fusionchart

 

 

 

what i supposed to do. i doing the same task from last 2 days.

[devika]

Hi,

 

i want integrate Fusion chart in Seam framework.

 

 

 

1.i have created the 5 java classes ChartHTMLTag.java ChartTag.java UIChart.java UIHTMLChart.java ExampleChartData.java

 

 

 

2. i did configuration in faces-config.xml and also i have created mytag.xml also.

 

 

 

3. and finally the testfusion.xhtml file

 

/p>

 

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 

 

xmlns:s="http://jboss.com/products/seam/taglib"

 

xmlns:ui="http://java.sun.com/jsf/facelets"

 

xmlns:f="http://java.sun.com/jsf/core"

 

xmlns:h="http://java.sun.com/jsf/html"

 

xmlns:rich="http://richfaces.org/rich"

 

xmlns:fs="http://www.fusioncharts.com"

 

template="layout/template.xhtml">

 

 

 

 

 

 

 

 

 

 

Welcome to Custom tags in

 

 

#{exampleChartData.xml}

 

 

 

 

End of the Tag

 

 

 

 

#{exampleChartData.xml}

 

 

 

 

 

 

 

 

 

 

Everything is fine. but output is not in Graph format insted the output just text.

[devika]

 

#{exampleChartData.xml}

 

[srividya_sharma]

Hi Devika,

Can you attach the code of your jsp/ jsf page?

Srividya

[devika]

End of the Tag

[devika]

Here is my TestFusion.xhtml

TestFusiontxt.txt