Bar Charts: Chart Properties (Pre-Summer 2005 only)

NOTE: This topic applies only to versions of the Chart Display Advanced web part from before the Summer 2005 release. If you are working with Summer 2005 or a later release, please see “Admin:Display Tab” instead.

CorasWorks utilizes a product called Chart Director to maintain charts. Because of this, some portions of this help will mention the Chart Director product. Chart Director creates each chart and the CorasWorks web part then displays the chart to the user.

By default, these settings will be set up for a standard Task list the first time you choose a chart.

Chart Data

The Chart Data text box is used to define the data and formats used within the chart.

There are five parameters that can be set to be rendered into a bar chart. Each grouping of parameters is preceded with a <Group> tag, indicating a new data stream. [? Flash]

To display all of the calculations as a percentage of the total results, place a <Percentage> tag prior to the first group.
[? Flash]

Example: Two Items Returned [? Flash]

Format: <Group>Parameter 1;Parameter2;Parameter3;Parameter4;Parameter5<Group>Parameter 1;Parameter2;Parameter3;Parameter4;Parameter5
Data: <Group>
Not Started;Count(Title);Status='Not Started';0xCC0000;50<Group>In Progress;Count(Title);Status='In Progress';0x000099;40

Example: Two Items Returned - Percentage [? Flash]

Format: <Percentage><Group>Parameter 1;Parameter2;Parameter3;Parameter4;Parameter5<Group>Parameter 1;Parameter2;Parameter3;Parameter4;Parameter5
Data: <Percentage><Group>Not Started;Count(Title);Status='Not Started';0xCC0000;50<Group>In Progress;Count(Title);Status='In Progress';0x000099;40

Parameter 1 - Data Title - String (Required) [? Flash]

This parameter defines title to display for each data element returned.
Examples: Not Started, In Progress, Completed

Parameter 2 - Data Type - String (Required) [? Flash]

This parameter defines the data type that will be returned. You can have the data counted, summed up, or averaged, or just return the value of a specific field. If you choose Average, Sum, or Return Value, the field type must be Integer, otherwise no data will be returned. If you choose Count, the total number of items returned will be returned, which doesn't require the field to be of an integer type.

Notice in the example below that field names that include a space or special character need to be placed within a "[" and "]" in order to be recognized.
Examples: Count(Title), or Avg([% Complete]), or Sum([Parts Sold]), or [% Complete]

Calculated fields are not supported.

Parameter 3 - Data Filter - String (Required) [? Flash]

This is the filter that is used to return the proper items from the lists. The format for a filter is "Field=SearchText" (Example: Postal Code=11111) with no spaces between the field and the search text. Complex filters are not supported here. You can use > and < when filtering date fields. (Example: "Date<7" will return items that are older than 7 days from today). Filter grouping with parentheses () is not permitted.

The fields available for filtering are identified in the Supported Schemas section of this help, on the “Filterable Fields” line of each identified schema. If you have created your own schema, you can filter on any fields that you have defined as display fields or search fields.

Parameter 4 - Data Color - Hex RGB Value (Optional) [? Flash]

This parameter defines the color the data field will be displayed in. Standard charts begin with red and end with yellow, but these colors can be altered. If nothing is entered here, red will be utilized as the default color. Any value entered here must be in HEX format, or an error will occur. To see a list of available colors, refer to the RGB Color Table.
Examples: 0xcc0000, or 0x990099, or 0x000000

Back to Top

 

Chart Properties

The Chart Properties text box is used to define several properties for the chart such as font color, header color, and so on. All parameters are optional, but certain parameter settings may become required if the next setting is entered.

12 chart property parameters are available for bar charts. Each parameter is separated by a semicolon (;).

All settings within a parameter must be separated by a comma (,). The comma signifies the next setting. If you choose not to define an optional setting, it is not necessary to place any data between the first comma and the next comma.

Format: P1-Setting1,P1-Setting2,P1-Setting3,P1-setting4,P1-Setting5;P2-Setting1,P2-Setting2,P2-Setting3;P3-Setting1,P3-Setting2,P3-Setting3,P3-Setting4,P3-Setting5;P4-Setting1,P4-Setting2,P4-Setting3;P5-Setting1,P5-Setting2,P5-Setting3,P5-Setting4,P5-Setting5;P6-Setting1,P6-Setting2;P7-Setting1,P7-Setting2,P7-Setting3,P7-Setting4;P8;P9;P10;P11;P12
Example: 2D Horizontal Bar Chart,arialbd.ttf,10,0x000000,0xcc0000;arial.ttf,10,0xCC0000;Status,arialbd.ttf,10,0xCC0000,%{label};arial.ttf,10,0x990000;Percentage,arialbd.ttf,10,0x990000,%{label};500,250;40,80,400,250;true;true;highest;${value};false

Parameter 1 - Chart Title - (Optional)

The settings within this parameter define the content and format of the chart title.
Example: 2D Horizontal Bar Chart,arialbd.ttf,10,0x000000,0xcc0000
Result: 2D Horizontal Bar Chart

Setting 1 - Chart Title - String (Optional)

