-
FEATURED COMPONENTS
First time here? Check out the FAQ!
I want to know that how to use Fusion Charts in ZK ( *.zul file).
on menu.zul
void sucessful_rate_tab() {
Treeitem item = tree_succ.getSelectedItem();
Treeitem parent_i = item.getParentItem();
if(item==null||item.getLevel()!=1){
return;
}
ehour=new SimpleDateFormat("HHmm").format(etb.value);
shour=new SimpleDateFormat("HHmm").format(stb.value);
Include include = spaceOwner.parent.getFellow("centerInclude");
include.setSrc("/fusion_chart6.zul?service=" + parent_i.label.toUpperCase() + "&host=" + item.label.toUpperCase() + "&thatdate=" + thatd + shour + "&enddate=" + endd + ehour);
// this works / Executions.getCurrent().sendRedirect("./fusion_chart6.zul?service=" + parent_i.label.toUpperCase() + "&host=" + item.label.toUpperCase() + "&thatdate=" + thatd + shour + "&enddate=" + endd + ehour);
}
on fuson_chart6.zul:
<zscript>
to read DB content into fusion chart xml file
</zscript>
<zk xmlns:h="http://www.w3.org/1999/xhtml" xmlns:w="http://www.zkoss.org/2005/zk/client">
<?script type="text/javascript" charset="UTF-8" src="./JSClass/Legacy/FusionCharts.js"?>
<?script type="text/javascript" charset="UTF-8" src="./JSClass/Legacy/FusionChartsExportComponent.js"?>
<h:div id="chartdiv" align="center">
<attribute w:name="onBind"><![CDATA[
var myChart = new FusionCharts( "./Charts/Line.swf",
"myChartId", "99%", "92%", "0", "1" );
myChart.setDataURL("./tmp/ChartData.xml");
myChart.render("chartdiv");
]]></attribute>
</h:div>
<h:div id="fcexpDiv" align="center">
<attribute w:name="onBind"><![CDATA[
var myExportComponent = new FusionChartsExportObject("fcExporter1", "Charts/FCExporter.swf");
//Render the exporter SWF in our DIV fcexpDiv
myExportComponent.Render("fcexpDiv");
]]></attribute>
</h:div>
</zk>
</window>
Or how can i upload file or sent file to you?
Hi
Can you provide a runnable sample code ?
give a example how you pass data, if you are passing using url param, please provide a sample link
you can add [ code ] tag to your sample code
for example
a1.zul
<zk> ........ </zk>
a2.zul
<zk> ........ </zk>
a1.zul
Include include = spaceOwner.parent.getFellow("centerInclude");
include.setSrc("/fusion_chart6.zul?service=" + parent_i.label.toUpperCase() + "&host=" + item.label.toUpperCase() + "&thatdate=" + thatd + shour + "&enddate=" + endd + ehour);
a2.zul ( fusion_chart6.zul parameters : hostname, start date/ hour, end date/hour )
<zscript>
Read DB content into fusion chart xml file
</zscript>
<zk xmlns:h="http://www.w3.org/1999/xhtml" xmlns:w="http://www.zkoss.org/2005/zk/client">
<?script type="text/javascript" charset="UTF-8" src="./JSClass/Legacy/FusionCharts.js"?>
<?script type="text/javascript" charset="UTF-8" src="./JSClass/Legacy/FusionChartsExportComponent.js"?>
<h:div id="chartdiv" align="center">
<attribute w:name="onBind"><![CDATA[
var myChart = new FusionCharts( "./Charts/Line.swf",
"myChartId", "99%", "92%", "0", "1" );
myChart.setDataURL("./tmp/ChartData.xml");
myChart.render("chartdiv");
]]></attribute>
</h:div>
<h:div id="fcexpDiv" align="center">
<attribute w:name="onBind"><![CDATA[
var myExportComponent = new FusionChartsExportObject("fcExporter1", "Charts/FCExporter.swf");
//Render the exporter SWF in our DIV fcexpDiv
myExportComponent.Render("fcexpDiv");
]]></attribute>
</h:div>
</zk>
</window>
Hi
I can't test your code, I do not have the javascript file
<?script type="text/javascript" charset="UTF-8" src="./JSClass/Legacy/FusionCharts.js"?> <?script type="text/javascript" charset="UTF-8" src="./JSClass/Legacy/FusionChartsExportComponent.js"?>
by the way, please use [ code ] tag, to order your sample code
my email is [email protected],
can i sent codes by e-mail ?
Hi
I don't have /Legacy/* files, even you send code, I can not run it.
Beside, Forum is a place for share, hope you can share your sample code with others, maybe some one can help you.
However, if you are in a hurry, yo can ask for Commercial Support, refer to support
Hi
/Legacy/* files is from fusionchart evaluation package, you can download from http://www.fusioncharts.com/.
I like to share my code, but it is a lot of codes.
============= below is source code ===========================
index.zul
<?xml version="1.0" encoding="Big5"?> <?page id="SPO" title="SPO" ?> <?component name="leftmenu" macroURI="menu_test.zul" ?> <div align="center"> <borderlayout width="1024px"> <center> <borderlayout> <west size="25%" id="leftMenu" splittable="true" maxsize="230" collapsible="true" title="SPO" style="padding:0px; margin:0px;background:#c5e6ef;"> <div align="left"> <leftmenu /> </div> </west> <center autoscroll="true" sclass="center-body" style="margin:0px;"> <include src="/hello_world.zul" id="centerInclude" progressing="true" /> </center> </borderlayout> </center> </borderlayout> </div>
<?xml version="1.0" encoding="Big5" ?> <?page title="OAM PORTAL" style="color:blue;font-size:200px" contentType="text/html;charset=UTF-8" ?> <zk> <zscript><![CDATA[ void Fusion_tab() { Treeitem item = tree_succ.getSelectedItem(); Treeitem parent_i = item.getParentItem(); if(item==null||item.getLevel()!=1){ return; } Include include = spaceOwner.parent.getFellow("centerInclude"); // This doesn't work //include.setSrc("fusion_chart4.zul"); // This works Executions.getCurrent().sendRedirect("fusion_chart4.zul"); } ]]></zscript> <portallayout maximizedMode="whole"> <portalchildren style="padding:2px" width="100%"> <panel height="220px" title="Fusion Chart" border="normal" collapsible="true" open="false" onClick="Fusion_tab()"> <panelchildren> <tree id="tree_succ" width="99%" rows="8" > <treecols sizable="true"> <treecol label="Name" /> </treecols> <treechildren> <treeitem open="false" > <treerow> <treecell label="Web"/> </treerow> <treechildren > <treeitem open="false"> <treerow> <treecell label="Server1" /> </treerow> </treeitem> </treechildren> </treeitem> </treechildren> </tree> </panelchildren> </panel> </portalchildren> </portallayout> </zk>
<?page title="Fusion Chart template" contentType="text/html;charset=UTF-8"?> <zk xmlns:h="http://www.w3.org/1999/xhtml" xmlns:w="http://www.zkoss.org/2005/zk/client"> <?script charset="UTF-8" src="../JSClass/Legacy/FusionCharts.js"?> <?script charset="UTF-8" src="../JSClass/Legacy/FusionChartsExportComponent.js"?> <window title="Fusion Chart template" border="0"> <h:div id="chartdiv" align="center"> <attribute w:name="onBind"><![CDATA[ var myChart = new FusionCharts( "../Charts/Column3D.swf", "myChartId", "400", "300", "0", "1" ); myChart.setDataXML("<chart exportEnabled='1' exportAtClient='1' exportHandler='fcExporter1' exportAction='download'><set name='A' value='10' color='D64646' /><set name='B' value='11' color='AFD8F8' /></chart>"); myChart.render("chartdiv"); ]]></attribute> </h:div> <h:div id="fcexpDiv" align="center"> <attribute w:name="onBind"><![CDATA[ var myExportComponent = new FusionChartsExportObject("fcExporter1", "../Charts/FCExporter.swf"); //Render the exporter SWF in our DIV fcexpDiv myExportComponent.Render("fcexpDiv"); ]]></attribute> </h:div> </window> </zk>
<window> ZK is power ! </window>
Hi
this is because when you use Include.setSrc() inside the page, you use
<?script charset="UTF-8" src="./JSClass/FusionCharts.js"?> <?script charset="UTF-8" src="./JSClass/FusionChartsExportComponent.js"?>
this 2 javascript should loaded before you setSrc, but in index.zul, you didn't load it, that why it won't work
you can include this in index.zul
<?script charset="UTF-8" src="./JSClass/FusionCharts.js"?> <?script charset="UTF-8" src="./JSClass/FusionChartsExportComponent.js"?>
or, you can use lang.addon.xml to laod these javascript file
samchuang: Thanks, it works.
Hello
how can i pass Json data that i get from server side??
in same zull file
<zscript><![CDATA[
JSONObject JSONdata = GetJSONdata("object");
]]></zscript>
..........................................................
<h:div id="chartdiv" height="500px">
<attribute w:name="onBind"><![CDATA[
var chart = new FusionCharts("charts/Column3D.swf", "ChartId", "400", "300", "0", "1");
chart.setJSONData(JSONdata);
chart.render("chartdiv");
]]></attribute>
</h:div>
Asked: 2010-08-17 15:05:44 +0800
Seen: 8,414 times
Last updated: Sep 05 '12