srividya_sharma

Even if the response is late, I thought I should mention the solution for this, for the benefit of all. Apart from the steps you have taken,the Byte Order Mark for UTF8 should be put in the xml that is being supplied to FusionCharts. In the chart provider view, (say, pie_chart.html.erb) <% utf8_arr=[0xEF,0xBB,0xBF] utf8_str = utf8_arr.pack("c3") str_xml=utf8_str str_xml+="<?xml version='1.0' encoding='UTF-8'?>" str_xml +="<graph caption... >" # add data here str_xml+="</graph>" %> <%=str_xml%> also, it is better to construct the xml in the .html.erb file than to use a Builder.

Since you are using JSF, I think it will help if you take a look at this: http://www.fusioncharts.com/forum/Topic8629-33-1.aspx Srividya

Hi I have created a sample for saving chart as image in v3. Please check the attached zip file. Add the FusionCharts folder containing the swf files and the js file. Rename the .zip to .war Deploy and test Hope this helps you. Srividya v3ImageExample.zip

I have also created a few examples for using the taglibrary. You can find the sample application attached. Please place the neccessary jar files in the WEB-INF/lib folder of this application. I had used the following jars: commons-beanutils.jar commons-collections.jar commons-digester.jar commons-logging.jar jsf-api.jar jsf-impl.jar jstl.jar standard.jar Also, place the FusionCharts folder with the swf files and js. Srividya FusionChartsFree_JSF.zip

Thanks for the tip and solution. I have now added support for ValueBinding from Backing bean in the tag library. Changes made: 1. xml now is no longer an attribute. You can provide the xml as part of the body of the tag. 2. fc:render and fc:renderHTML are the tags to be used. 3. Binding value can be used for any attribute or the body value. Attached you can find: fusionchartstaglib.zip containing the fusionchartstaglib.jar Srividya fusionchartstaglib.zip

Hi Here is a sample project which contains all the files described in the previous post. The jar files required for JSF are not present. Please put those files in WebContent/WEB-INF/lib folder. Also, FusionCharts swf and js files are not present. Please put those files in WebContent/FusionCharts folder. Run ant, to create the war which can be directly deployed in your web server. Hope this works for you. SkeletonJSF-FCProject.zip

