Products

Rob Brooks-Bilson's Blog

Home / Blogs / Rob

Viewing By Entry / Main

September 28, 2002

Working with Date Values on the Y-Axis in CFCHART

Posted At : September 28, 2002 8:28 PM | Posted By : rbils
Related Categories: cfchart,ColdFusion

I've seen a few posts from developers on the Macromedia Forums lately complaining that they can't get CFCHART to display dates on the y-axis. Since I'm finishing up the CFCHART chapter of my book right now, I decided to look into this. It turns out, that this functionality is not at all documented in any of the Macromedia documentation, nor anywhere else that I can tell. After spending a few hours trying to figure out what CFCHART could possibly want as it's date values, I finally figured it out. For some reason, you can't pass dates in formats like mm/dd/yyyy. My next thought was to try a numeric format, so I tried CF MX's new getNumericDate() funciton. That didn't work. Next, I thought of using Epoch seconds. I tried a random Epoch time, but the date CF showed in the chart was about 32 years off! After more messing around, I finally hit on the solution. You need to take your date, convert it to Epoch seconds adjusted for your UTC offset, and multiply that number by 1000. I'm not sure why you have to multiply by 1000. The only thing I can think of is that the 1000 represents milliseconds tacked on to the date. Go figure.

So, here's some code that illustrates how to make it all work:

<cfscript>
/**
* Returns the number of seconds since January 1, 1970, 00:00:00 (Epoch time).
*
* @param DateTime     Date/time object you want converted to Epoch time. (Required)
* @return Returns a numeric value.
* @author Rob Brooks-Bilson (rbils@amkor.com)
* @version 1, June 21, 2002
*/
function GetEpochTimeFromLocal() {
var datetime = 0;
if (ArrayLen(Arguments) eq 0) {
datetime = Now();
}
else {
datetime = arguments[1];
}
return DateDiff("s", DateConvert("utc2Local", "January 1 1970 00:00"), datetime);
}

/**
* Returns the number of seconds since January 1, 1970, 00:00:00
*
* @param DateTime     Date/time object you want converted to Epoch time.
* @return Returns a numeric value.
* @author Chris Mellon (mellan@mnr.org)
* @version 1, February 21, 2002
*/
function GetEpochTime() {
   var datetime = 0;
   if (ArrayLen(Arguments) is 0) {
      datetime = Now();

   }
   else {
      if (IsDate(Arguments[1])) {
         datetime = Arguments[1];
      } else {
         return NULL;
      }
   }
   return DateDiff("s", "January 1 1970 00:00", datetime);
}
</cfscript>

<CFCHART FORMAT="flash"
CHARTHEIGHT="400"
CHARTWIDTH="400"
ROTATED="No"
SCALEFROM="0"
SCALETO="999999999"
GRIDLINES="11"
SHOWXGRIDLINES="yes"
SHOWYGRIDLINES="yes"
SERIESPLACEMENT="default"
FOREGROUNDCOLOR="##000000"
BACKGROUNDCOLOR="##C0C0C0"
DATABACKGROUNDCOLOR="##0000FF"
FONT="Arial"
FONTSIZE="12"
FONTBOLD="Yes"
FONTITALIC="Yes"
SHOWBORDER="yes"
LABELFORMAT="date"
LABELMASK="ignore_me_i_dont_work"
XAXISTITLE="What"
YAXISTITLE="When"
SORTXAXIS="No"
SHOW3D="yes"
XOFFSET=".1"
YOFFSET=".1"
SHOWLEGEND="no"
TIPSTYLE="mouseOver"
TIPBGCOLOR="##008000">

<CFCHARTSERIES TYPE="bar" SERIESLABEL="Time on the Y" SERIESCOLOR="##0000FF" PAINTSTYLE="plain">
<CFCHARTDATA ITEM="Epoch " VALUE="0">
<CFCHARTDATA ITEM="Sep 28, 2002 00:00 UTC" VALUE="1033171200000"> 
<CFCHARTDATA ITEM="Sep 28, 2002 00:00 local" VALUE="1033189200000"> 

</CFCHARTSERIES>

</CFCHART>