Su asks:
I could have sworn that there was a specific attribute for this from with the core ColdFusion language itself, but I did not see it. So, as always, I went to the WebCharts graphical editor. I found the setting right away: elements:shapeSize.I am trying to use CFCHART to create bar graphs. I need to specifically format them to match to a predefined sized width of bars. Is there a way to control the width of bars produced by the CFchart? Thanks for any help.
I generated the XML from the chart, stripped out all the extra stuff, and got to this:
<!--- style from webcharts ---> <cfsavecontent variable="style"> <?xml version="1.0" encoding="UTF-8"?> <frameChart> <elements shapeSize="50" /> </frameChart> </cfsavecontent>Just change 50 to whatever you would like and whatever makes sense for your data. For a complete demo, you can run this code below. It creates a fake query and then uses that to source a bar chart with 5 sets of sales figures. Note how I pass in the XML to the cfchart tag.
<cfset q = queryNew("dept,year,sales","varchar,integer,integer")> <!--- generate random sales data ---> <cfloop index="y" from="1995" to="2000"> <cfscript> queryAddRow(q); querySetCell(q, "dept", "Alpha"); querySetCell(q, "year", y); querySetCell(q, "sales", randRange(80,120)); queryAddRow(q); querySetCell(q, "dept", "Beta"); querySetCell(q, "year", y); querySetCell(q, "sales", randRange(60,100)); queryAddRow(q); querySetCell(q, "dept", "Gamma"); querySetCell(q, "year", y); querySetCell(q, "sales", randRange(80,220)); </cfscript> </cfloop>
<!--- style from webcharts ---> <cfsavecontent variable="style"> <?xml version="1.0" encoding="UTF-8"?> <frameChart> <elements shapeSize="50" /> </frameChart> </cfsavecontent>
<cfchart chartWidth="500" chartHeight="500" title="Sales by Department" style="#style#"> <cfloop index="y" from="1995" to="2000"> <cfquery name="salesdata" dbtype="query"> select * from q where [year] = <cfqueryparam cfsqltype="cf_sql_integer" value="#y#"> </cfquery> <cfchartseries type="bar" query="salesdata" itemColumn="dept" valueColumn="sales" seriesLabel="#y#" /> </cfloop>
</cfchart>