• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
0

CF11 Chart Animation - ColdFusion

Community Beginner ,
Oct 07, 2021 Oct 07, 2021

Copy link to clipboard

Copied

I am trying to get animation to work in CF11, CFChart. I can't it to work any input would be greatly appreciated.

My code is below. Arrows works, but plot does not.

<cfscript>
    arrows=[{"backgroundColor":"red","label":{"text":"Data for 2017","bold":true,"backgroundColor":"white"},
            "size":6,"FROM":{"x":200,"y":100},"to":{"x":400,"y":200}}];

        plot =   { 
            "animation": {
              "effect": "ANIMATION_FADE_IN",
              "speed": "2000"
                        }
                 }
</cfscript>

<CFSET FormsMarkedCompleted = 34>
<CFSET FormsMarkedNotCompleted = 21>
<CFSET TotalFormsEntered 40>

  <cfoutput>
      <cfchart 
        showygridlines="true" 
        gridlines="20" 
        type="bar"
       <!---  arrows="#arrows#" --->
        plot="#plot#"  
        chartHeight="320"
        chartWidth="800" 
        title="Number of competed forms and expected forms"  >
          <cfchartseries  >
            <cfchartdata item="Forms Marked Completed (#FormsMarkedCompleted#)" value="#FormsMarkedCompleted#" >   
            <cfchartdata item="Forms Marked Not Completed (#FormsMarkedNotCompleted#) " value="#FormsMarkedNotCompleted#"> 
            <cfchartdata item="Total Forms Entered (#TotalFormsEntered#)" value="#TotalFormsEntered#">
              
          </cfchartseries>
      </cfchart>
      </cfoutput>

 

Views

117

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Oct 07, 2021 Oct 07, 2021

Copy link to clipboard

Copied

Moving thread to the ColdFusion forum from Using the Community

 

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Oct 16, 2021 Oct 16, 2021

Copy link to clipboard

Copied

I found an error in your code:

<CFSET TotalFormsEntered 40>

After I corrected it to

<CFSET TotalFormsEntered = 40>

the code worked as expected.

BKBK_0-1634384367442.png

However, I am on CF2021 Update 2. 

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Oct 16, 2021 Oct 16, 2021

Copy link to clipboard

Copied

Oh, another thing: delete the cfoutput tags. Not only are they unnecessary, they could cause problems with certain tags.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Oct 19, 2021 Oct 19, 2021

Copy link to clipboard

Copied

I added the = and removed the cfoutput, but unfortunaly the animation still does not work for me in CF11.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Oct 19, 2021 Oct 19, 2021

Copy link to clipboard

Copied

Open the CFM page in the browser.

Press F12 to open Developer Tools.

Press F5 to refresh the page. 

Do you see any errors in Developer Tools?

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Oct 19, 2021 Oct 19, 2021

Copy link to clipboard

Copied

LATEST

I made some corrections (mainly to arrows), then tested the following code on https://trycf.com 

<cftry>
<cfscript>
    arrows=[{
	"backgroundColor": "red",
	"label": {
		"text": "Data for 2017",
		"bold": "true",
		"backgroundColor": "white"
	},
	"size": "6",
	"FROM": {
		"x": "200",
		"y": "100"
	},
	"to": {
		"x": "400",
		"y": "200"
	}
}];

    plot={ 
	    "animation": {
	      "effect": "ANIMATION_FADE_IN",
	      "speed": "2000"
	                }
	         };
</cfscript>

<CFSET FormsMarkedCompleted = 34>
<CFSET FormsMarkedNotCompleted = 21>
<CFSET TotalFormsEntered = 40>

  <cfchart 
	    showygridlines="true" 
	    gridlines="20" 
	    type="bar"
	    arrows="#arrows#" 
	    plot="#plot#"  
	    chartHeight="320"
	    chartWidth="800" 
	    title="Number of competed forms and expected forms"  >
	      <cfchartseries  >
	        <cfchartdata item="Forms Marked Completed (#FormsMarkedCompleted#)" value="#FormsMarkedCompleted#" >   
	        <cfchartdata item="Forms Marked Not Completed (#FormsMarkedNotCompleted#) " value="#FormsMarkedNotCompleted#"> 
	        <cfchartdata item="Total Forms Entered (#TotalFormsEntered#)" value="#TotalFormsEntered#">
	          
	      </cfchartseries>
  </cfchart>

  <cfcatch type="any">
  		<cfdump var="#cfcatch#">
  </cfcatch>
  
</cftry>

 

It worked for CF2016 and CF2016 but, unfortunately, not for CF 11. It didn't give an error either.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Resources
Documentation