Infomatrixx Report post Posted June 24, 2012 Hello Team, I am trying my first steps with FusionCharts and I am struggeling with the first issue. I created a simple website with jquery mobile. This site has a DIV container which is collapsible and in it there is fusion chart (Pie Chart) using JSON data. <div data-role="collapsible-set" style="width:90%; margin:0 auto;"> <div data-role="collapsible" data-collapsed="true"> <h3>Frage 1</h3> <p> <div id="question-1" style="text-align:center;"></div> <script type="text/javascript"><!-- if ( FusionCharts( "chart-1" ) ) { FusionCharts( "chart-1" ).dispose(); } var myChart = new FusionCharts( "libs/js/fusion-charts/Column3D.swf", "chart-1", "400", "300", "1", "1" ); myChart.setJSONUrl("Data.json"); myChart.render("question-1"); // --> </script> </p> </div> <div data-role="collapsible"> <h3>Frage 2</h3> <p>Chart Einbindung</p> </div> </div> </div> After the first load of the page everything is fine. When I collapse the container (visibility:hidden) and make it visibile again, the Chart shows "No data to display". Here is the debug output: Before collapsing and uncollapsing Info: Chart loaded and initialized. Initial Width: 400 Initial Height: 300 Scale Mode: noScale Debug Mode: Yes Application Message Language: EN Version: 3.2.2(XT) Chart Type: Single Series 3D Column Chart Chart Objects: BACKGROUND CANVAS CAPTION SUBCAPTION YAXISNAME XAXISNAME DIVLINES YAXISVALUES DATALABELS DATAVALUES TRENDLINES TRENDVALUES DATAPLOT TOOLTIP VLINES VLINELABELS INFO: Chart registered with external script. DOM Id of chart is chart-1 INFO: XML Data provided using dataURL method. dataURL provided: Data.json dataURL invoked: Data.json?FCTime=190 INFO: setDataXML method invoked from external script. INFO: XML Data provided using dataXML method. XML Data: <chart caption="Wie ist die Stimmung?" xaxisname="Week" yaxisname="Sales" numberprefix="{:content:}quot; bgcolor="#eceded"><set label="Week 1" value="14400" /><set label="Week 2" value="19600" /><set label="Week 3" value="24000" /><set label="Week 4" value="15700" /></chart> After collapsing and uncollapsing Info: Chart loaded and initialized. Initial Width: 400 Initial Height: 300 Scale Mode: noScale Debug Mode: Yes Application Message Language: EN Version: 3.2.2(XT) Chart Type: Single Series 3D Column Chart Chart Objects: BACKGROUND CANVAS CAPTION SUBCAPTION YAXISNAME XAXISNAME DIVLINES YAXISVALUES DATALABELS DATAVALUES TRENDLINES TRENDVALUES DATAPLOT TOOLTIP VLINES VLINELABELS INFO: Chart registered with external script. DOM Id of chart is chart-1 INFO: XML Data provided using dataURL method. dataURL provided: Data.json dataURL invoked: Data.json?FCTime=140 XML Data: { "chart": { "caption" : "Wie ist die Stimmung?" , "xAxisName" : "Week", "yAxisName" : "Sales", "numberPrefix" : "{:content:}quot;, "bgColor" : "#eceded" }, "data" : [ { "label" : "Week 1", "value" : "14400" }, { "label" : "Week 2", "value" : "19600" }, { "label" : "Week 3", "value" : "24000" }, { "label" : "Week 4", "value" : "15700" } ] } No Data to Display: No data was found in the XML data document provided. Possible cases can be: There isn't any data generated by your system. If your system generates data based on parameters passed to it using dataURL, please make sure dataURL is URL Encoded. You might be using a Single Series Chart .swf file instead of Multi-series .swf file and providing multi-series data or vice-versa. Any ideas how to solve it? best regards, Fabian Share this post Link to post Share on other sites
Guest Sumedh Report post Posted June 25, 2012 Hello Team, I am trying my first steps with FusionCharts and I am struggeling with the first issue. I created a simple website with jquery mobile. This site has a DIV container which is collapsible and in it there is fusion chart (Pie Chart) using JSON data. <div data-role="collapsible-set" style="width:90%; margin:0 auto;"> <div data-role="collapsible" data-collapsed="true"> <h3>Frage 1</h3> <p> <div id="question-1" style="text-align:center;"></div> <script type="text/javascript"><!-- if ( FusionCharts( "chart-1" ) ) { FusionCharts( "chart-1" ).dispose(); } var myChart = new FusionCharts( "libs/js/fusion-charts/Column3D.swf", "chart-1", "400", "300", "1", "1" ); myChart.setJSONUrl("Data.json"); myChart.render("question-1"); // --> </script> </p> </div> <div data-role="collapsible"> <h3>Frage 2</h3> <p>Chart Einbindung</p> </div> </div> </div> After the first load of the page everything is fine. When I collapse the container (visibility:hidden) and make it visibile again, the Chart shows "No data to display". Here is the debug output: Before collapsing and uncollapsing Info: Chart loaded and initialized. Initial Width: 400 Initial Height: 300 Scale Mode: noScale Debug Mode: Yes Application Message Language: EN Version: 3.2.2(XT) Chart Type: Single Series 3D Column Chart Chart Objects: BACKGROUND CANVAS CAPTION SUBCAPTION YAXISNAME XAXISNAME DIVLINES YAXISVALUES DATALABELS DATAVALUES TRENDLINES TRENDVALUES DATAPLOT TOOLTIP VLINES VLINELABELS INFO: Chart registered with external script. DOM Id of chart is chart-1 INFO: XML Data provided using dataURL method. dataURL provided: Data.json dataURL invoked: Data.json?FCTime=190 INFO: setDataXML method invoked from external script. INFO: XML Data provided using dataXML method. XML Data: <chart caption="Wie ist die Stimmung?" xaxisname="Week" yaxisname="Sales" numberprefix="{:content:}quot; bgcolor="#eceded"><set label="Week 1" value="14400" /><set label="Week 2" value="19600" /><set label="Week 3" value="24000" /><set label="Week 4" value="15700" /></chart> After collapsing and uncollapsing Info: Chart loaded and initialized. Initial Width: 400 Initial Height: 300 Scale Mode: noScale Debug Mode: Yes Application Message Language: EN Version: 3.2.2(XT) Chart Type: Single Series 3D Column Chart Chart Objects: BACKGROUND CANVAS CAPTION SUBCAPTION YAXISNAME XAXISNAME DIVLINES YAXISVALUES DATALABELS DATAVALUES TRENDLINES TRENDVALUES DATAPLOT TOOLTIP VLINES VLINELABELS INFO: Chart registered with external script. DOM Id of chart is chart-1 INFO: XML Data provided using dataURL method. dataURL provided: Data.json dataURL invoked: Data.json?FCTime=140 XML Data: { "chart": { "caption" : "Wie ist die Stimmung?" , "xAxisName" : "Week", "yAxisName" : "Sales", "numberPrefix" : "{:content:}quot;, "bgColor" : "#eceded" }, "data" : [ { "label" : "Week 1", "value" : "14400" }, { "label" : "Week 2", "value" : "19600" }, { "label" : "Week 3", "value" : "24000" }, { "label" : "Week 4", "value" : "15700" } ] } No Data to Display: No data was found in the XML data document provided. Possible cases can be: There isn't any data generated by your system. If your system generates data based on parameters passed to it using dataURL, please make sure dataURL is URL Encoded. You might be using a Single Series Chart .swf file instead of Multi-series .swf file and providing multi-series data or vice-versa. Any ideas how to solve it? best regards, Fabian Hi, Could you please check the browser's console log? Whenever you click on the control (ex. div, chartdiv etc.) for collapsible element, check the browser's console log, if the chart id has been generated or not? Also, check if the chart id has been disposed or not after the completion of collapsible event. Once again repeat the same procedure and let us know. Please send these details as it would be helpful to look into it. Share this post Link to post Share on other sites