This the title that will be displayed at the top of the chart.
Examples: 2D Horizontal Bar Chart, Status of Current Projects, or Customer Satisfaction Levels

Setting 2 - Font Type - String (Optional)

This defines the font used to display the chart title.  To see how you can change the font type, go to Font Properties.

Setting 3 - Font Size - Integer (Optional - Required if Setting 4)

This defines the size of the font used to display the chart title. This field is required if the Font Color (Setting 4) is defined.
Examples: 15, or 16, or 20, or 10

Setting 4 - Font Color - Hex RGB Value (Optional)

This defines the font color that the Chart Title will be displayed in. If you enter a value here, it must be in HEX format, or an error will occur. To see a list of available colors, see to the RGB Color Table.
Examples: 0xcc0000, or 0x990099, or 0x000000

Setting 5 - Title BG Color - Hex RGB Value (Optional)

This defines the background color to be used behind the Chart Title.  If you enter a value here, it must in HEX format, or an error will occur. To see a list of available colors, see to the RGB Color Table.
Examples: 0xcc0000, or 0x990099, or 0x000000

Parameter 2 - X Data Value Font - (Optional)

The settings within this parameter are used to define the font style, color, and type used for data on the X axis of the bar chart. 
Example: arial.ttf,10,0xCC0000
Result: Not Started

Setting 1 - X Font Type - String (Optional)

This setting is used to define the font used to display data values on the X axis of the bar chart.  To see how you can change the font type, go to Font Properties.

Setting 2 - X Font Size - Integer (Optional - Required if Setting 4)

This setting is used to define the font size used to display data values on the X axis of the bar chart.  This field is required if the Font Color (Setting 3) is defined.
Examples: 15, or 16, or 20, or 10

Setting 3 - X Font Color - Hex RGB Value (Optional)

This defines the color that the data values on the X axis of the bar chart will be displayed in. If you enter a value here, it must in HEX format, or an error will occur. To see a list of available colors, see the RGB Color Table.
Examples: 0xcc0000, or 0x990099, or 0x000000

Parameter 3 - X Data Value Header - (Optional)

The settings in this parameter define the content and format of label used on the X axis of the bar chart..
Example: Status,arialbd.ttf,10,0x990000,%{label}
Result: Status

Setting 1 - X Data Value Header Title - String (Optional)

This defines the title that will be displayed next to the values on the X axis.
Examples: Percentage, Status, or Number of Units Sold

Setting 2 - X Data Value Header Font Type - String (Optional)

This defines the font used to display the X axis label. To see how you can change the font type, go to Font Properties.

Setting 3 - X Data Value Header Font Size - Integer (Optional - Required if Setting 4)

This defines the size of the font used to display the X axis label. This field will be required if the X Data Value Header Font Color (Setting 4) is defined.
Examples: 15, or 16, or 20, or 10

Setting 4 - X Data Value Header Font Color - Hex RGB Value (Optional)

This defines the font color that the x axis label will be displayed in. If you enter a value here, it must be in HEX format, or an error will occur. To see a list of available colors, see to the RGB Color Table.
Examples: 0xcc0000, or 0x990099, or 0x000000

Setting 5 - X Data Value Line Text - Hex RGB Value (Optional)

This setting allows you to define the format of the data labels provided on the X axis of the bar chart. For instance, say you want to display a percentage range from 1-100 (so the labels would be 20%-40%-60%-80%-100%). In this example, you would use {value} %.
Example: {value}%, ${value}

To learn more about value substitution, see Substitution Properties.

Parameter 4 - Y Data Value Font - (Optional)

The settings within this parameter are used to define the font style, color, and type used for data on the Y axis of the bar chart. 
Example: arial.ttf,10,0x990000
Result: 20%

Setting 1 - Y Font Type - String (Optional)

This is used to define the font used to display data values on the Y axis of the bar chart. To see how you can change the font type, go to Font Properties.

Setting 2 - Y Font Size - Integer (Optional - Required if Setting 3)

This setting is used to define the font size used to display data values on the Y axis of the bar chart. This field is required if the Y Font Color (Setting 3) is defined.
Examples: 15, or 16, or 20, or 10

Setting 3 - Y Font Color - Hex RGB Value (Optional)

This defines the font color that the data values on the Y axis of the bar chart will be displayed in. If you enter a value here, it must be in HEX format, or an error will occur. To see a list of available colors, see the RGB Color Table.
Examples: 0xcc0000, or 0x990099, or 0x000000

Parameter 5 - Y Data Value Header - (Optional)

The settings in this parameter define the content and format of label used on the Y axis of the bar chart.
Example: Status,arialbd.ttf,10,0x990000,%{label}
Result: Status

Setting 1 - Y Data Value Header Title - String (Optional)

This defines the title that will be displayed next to the values on the Y axis of the chart.
Examples: Percentage, Status, or Number of Units Sold

Setting 2 - Y Data Value Header Font Type - String (Optional)

This defines the font used to display the Y axis label. To see how you can change the font type, go to Font Properties.

Setting 3 - Y Data Value Header Font Size - Integer (Optional - Required if Setting 4)

