The Chart Object Flash

Generator offers several types of commonly used charts. Using the Chart Object, you can make an impression by displaying your data in a high-impact visual presentation and you can do it quickly and easily.

Four different types of Chart Objects are included, each with two variations:

  • Bar
  • Line
  • Area
  • Scattered (not covered in this book)

Basic Charts, like most Generator Objects, need their own data source. However, charts have somewhat more complex Generator Panel settings than other types of objects. For the options of the Basic Charts Object see below.

All Generator Objects are modified in the Generator Panel. The options in this panel will change according to the object type.

All Generator Objects are modified in the Generator Panel

Before you decide which type of Basic Chart (Bar, Line, or Area) that you would like to create, you should analyze your data source and determine the outcome that you would like to achieve.

  • Bar Charts are ideal for change in one data value over time. For example, you can use a Bar Chart to compare the number of products sold in each month over the course of a year. Because there is a discrete number of products sold and a definitive evaluation period (for example, the end of each month), we can make comparisons of monthly sales rather quickly with a Bar Chart. As a Generator Object, Bar Charts require a Value column in the data source.
  • The value column specifies the relative height of the bar. In a Column Name/ Value layout (specified in a simple text file), our Bar Chart variable names would be described as:

    value, color, url

    where value would indicate the bar’s relative value, color would indicate that bar’s color, and url would be the URL that the bar jumps to when it is clicked.

  • Line and Area Charts can display growth data over extended periods of time, visually depicting minor fluctuations (or incremental changes). For example, you can plot the values of a stock’s price over a week, month, or year with a Line or Area Chart, seeing general trends of increased stock activity. The properties of Line and Area Charts are similar to those of a Bar Chart but only require a Value Column to define the heights of the Line Chart. You can create multiple lines in a Line Chart by specifying more than one data source; separate each data source with a semicolon character (;), as in chart_1.txt; chart_2.txt;chart_3.txt, which will create three lines using these text files as data sources.
  • Stacked Bar, Stacked Lines, and Stacked Area require a Color column as well as a series of Values columns (value1, value2, and so on). These types of charts can similar to multidimensional arrays, in that you can plot multiple values and multiple items within one data source. You can use a Stacked Bar Chart to compare your product sales to the sales of a competitor (for a given amount of time), or to compare the sales of one product line to those of another product.

Some notable properties of Basic Chart Objects are:

  • Data Source: All charts require a Column Name/Value data source, which specifies the value of each node (such as a bar or a point in a line) of the chart.
  • Plot Symbol: Even before you could use attachMovie methods in Flash, Generator enabled you to specify a symbol in the Flash file’s Library to use as the graphic for plotting points in a Scatter Chart.
  • Depth: You can create 3D charts by specifying a depth amount. One unit of depth is equal to 1/20 of a pixel (20 depth units = 1 pixel). The depth property works on all charts except Scatter Charts.
  • External Symbol File: Generator Chart Objects can use another external Generator Template, which contains the symbols to use for chart labels and values.
  • Instance Name: You can give a Chart Object (and most Generator Objects) an instance name so that it can be targeted like a Movie Clip instance with ActionScript.

Creating a Bar Chart
With these properties in mind, let’s create your first Bar Chart Template. In this lesson, you create a Bar Chart that graphs the populations of several major world cities. The data will be pulled from a simple text file.

  1. Create a new directory on your local hard drive and name it barchart.
  2. Inside this directory, create a second directory and call it data. When working with Generator, it is a good idea to keep all of your data files in one folder.
  3. Open a text editor, such as Notepad in Windows or SimpleText on the Mac, and create a new plain text file.
  4. Enter the following in the first line, noting the syntax:
  5. value, color, hlabel
  6. Save this text file as barchart.txt inside your data directory.
  7. Open Flash 5 and create a new file.
  8. Select File➪Publish Settings, and check the Generator Template option in the Format tab.
  9. Open your Generator Objects tool window (Window➪Generator Objects) and drag a Basic Chart Object onto the Stage.
  10. With the Chart Object selected, use the Arrow Tool with the Scale modifier to resize the Object to fill about two-thirds of the Stage. Chart Objects can be sized as needed.
  11. Double-click the Chart Object to open the Generator Panel. Set the properties to those listed below. Make sure you correctly set the data source as data/barchart.txt.
  12. You can control the look and feel of your Bar Chart Object in the Generator Panel.

    You can control the look and feel of your Bar Chart Object in the Generator Panel.

  13. Save the .FLA file in the barchart directory.
  14. Open your text file and fill in the following data. Be sure to type in the syntax exactly:
  15. You can designate color values with hexadecimal code or by name (Red, Green, and so on). Values must be numeric; any other values will be ignored and result in an error.

  16. Save barchart.txt in the data folder.
  17. Return to Flash and test the movie (Control➪Test Movie). Your results should resemble the Chart shown below.
  18. The completed Bar Chart Object as it appears in a generated .SWF file.

    The completed Bar Chart Object as it appears in a generated .SWF file.

You can experiment with other color values and use the Depth control in the Generator Panel to customize the look of your Chart.

Face Book Twitter Google Plus Instagram Youtube Linkedin Myspace Pinterest Soundcloud Wikipedia

All rights reserved © 2018 Wisdom IT Services India Pvt. Ltd Protection Status

Flash Topics