Appboard/old/widgets/area chart - Revision history

imported>Jason.nicholls at 14:37, 17 July 2014

2014-07-17T14:37:40Z

← Older revision		Revision as of 14:37, 17 July 2014
Line 1:		Line 1:
			{{DISPLAYTITLE:Area Chart Widget}}
			[[Category:AppBoard old]]
	An Area Chart Widget is a graphical Widget that is comprised of one or more overlaid line charts, where the region between the x-axis and each line is highlighted in a different color. This format allows data from multiple sources, over time, to be displayed simultaneously in the same chart.		An Area Chart Widget is a graphical Widget that is comprised of one or more overlaid line charts, where the region between the x-axis and each line is highlighted in a different color. This format allows data from multiple sources, over time, to be displayed simultaneously in the same chart.

imported>Jason.nicholls: moved Area Chart Widget to appboard/old/widgets/area chart

2014-07-17T14:27:03Z

moved Area Chart Widget to appboard/old/widgets/area chart

← Older revision	Revision as of 14:27, 17 July 2014
(No difference)

imported>Jason.nicholls: /* How To Create an Area Chart Widget */

2014-07-17T07:01:17Z

How To Create an Area Chart Widget

← Older revision		Revision as of 07:01, 17 July 2014
Line 6:		Line 6:

	== How To Create an Area Chart Widget ==		== How To Create an Area Chart Widget ==
	For instructions on creating a Widget, see the general instructions in [[~~Widgets~~#Adding_Widgets\|Adding Widgets]]. The <b>Area</b> Widget type is located under the <b>Charts</b> category on the Widget selection screen.		For instructions on creating a Widget, see the general instructions in [[appboard/old/widgets#Adding_Widgets\|Adding Widgets]]. The <b>Area</b> Widget type is located under the <b>Charts</b> category on the Widget selection screen.


	== How To Configure an Area Chart Widget ==		== How To Configure an Area Chart Widget ==

imported>Jason.nicholls: /* Additional Configuration Steps */

2014-07-17T06:59:06Z

Additional Configuration Steps

← Older revision		Revision as of 06:59, 17 July 2014
Line 97:		Line 97:

	=== Additional Configuration Steps ===		=== Additional Configuration Steps ===
	* Provide additional configuration, if needed, on the <b>Options</b> tab. For details on the available Options, see [[~~Options~~\|Options]].		* Provide additional configuration, if needed, on the <b>Options</b> tab. For details on the available Options, see [[appboard/old/options\|Options]].

imported>Jason.nicholls: /* Additional Configuration Steps */

2014-07-17T04:14:39Z

Additional Configuration Steps

← Older revision		Revision as of 04:14, 17 July 2014
Line 101:		Line 101:

	* Enter the following information on the <b>Actions</b> tab:		* Enter the following information on the <b>Actions</b> tab:
	** Click <b>Add Event Action</b> to configure one or more [[~~Actions~~\|Actions]] to be invoked when a user clicks on the Area Chart Widget. The action will apply to the current data record being displayed.		** Click <b>Add Event Action</b> to configure one or more [[appboard/old/actions\|Actions]] to be invoked when a user clicks on the Area Chart Widget. The action will apply to the current data record being displayed.


	== Sample Data ==		== Sample Data ==

	Instructions for bringing sample chart data into AppBoard can be found here: [[Sample_Chart_Data\|Sample Chart Data]]		Instructions for bringing sample chart data into AppBoard can be found here: [[Sample_Chart_Data\|Sample Chart Data]]

imported>Jason.nicholls: /* Select a Data Collection */

2014-07-17T03:58:10Z

Select a Data Collection

← Older revision		Revision as of 03:58, 17 July 2014
Line 17:		Line 17:
	* Click the "Data Collection" pulldown, then select from the list of available Data Collections.		* Click the "Data Collection" pulldown, then select from the list of available Data Collections.
	* If you're using the sample CSV data, select "Sample.Data.ChartData".		* If you're using the sample CSV data, select "Sample.Data.ChartData".
	* If there are no Data Collections available in the pulldown, then click here for instructions on how to bring in some [[Sample_Chart_Data\|Sample Chart Data]], or refer to [[~~Data_Collections~~\|Add/Edit/Remove a Data Collection]].		* If there are no Data Collections available in the pulldown, then click here for instructions on how to bring in some [[Sample_Chart_Data\|Sample Chart Data]], or refer to [[appboard/old/data_collections\|Add/Edit/Remove a Data Collection]].


	=== Configuring the X-Axis ===		=== Configuring the X-Axis ===

imported>Johnfraleigh: /* Type */

2014-04-02T17:02:07Z

Type

← Older revision		Revision as of 17:02, 2 April 2014
Line 33:		Line 33:
	* '''LogAxis''': x-axis values are determined as a logarithmic progression between the lowest and highest values. Labels on the logarithmic axis are even powers of 10.		* '''LogAxis''': x-axis values are determined as a logarithmic progression between the lowest and highest values. Labels on the logarithmic axis are even powers of 10.
	* '''CategoryAxis''': This is the default. The "rows" observed in the selected column of data will make up the X-Axis.		* '''CategoryAxis''': This is the default. The "rows" observed in the selected column of data will make up the X-Axis.
	* '''DateTimeAxis''': x-axis values are determined as time-based values such as hours, days, weeks, or years~~. This value can be chosen or "auto" can be used to let the widget decide the best value to use. An option to change the date-time format is also available~~.		* '''DateTimeAxis''': x-axis values are determined as time-based values such as hours, days, weeks, or years.

	=== Configuring a Series (Y-Axis) ===		=== Configuring a Series (Y-Axis) ===

imported>Johnfraleigh: /* Type */

2014-04-02T16:52:48Z

Type

← Older revision		Revision as of 16:52, 2 April 2014
Line 33:		Line 33:
	* '''LogAxis''': x-axis values are determined as a logarithmic progression between the lowest and highest values. Labels on the logarithmic axis are even powers of 10.		* '''LogAxis''': x-axis values are determined as a logarithmic progression between the lowest and highest values. Labels on the logarithmic axis are even powers of 10.
	* '''CategoryAxis''': This is the default. The "rows" observed in the selected column of data will make up the X-Axis.		* '''CategoryAxis''': This is the default. The "rows" observed in the selected column of data will make up the X-Axis.
	* '''DateTimeAxis''': x-axis values are determined as time-based values such as hours, days, weeks, or years.		* '''DateTimeAxis''': x-axis values are determined as time-based values such as hours, days, weeks, or years. This value can be chosen or "auto" can be used to let the widget decide the best value to use. An option to change the date-time format is also available.


	=== Configuring a Series (Y-Axis) ===		=== Configuring a Series (Y-Axis) ===

imported>Jason.nicholls: /* Series Type */

2013-08-27T15:31:47Z

Series Type

← Older revision		Revision as of 15:31, 27 August 2013
Line 88:		Line 88:
	* '''stacked''': Chart elements for each series are stacked cumulatively above each other. Each element represents the cumulative value of the elements beneath it.		* '''stacked''': Chart elements for each series are stacked cumulatively above each other. Each element represents the cumulative value of the elements beneath it.
	* '''100%''': Chart elements are stacked cumulatively above each other, adding up to 100%. Each chart element represents the percentage that the value contributes to the sum of the values for that category.		* '''100%''': Chart elements are stacked cumulatively above each other, adding up to 100%. Each chart element represents the percentage that the value contributes to the sum of the values for that category.
	[[Image:~~areaChart_seriesTypes~~.png\|Sample Area Series Types]]		[[Image:AreaChart_seriesTypes.png\|Sample Area Series Types]]


	=== Additional Area Chart Options ===		=== Additional Area Chart Options ===

imported>Jason.nicholls at 15:19, 27 August 2013

2013-08-27T15:19:06Z

← Older revision		Revision as of 15:19, 27 August 2013
Line 2:		Line 2:


	[[Image:~~areaChartSample~~.png\|thumb\|center\|500px\|Area Chart Sample]]		[[Image:AreaChartSample.png\|thumb\|center\|500px\|Area Chart Sample]]


Line 58:		Line 58:


	[[Image:~~areaChart_Form~~.png\|Sample Area Chart Forms]]		[[Image:AreaChart_Form.png\|Sample Area Chart Forms]]


Line 64:		Line 64:
	* Fill style is purely aesthetic, and sets the rendering style that will be used for the series.		* Fill style is purely aesthetic, and sets the rendering style that will be used for the series.
	* The available rendering styles are Solid and Gradient.		* The available rendering styles are Solid and Gradient.
	[[Image:~~areaChart~~.png\|Sample Area Chart]]		[[Image:AreaChart.png\|Sample Area Chart]]


Line 80:		Line 80:
	* Alpha sets the opacity of the series and can be adjusted for both Color and Pattern.		* Alpha sets the opacity of the series and can be adjusted for both Color and Pattern.
	* Reducing the Alpha lets you see grid lines show through the columns.		* Reducing the Alpha lets you see grid lines show through the columns.
	[[Image:~~areaChart_Alpha~~.png\|Sample Area Alpha]]		[[Image:AreaChart_Alpha.png\|Sample Area Alpha]]