This defines the size of the font used to display the Y axis label. This field will be required if the Y Data Value Header Font Color (Setting 4) is defined.
Examples: 15, or 16, or 20, or 10

Setting 4 - Y Data Value Header Font Color - Hex RGB Value (Optional)

This defines the font color that the Y axis label will be displayed in. If you enter a value here, it must be in HEX format, or an error will occur. To see a list of available colors, go to the RGB Color Table.
Examples: 0xcc0000, or 0x990099, or 0x000000

Setting 5 - Y Data Value Line Text - Hex RGB Value (Optional)

This setting allows you to define the format of the data labels provided on the Y axis of the bar chart. For instance, say you want to display a percentage range from 1-100 (so the labels would be 20%-40%-60%-80%-100%). In this example, you would use {value} %.
Example: {value}%, ${value}

To learn more about value substitution, see Parameter Substitution Properties.

Parameter 6 - Image Width & Height - (Optional)

This parameter is used to define the width and height of the bar chart.
Example: 500,250

Setting 1 - Image Width - Integer (Optional)

This setting allows you to change the width of the chart display. While this doesn't control the width of the bar chart itself, it does control the complete image width displayed to the user.
Examples: 500, or 400, or 300, or 350

Setting 2 - Image Height - Integer (Optional)

This setting allows you to change the height of the chart display. While this doesn't control the height of the bar chart itself, it does control the complete height displayed to the user.
Examples: 250, or 100, or 500, or 325

Parameter 7 - Bar Chart Position and Size - (Optional)

The settings within this parameter allow you to alter the location of the bar chart within the image.
Example: 40,80,400,250

Setting 1 - Bar Chart X Location - Integer (Optional)

This setting allows you to change the X coordinate location of where the bar chart display will begin. If you choose to utilize an X Value Data Header, you will need to leave room for this to be included in the image.
Examples: 250, or 300, or 125, or 400

Setting 2 - Bar Chart Y Location - Integer (Optional)

This setting allows you to change the Y coordinate location of where the bar chart display will begin. If you choose to have a Y Value Data Header, you will need to leave room for this to be included in the image.
Examples: 125, or 150, or 175, or 200

Setting 3 - Bar Chart Width - Integer (Optional)

This setting allows you to define the width of the bar chart display within the image. If you take the total image width (defined in Parameter 6) and subtract the “Bar Chart X Location” value, you should be able to calculate this number to fill the remainder of the image width.
Examples: 125, or 150, or 175, or 200

Setting 4 - Bar Chart Height - Integer (Optional)

This setting allows you to define the height of the bar chart display within the image. If you take the total image height (defined in Parameter 6) and subtract the “Bar Chart Y Location” value, you should be able to calculate this number to fill the remainder of the image height.
Examples: 125, or 150, or 175, or 200

Parameter 8 - Implement Aggregate Value Display - Boolean (Optional)

If this is set to true, the bar chart will present an aggregate value at the end of the value bar. If this is set to false, no aggregate text will be used.
Example: true

Parameter 9 - Implement 20% Transparency on Colors - Boolean (Optional)

If this is set to true, all of the bar chart colors will be faded by 20% to show a transparent effect. If set to false, all of the colors will be opaque.
Example: true

Parameter 10 - Highest Value Expression - String (Optional)

When creating a bar chart, the highest value used is usually where the bar chart X value or Y value will end. However, this may not be good for you if, for example, you want to display a static number, a total count of items, a sum of items, or the highest item. With this in mind, you can utilize one of four different variables to create the desired result:
Value 1: Total Count of Items Returned for Each Filter - count (Example: count)
Value 2: Sum/Average/Count/Min/Max of Items Returned for Each Filter - Sum(Field), Avg(Field), Count(Field), Min(Field), Max(Field) (Example: Sum(Server Count))
Value 3: Highest Number Returned in Values Displayed - highest (Example: highest)
Value 4: Static Number - number (Example: 100,000)

Parameter 11 - Aggregate Value Display Format - String (Optional)

This setting allows you to change the format of the Aggregate Value displayed at the end of each (?) bar in the bar chart. For instance, if you wanted to display the Aggregate Value as a percentage, you would use {value} %.
Example: {value}%, ${value}

Parameter 12 - Use Default Colors - Boolean (Optional)

If this is set to true, the bar chart will use its default colors for separation. If set to false, either the default color of red will be used, or a predefined color if one is set in the Chart Data text box.
Example: false

Back to Top

 

Chart URL

The Chart URL text box represents the Anchor Tag and Alt Tag that are utilized in the image map that is created for the chart. The format for the data within this text box is "parameter1;parameter2". For example: "http://www.corasworks.net;title='Web Site Count {value}'

Parameter 1 (URL) - String (Optional) [? Flash]

This parameter defines the URL the chart will link to when a user clicks on a piece of data in the chart. “Use Relative URL” will not affect this property.

Parameter 2 (ALT Text Design) - String (Optional) [? Flash]

This parameter allows you to define the text that is displayed when an individual moves their mouse over a chart and a link is displayed. You just need to implement the proper variables within the title tag. As an example, title='${value}' would return the data value with a $ symbol in front.

To learn more about Value Substitution see Parameter Substitution Properties.

Back to Top