Hi, I have tried it out in my application. To use FusionCharts with JSF, you would need to create a Component. I created a component ChartTag. Let me describe how you have to do it. ( I am assuming that you have a JSF application atleast an empty one) 1. Create a charts.tld file in WEB-INF folder with the following contents: <?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE taglib PUBLIC "-//Sun Microsystems, Inc.//DTD JSP Tag Library 1.2//EN" "http://java.sun.com/dtd/web-jsptaglibrary_1_2.dtd"> <taglib> <tlib-version>1.0</tlib-version> <jsp-version>1.2</jsp-version> <short-name>fc</short-name> <uri>http://localhost/</uri> <tag> <name>fusioncharts</name> <tag-class>charts.ChartTag</tag-class> <body-content>JSP</body-content> <attribute> <name>filename</name> </attribute> <attribute> <name>url</name> </attribute> <attribute> <name>xml</name> </attribute> <attribute> <name>chartId</name> </attribute> <attribute> <name>width</name> </attribute> <attribute> <name>height</name> </attribute> <attribute> <name>debugMode</name> </attribute> <attribute> <name>registerWithJS</name> </attribute> </tag> </taglib> 2. Modify faces-config.xml present in WEB-INF folder to have the following text: <?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE faces-config PUBLIC "-//Sun Microsystems, Inc.//DTD JavaServer Faces Config 1.0//EN" "http://java.sun.com/dtd/web-facesconfig_1_1.dtd"> <faces-config> <component> <component-type>chart</component-type> <component-class>charts.UIChart</component-class> </component> <lifecycle/> <application> <locale-config/> </application> <factory/> </faces-config> 3. Now we need to write the java classes for charts.ChartTag and charts.UIChart. Create a folder called charts and write the following java classes: ChartTag.java package charts; import javax.faces.component.UIComponent; import javax.faces.webapp.UIComponentTag; public class ChartTag extends UIComponentTag{ String chartId; String filename; String xml; String url; String width; String height; String debugMode; String registerWithJS; public String getChartId() { return chartId; } public void setChartId(String id) { this.chartId= id; } public String getFilename() { return filename; } public void setFilename(String filename){ this.filename= filename; } public String getXml() { return xml; } public void setXml(String xml){ this.xml= xml; } public String getUrl() { return url; } public void setUrl(String url) { this.url= url; } public String getWidth() { return width; } public void setWidth(String width) { this.width= width; } public String getHeight() { return height; } public void setHeight(String height) { this.height= height; } public String getDebugMode() { return debugMode; } public void setDebugMode(String debugMode) { this.debugMode= debugMode; } public String getRegisterWithJS() { return registerWithJS; } public void setRegisterWithJS(String registerWithJS) { this.registerWithJS= registerWithJS; } public void release() { // the super class method should be called super.release(); chartId=null; filename=null; xml=null; url=null; width=null; height=null; debugMode=null; registerWithJS=null; } protected void setProperties(UIComponent component) { // the super class method should be called super.setProperties(component); if(chartId != null) component.getAttributes().put("id", chartId); if(filename != null) component.getAttributes().put("filename", filename); if(xml!=null) component.getAttributes().put("xml", xml); if(url!=null) component.getAttributes().put("url", url); if(width!=null) component.getAttributes().put("width", width); if(height!=null) component.getAttributes().put("height", height); if(debugMode!=null) component.getAttributes().put("debugMode", debugMode); if(registerWithJS!=null) component.getAttributes().put("registerWithJS", registerWithJS); } public String getComponentType() { return "chart"; } public String getRendererType() { // null means the component renders itself return null; } } UIChart.java package charts; import java.io.IOException; import javax.faces.component.UIOutput; import javax.faces.context.FacesContext; import javax.faces.context.ResponseWriter; public class UIChart extends UIOutput { public void encodeBegin(FacesContext context) throws IOException { ResponseWriter writer = context.getResponseWriter(); String chartId = (String)getAttributes().get("id"); writer.startElement("div", this); writer.writeAttribute("id", chartId+"Div" , null); writer.writeAttribute("align","center",null); writer.writeText("Chart.",null); writer.endElement("div"); String chartSWF= (String)getAttributes().get("filename"); String url= (String)getAttributes().get("filename"); String xml= (String)getAttributes().get("xml"); String chartWidth= (String)getAttributes().get("width"); String chartHeight= (String)getAttributes().get("height"); String debugMode= (String)getAttributes().get("debugMode"); int debugModeInt = boolToNum(new Boolean(debugMode)); String registerWithJS= (String)getAttributes().get("registerWithJS"); int regWithJSInt = boolToNum(new Boolean(registerWithJS)); writer.startElement("script",this); writer.writeAttribute("type","text/javascript",null); writer.writeText("var chart_"+chartId+" = new FusionCharts('"+chartSWF+"', '"+chartId+"', '"+chartWidth +"', '"+chartHeight+"', '"+ debugModeInt+"', '"+regWithJSInt+"');",null); if (xml==null || xml.equals("")) writer.writeText("chart_"+chartId+".setDataURL(""+url+"");",null); else writer.writeText("chart_"+chartId+".setDataXML(""+xml+"");",null); // Finally render the chart writer.writeText("chart_"+chartId+".render('"+chartId+"Div');",null); } public void encodeEnd(FacesContext context) throws IOException { ResponseWriter writer = context.getResponseWriter(); writer.endElement("script"); } /** * Converts a Boolean value to int value<br> * * @param bool Boolean value which needs to be converted to int value * @return int value correspoding to the boolean : 1 for true and 0 for false */ public int boolToNum(Boolean bool) { int num = 0; if (bool.booleanValue()) { num = 1; } return num; } } 4. After writing the java classes, we now have to use the new component in our JSF. Here is how we do that: <%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %> <%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %> <%@ taglib uri="http://localhost/" prefix="fc" %> <html> <head> <title>Show Custom Component</title> <script type="text/javascript" src="FusionCharts/FusionCharts.js"> </script> </head> <body> <f:view> <f:verbatim>This is JSF example</f:verbatim> <fc:fusioncharts chartId="MyChart" filename="FusionCharts/Column3D.swf" width="700" height="300" xml="<chart caption='Monthly Unit Sales' xAxisName='Month' yAxisName='Units' showValues='0' formatNumberScale='0' showBorder='1'><set label='Jan' value='462' /><set label='Feb' value='857' /><set label='Mar' value='671' /><set label='Apr' value='494' /><set label='May' value='761' /><set label='Jun' value='960' /><set label='Jul' value='629' /><set label='Aug' value='622' /><set label='Sep' value='376' /><set label='Oct' value='494' /><set label='Nov' value='761' /><set label='Dec' value='960' /></chart>" debugMode="false" registerWithJS="false"> </fc:fusioncharts> </f:view> </body> </html> Do not forget to include FusionCharts.js present in the FusionCharts folder. This folder will also contain the swf files required to generate the chart. I have used the xml directly here. you could give the url to the xml also. Here I have hard-coded the xml, you could get the xml from the backing bean also. In case you have problems with the above code, please feel free to ask questions. Srividya

Hi Basically, you would need to do these: 1. FusionCharts Library.fp7 needs to be uploaded to the FileMaker server. This file is present in the Charts folder that came as part of your FusionCharts download package. 2. The Charts folder containing all the .swf, .html and .js provided by FusionCharts, should be uploaded to a server so that FusionCharts Library.fp7 can access them. To achieve this, the script InitializeFusionCharts present in FusionCharts Library.fp7 needs to be modified. In this script, the variable $$currentDir contains the path to the Charts folder. The value of this variable should be changed to the complete path to the Charts folder on the web server or file server. For example, http://myserver:80/fc/Charts where myserver is the name of the server, 80 is the port where it is running and /fc/Charts is the path to the Charts folder on this server. 3. Your database on the server needs to contact the FusionCharts Library.fp7 and perform the script InitializeFusionCharts ( as recommended in the docs). Please refer to this thread for more details: http://www.fusioncharts.com/forum/Topic4882-31-1.aspx?Update=1 Please feel free to ask any more questions that may arise. Srividya

You would need a file server or a web server configured with FileMaker to acheive this. Please see the attached word document for detailed guidance. Please feel free to contact us in case of more queries, FusionCharts team Rendering Charts via FileMaker Server.doc

I have modified the jsp given by you. Please find the jsp in the attached zip file. Here is the list of changes that were made to the jsp : 1. In the chart xml (dataXML), replace all double quotes (escaped) with single quotes when specifying values for attributes. 2. Use the setDataXML function to set the xml string to the chart object (myChart). Root element of XML data document has been changed from <graph> to <chart> (from v2.3 to v3 ). However, <graph> element would still continue to work from your old XML documents. But, we recommend using <chart> element for any new charts that you now make. Thanks, Srividya FusionCharts Team modifiedtestChart.zip