Fusionchart inside coldfusion cfdiv tag

[SteveM]

I am trying to use a fusionchart inside of a coldfusion cfdiv tag to allow my chart to change using Ajax without having to reload the entire page. When I try this I am getting errors. Unfortunately I can't see the errors, I just get a generic Ajax error. I took the page that I am calling in my cfdiv tag and loaded it like a normal page and the chart displayed correctly. I then commented out the javascript and loaded the page in the cfdiv again and no errors appeared. To verify if the problem is DOM related I did a simple getElementById for an element on the sub page and did a on the remaining code. This caused the same type of error to appear.

 

 

 

So, I am assuming that this means that any code inside a tag does not have access to the standard DOM. If this is the case, are there any possible workarounds?

[Rahul Kumar]

Hi,

 

To work with Ajax, you would need to load chart using HTML tag (<object>).

[SteveM]

Using the HTML tag will force the user to click on the chart in order to interact with it, correct?

[Rahul Kumar]

Hi,

 

In Ajax, this issue will not arise.

[ikebest]

Hi have solve the problem? can you share with me..?

[Guest Madhumita]

Hi,

The solution is to do direct HTML embedding using the <object> tag.

<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" width="900" height="300" id="Column3D" >

 <param name="movie" value="../FusionCharts/Column3D.swf" />

 <param name="FlashVars" value="&dataURL=Data.xml&chartWidth=900&chartHeight=300">

 <param name="quality" value="high" />

 <embed src="../FusionCharts/Column3D.swf" flashVars="&dataURL=Data.xml&chartWidth=900&chartHeight=300" quality="high" width="900" height="300" name="Column3D" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />

</object>

ref. - http://www.fusioncharts.com/docs/Contents/FirstChart.html

I hope this helps you.

[ikebest]

ok can you help to solve this ,

 

 

 

this is my query

 

 

 

 

select statement_date, server_id,db_name, sum(total_act_prc) as total_acc, sum(total_act_failed) as total_failed from xxx

 

where statement_date =

 

group by statement_date, server_id,db_name

 

order by statement_date, server_id,db_name

 

 

 

 

 

 

 

< cfloop query="qGetAcc" >

 

< cfset date = #DATEFORMAT(statement_date,"dd-mmm-yy")#>

 

< cfset days = #NumberFormat(total_acc, "0.00" )#>

 

< cfset strXML = strXML & "">

 

cfloop>

 

< cfset strtrendLines = "">

 

< cfset strXML = strXML & strtrendLines &"">

 

< cfoutput>#renderChart("../CFM/Charts/Column3D.swf", "", strXML, "kpi",850, 250, 0, 0)#

 

 

 

how to do this using cfdiv tag ?

Edited March 15, 2010 by Guest

[SteveM]

The HTML embedding has worked wonderfully. But now we want to expand the use and allow the user to drill-down into the data and display details using JS functions for the links. So far all efforts to follow the documentation have failed. Here are the examples and results:

 

 

 

JavaScript:GetDetail(); = Will call the JS function, but I can not pass strings to the JS function.

 

j:GetDetail() = Does not work at all.

 

j-GetDetail() = Does not work at all.

 

j-GetDetail-{parameters} = Does not work at all.

 

 

 

There is a reference in the documentation, "Additionally, it's important to set the registerWithJS attribute in constructor to 1 (the last attribute in the line which initializes a FusionCharts chart in the page)." I have found the information in the forums on how to accomplish this when using the JS embedding, but I have yet to find a version for the HTML embedded version.

 

 

 

Thanks in advance for any help.

[Guest Basundhara Ghosal]

Hi Steve,

In case you are using the ColdFusion application to render the chart, you need to turn the "RegisterWithJS" option to true.

Ref.- <cfoutput>#renderChart("../../FusionCharts/Column2D.swf?ChartNoDataText=Please select a factory from pie chart above to view detailed data.", "", "<chart></chart>", "FactoryDetailed", 600, 250, false, true)

Please refer to the link below for further details on the same:-

Ref.- http://www.fusioncharts.com/docs?/CFM_JS_URL.html

Hope this helps.

[SteveM]

I don't believe that this will work as I am still trying to load the page in a CFDIV which prevents the JS from working properly. That is why we were having to use the HTML embedded version to display our charts. Looking through the FusionCharts.cfm include file, the renderChartHTML cffunction doesn't provider a registerWithJS parameter like the renderChart cffunction does.

 

 

 

We tried the renderChart method as directed previously, but it does not work.

 

 

 

Edit:

 

As a side note, I copied the code that we are trying to use into a page and loaded it outside of a CFDIV without any problems. So, the problem is still that the JS will not work when the pages are loaded in a CFDIV.

Edited April 13, 2010 by Guest

[FusionCharts Support]

Hi,

 

 

 

Even if you are not using JavaScript embedding method you can still set registerWithJS=1 using the renderChartHTML().

 

 

 

To achieve this all you need to do is to pass registerWithJS=1 as a querystring to the chart SWF file.

 

 

 

So, your function call would look something like:

 

 

 

<cfoutput>#renderChartHTML("../../FusionCharts/Column3D.swf?registerWithJS=1", "Data/Data.xml", "", "myFirst", 600, 300, false)#</cfoutput>