rahul_advanced Report post Posted August 2, 2012 I created a rest web service in C#.Net using wcf which return chart script and i am calling that service on my html page under the javascript and whatever response i am getting that i assign into div but it is not generating any chart. It simply Shows Chart as string. I don't know what is wrong? But i know whatever string returned by wcf service that is correct because when i put directly that string under any div tag it render chart. Below i give some code so you come to know what i am trying to do. I see some examples of fusion chart with ASP/C#.Net but i don't want to use that methods where we have to create asp literals and assign chart on that. My requirement is:- 1) call Service which internally calling FusionCharts.RenderChart("../StackedColumn3D.swf", "", chartData, "myChart6", "350", "350", false, false) function which is available in FusionCharts.dll. So i created function like below and my service calling this function and returning data that is returned by this method. public void GetChart() { return FusionCharts.RenderChart("../StackedColumn3D.swf", "", chartData, "myChart6", "350", "350", false, false) ; } 2) I am calling this function in html page using javascript like function getChartFromService{ var xmlhttp = new XMLHttpRequest(); if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari xmlhttp = new XMLHttpRequest(); } else {// code for IE6, IE5 xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.open("POST", "api/reportGraph/3.xml?start=1&limit=2&height=300&width=300", false); //Pass data as form in request var dataToSend = "some data"; xmlhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); xmlhttp.send(dataToSend); //Get respons var response = xmlhttp.responseText; //genrate chart document.getElementById("div1").innerHTML=response; } 3) I created a simple html file MyChart.html :- code of body part of html <body> <table> <tr> <td> <input type="button" value="Generate Chart" onclick="getChartFromService ()" /> </td> </tr> <tr> <td> <div id ="div1"> </div> </td> </tr> </table> </body> so when i run the html page and click on Genrate chart button i get Chart as string on my page. No chat is loading , plz help me. i am just paste the response of my service , in case u need. <!-- Using ASP.NET FusionCharts v3.2.2.1 Wrapper and JavaScript rendering --><!-- START Script Block for Chart myChart6 --> <div id='myChart6Div' > Chart. </div> <script type="text/javascript"> if (FusionCharts && FusionCharts("myChart6") ) FusionCharts("myChart6").dispose(); var chart_myChart6 = new FusionCharts({"debugMode" : "0", "swfUrl" : "../StackedColumn3D.swf", "renderAt" : "myChart6Div", "width" : "350", "wMode" : "opaque", "dataFormat" : "xml", "id" : "myChart6", "lang" : "EN", "scaleMode" : "noScale", "registerWithJS" : "1", "height" : "350","dataSource" : "<chart caption='TopLinksClicked'><categories><category label='Day1' /><category label='Day1' /></categories><dataset seriesName='TotalClicks'><set value='17' /><set value='2' /></dataset><dataset seriesName='SitePageId'><set value='31' /><set value='31' /></dataset></chart>"}).render();</script> <!-- END Script Block for Chart myChart6 --> Share this post Link to post Share on other sites
Guest Sumedh Report post Posted August 3, 2012 Hi Rahul, Please check for following points: > If You've copied FusionCharts.js, jquery.min.js, FusionCharts.HC.js and FusionCharts.HC.Charts.js in the right folder? Keep all the files in same folder. > Also check if you have provided correct path for FusionCharts.js in your aspx code or not? > Also, check for chart SWF file path Path should be specified as a relative path. Share this post Link to post Share on other sites
rahul_advanced Report post Posted August 3, 2012 Hello Sumedh............. I check all .js files and .swf files path, all are correct and my service also return correct data, because if i copy the response of my service and directly put it under the <div></div> tag , it render the chart. Share this post Link to post Share on other sites
Guest Sumedh Report post Posted August 3, 2012 Hey Rahul, The response variable should return following javascript code: <script type="text/javascript"> if (FusionCharts && FusionCharts("myChart6") ) FusionCharts("myChart6").dispose(); var chart_myChart6 = new FusionCharts({"debugMode" : "0", "swfUrl" : "../StackedColumn3D.swf", "renderAt" : "myChart6Div", "width" : "350", "wMode" : "opaque", "dataFormat" : "xml", "id" : "myChart6", "lang" : "EN", "scaleMode" : "noScale", "registerWithJS" : "1", "height" : "350","dataSource" : "<chart caption='TopLinksClicked'><categories><category label='Day1' /><category label='Day1' /></categories><dataset seriesName='TotalClicks'><set value='17' /><set value='2' /></dataset><dataset seriesName='SitePageId'><set value='31' /><set value='31' /></dataset></chart>"}).render();</script> And the div id that you have mentioned in getElementById statement should be same for rendering the chart. Ref. Code: document.getElementById("div1").innerHTML=response; "renderAt" : "div1" Hope this helps! Share this post Link to post Share on other sites
rahul_advanced Report post Posted August 3, 2012 (edited) Thanks for reply Sumedh I am getting same java script from server side but that script already contain <div> tag......... this the script that i am getting <!-- Using ASP.NET FusionCharts v3.2.2.1 Wrapper and JavaScript rendering --><!-- START Script Block for Chart myChart6 --> <div id='myChart6Div' > Chart. </div> <script type="text/javascript"> if (FusionCharts && FusionCharts("myChart6") ) FusionCharts("myChart6").dispose(); var chart_myChart6 = new FusionCharts({"debugMode" : "0", "swfUrl" : "../ext-4.0.0/charts2/StackedColumn3D.swf", "renderAt" : "myChart6Div", "width" : "350", "wMode" : "opaque", "dataFormat" : "xml", "id" : "myChart6", "lang" : "EN", "scaleMode" : "noScale", "registerWithJS" : "1", "height" : "350","dataSource" : "<chart caption='TopLinksClicked'><categories><category label='Day1' /><category label='Day1' /></categories><dataset seriesName='TotalClicks'><set value='17' /><set value='2' /></dataset><dataset seriesName='SitePageId'><set value='31' /><set value='31' /></dataset></chart>"}).render();</script> <!-- END Script Block for Chart myChart6 --> Edited August 3, 2012 by rahul_advanced Share this post Link to post Share on other sites
Guest Sumedh Report post Posted August 3, 2012 Hi Rahul, Response variable should contain only javascript script block, for this you will have to modify your code at your end. Share this post Link to post Share on other sites