Welcome!

ColdFusion Authors: Yakov Fain, Pat Romanski, Liz McMillan, Maureen O'Gara, Greg Ness

Related Topics: ColdFusion

ColdFusion: Article

Coldfusion & Generator Stock Charts

Coldfusion & Generator Stock Charts

Since my first article on Generator in CFDJ (Vol. 1, issue 5), Macromedia has released version 2. With this version you have full Flash 4 functionality and a host of new Generator objects to use, from tickers to tables. What I'll show in this article is the combination of Flash and another new object, Stock Chart.

Stock Chart Object
The Stock Chart object will give us a stock chart graph just like those you see on the big commercial Web sites that track stock data. This object gives us several options, such as "candle" graphs and display and color options. I'll cover these in detail later in the article.

Creating the Stock Object in Flash
Open up Flash (Generator objects are now freely available on the Macromedia Web site) and choose Window - Generator Objects from the menu. Here you'll be presented with Generator objects all lined up in a toolbar. What interests us is the Stock Chart object.

Drag the object onto your movie and the object's properties menu will open up.

Stock Chart Data Source
The format for Generator objects changes from object to object. The Stock Chart object's data source has the following format.

open, close, high, low, HLABEL
34, 38, 40, 31, Monday
38, 45, 48, 37, Tuesday
45, 40, 45, 36, Wednesday
40, 32, 42, 27, Thursday
32, 36, 42, 29, Friday

Each value represents a value for a given day - for example, for Monday its opening and closing values and its high and low values, data that's required for stock chart value for a given day. To show this off I'll first demonstrate how it's used with a text file.

Using a Text File with a Stock Chart Object
First, create the text file, then modify the data source of the Stock Chart object to point to it. To do this, make sure that your object's properties window is open (double-click on the Stock Chart object in your movie) and open up the datasource window by clicking the little button in the datasource property.

Next, type the path to the data text file (i.e., C:\myfiles\data.txt) and click OK (if you've saved the Flash File in the same directory as the text file, you don't need to type the path, i.e., data.txt).

Testing the Movie in Flash
Before we can run our Generator file, we first have to set up Flash. Open the Publish Settings box by selecting File - Publish Settings. Make sure that Generator is selected before you press OK.

To run our movie, choose Control - Test Menu from the menu options and your movie will look like Figure 1.

To make the chart a little easier to read, change the following values in the movie's properties.

Your chart will now look like the chart shown in Figure 2.Using ColdFusion with the Stock Chart Object
We can now replace our text file data source with a ColdFusion data source. To do so I'll create a database data source and use ColdFusion to read the data and format it for Generator to use. Database Data Source

I created the data source in an Access Database as shown in Figure 3.

The CFM Code
The next step is use ColdFusion code to read the database and format the data in a format that Generator will understand; we're really trying to emulate the text file data source that we used earlier.

<cfquery name="stock1" data source="kimmuli" dbtype="ODBC">
SELECT open, close, high, low, HLABEL
FROM stock
</cfquery>
<cfcontent type="text/plain">open,close,
high,low,HLABEL
<cfoutput query="stock1">#open#, #close#, #high#, #low#, #HLABEL#
</cfoutput>

The code reads the database and displays it in a text format. Note the lack of HTML code in the code. This is because the data source can't contain characters other than those needed to be present in the data source (HTML characters would cause errors). If you do need other characters, it's possible to use escape codes. See the Macromedia Generator support site technotes for details.

Adding the CFM File to the Data Source
The final step is to add the CFM page to the Generator data source of our Stock Object, as shown in Figure 4.

Note that you must use the full HTTP path to the CFM file. Once you've added the file, clicked OK and tested it, you should see something like Figure 5.

A nice feature of Flash is the ability to test out all the elements of your Generator object before you test them on your Web site. Remember to change the formatting of the Stock Object as I did, using the text example at the start of this article.

Summary
Generator 2 has many new features, and one of the most visually appealing is the Stock Chart. Here I've shown how you could use either a text file or a Database/CFM page to get the data to the Stock Chart.

More Stories By Andrew Stopford

Andrew Stopford is a Web developer and
consultant from south Manchester in the UK and a Macromedia
evangelist for Generator. He has lent his hand to many Generator sites around the world. Andrew's kept busy answering questions that the Generator community posts in the Macromedia Generator NG and other information sites. He's also the creator of Kimmuli, a code tool for Generator.

Comments (0)

Share your thoughts on this story.

Add your comment
You must be signed in to add a comment. Sign-in | Register

In accordance with our Comment Policy, we encourage comments that are on topic, relevant and to-the-point. We will remove comments that include profanity, personal attacks, racial slurs, threats of violence, or other inappropriate material that violates our Terms and Conditions, and will block users who make repeated violations. We ask all readers to expect diversity of opinion and to treat one another with dignity and respect.