FusionCharts 是最近 Fox 正在使用的統計圖表套件，
Fox是外貌協會，故FusionCharts 當然有一定的美觀度~
免費版有22種圖型可使用，付費版 ($49.99 US) 有44種可用，且可用參數及支援度也更高
以下是目前免費版的參數整理。
PS.目前免費版的Y軸中文支援仍無切確解，聽說用rotateYAxisName='0' 就可以了，但此設定只在付費版有用
reference...http://www.cn-web.com/cnweb/0/781/article/781.html
官方提供免費版本→ http://www.fusioncharts.com/free/docs/Contents/ChartList.html
付費版本demo→http://www.fusioncharts.com/LiveDemos.asp
Functional Properties
These properties/parameters let us control a variety of functional elements on the chart. For example, we can opt to show/hide data labels, data values, y-axis values. We can also set chart limits and extended properties.
| Name | Range/Example | Description |
| animation | Range: 0/1 Example : animation=1 |
This parameter lets us set the configuration whether the chart should appear in an animated fashion. If we do not want to animate any part of the chart, set this as 0. |
| showNames | Range: 0/1 | It sets the configuration whether the x-axis labels will be displayed or not. |
| rotateNames | Range: 0/1 | This parameter lets us set whether the data labels would show up as rotated labels on the chart. |
| showValues | Range: 0/1 | Sets the configuration whether data values would be displayed along with the data plot on chart. |
| yAxisMinvalue | yAxisMinvalue=10 | This parameter helps us explicitly set the lower limit of the chart. If we don't specify this value, it is automatically calculated by FusionCharts based on the data provided by us. |
| yAxisMaxValue | yAxisMaxValue=200 | This parameter helps us explicitly set the upper limit of the chart. If we don't specify this value, it is automatically calculated by FusionCharts based on the data provided by us. |
| showLimits | Range: 0/1 | Whether to show chart limit values? |
For details and samples please refer to Query String Elements section.
Chart Titles and Axis Names
Using these properties, we can set the various headings and titles of chart like caption, sub-caption, x-axis and y-axis names etc.
| Name | Range/Example | Description |
| caption | caption=Weekly Sales | Caption of the chart. |
| subCaption | subCaption=January | Sub-caption of the chart. |
| xAxisName | xAxisName=Week | X-Axis Title of the Chart. |
| yAxisName | yAxisName=Sales | Y-Axis Title of the Chart. |
Chart and Canvas Cosmetics
The following parameters let us configure chart cosmetics like background color, background alpha, canvas color & alpha etc.
| Name | Range/Example | Description |
| bgColor | Range :HexColorCode Example : bgColor=EFEFEF |
This parameter sets the background color for the chart. We can set any hex color code as the value of this parameter. Remember to remove # and any spaces in between. |
| canvasBgColor | HexColorCode | Sets Canvas background color. |
| canvasBgAlpha | Range: 0-100 | This parameter helps us set the alpha (transparency) of the canvas. |
| canvasBorderColor | HexColorCode | This parameter helps us set the border color of the canvas. |
| canvasBorderThickness | Range: 0-100 | This parameter helps us set the border thickness (in pixels) of the canvas. |
For details and samples please refer to Query String Elements Section.
Font Properties
Using the parameters below, we can define the generic font properties for all the text on the chart. These parameters allow us a high level control over font properties.
| Name | Range/Example | Description |
| baseFont | baseFont=Arial | This parameter lets us set the font face (family) of all the text (data labels, values etc.) on chart. If we also specify outCnvBaseFont parameter, this parameter controls only the font face of text within the chart canvas bounds. |
| baseFontSize | baseFontSize=13 | This parameter sets the base font size of the chart i.e. all the values and the names in the chart which lie on the canvas will be displayed using the font size provided here. |
| baseFontColor | HexColorCode | This parameter sets the base font color of the chart i.e. all the values and the names in the chart which lie on the canvas will be displayed using the font color provided here. |
| outCnvBaseFont | outCnvBaseFont=Tahoma | This parameter sets the base font family of the chart font which lies outside the canvas i.e. all the values and the names in the chart which lie outside the canvas will be displayed using the font name provided here. |
| outCnvBaseFontSize | outCnvBaseFontSize=15 | This parameter sets the base font size of the chart i.e. all the values and the names in the chart which lie outside the canvas will be displayed using the font size provided here. |
| outCnvBaseFontColor | HexColorCode | This parameter sets the base font color of the chart i.e. all the values and the names in the chart which lie outside the canvas will be displayed using the font color provided here. |
Divisional Lines & Grids
Using this set of parameters, we can control the properties of divisional lines, zero plane and alternate color bands. Divisional Lines are horizontal or vertical lines running through the canvas. Each divisional line signifies a smaller unit of the entire axis thus aiding the users in interpreting the chart. The zero plane is a 2D/3D plane that signifies the 0 position on the chart. If there are no negative numbers on the chart, we won't see a visible zero plane. Alternate color bands are colored blocks between two successive divisional lines.
| Name | Range/Example | Description |
| numDivLines | numDivLines=6 | Number of horizontal axis division lines that we want on the chart. |
| divLineColor | HexColorCode | Color for divisional lines. |
| divLineThickness | Range: 1-5 Example : divLineThickness=3 |
Thickness of divisional lines. |
| divLineAlpha | Range: 0-100 | Alpha of divisional lines. |
| showAlternateHGridColor | Range: 0/1 | Whether to show alternate colored horizontal grid bands? |
| alternateHGridColor | HexColorCode | Color of the alternate horizontal grid bands. |
| alternateHGridAlpha | Range: 0-100 | Alpha (transparency) of the alternate horizontal grid bands. |
| showDivLineValues | Range: 0/1 | Whether to show div line values? |
| numVDivLines | numVDivLines=5 | Sets the number of vertical divisional lines to be drawn. |
| vDivLineColor | HexColorCode | Color of vertical axis division lines. |
| vDivLineThickness | Range: 1-5 | Thickness of vertical axis division lines. In Pixel |
| vDivLineAlpha | Range: 0-100 | Alpha of vertical axis division lines. |
| showAlternateVGridColor | Range: 0/1 | Whether to show alternate vertical colored grid bands? |
| alternateVGridColor | HexColorCode | Color of alternate vertical colored grid bands. |
| alternateVGridAlpha | Range: 0-100 | Alpha (transparency) of the alternate vertical grid bands. |
Number Formatting
FusionCharts v3 offers a lot of options to format numbers on the chart. Using the parameters below, we can control a myriad of options like: Formatting of commas and decimals Number prefixes and suffixes Decimal places to which the numbers would round to Scaling of numbers based on a user defined scale Custom number input formats.
| Name | Range/Example | Description |
| numberPrefix | numberPrefix=$ | Using this parameter, we could add prefix to all the numbers visible on the graph. For example, to represent all dollars figure on the chart, we could specify this parameter to ' $' to show like $40000, $50000. For more details, please see Advanced Charting >Number Formatting page . . |
| numberSuffix | numberSuffix=/a | Using this parameter, we could add suffix to all the numbers visible on the graph. For example, to represent all figure quantified as per annum on the chart, we could specify this parameter to ' /a' to show like 40000/a, 50000/a. For more details, please see Advanced Charting >Number Formatting page . |
| formatNumberScale | Range: 0/1 | Configuration whether to add K (thousands) and M (millions) to a number after truncating and rounding it - e.g., if formatNumberScale
is set to 1, 1043 would become 1.04K (with decimals set to 2 places).
Same with numbers in millions - a M will added at the end. For more
details, please see Advanced Charting >Number Formatting page. |
| decimalPrecision | Range: 0-10 | Number of decimal places to which all numbers on the chart would be rounded to. |
| divLineDecimalPrecision | Range: 0-10 | Number of decimal places to which all divisional line (horizontal) values on the chart would be rounded to. |
| limitsDecimalPrecision | Range: 0-10 | Number of decimal places to which upper and lower limit values on the chart would be rounded to. |
Hover caption
The hover caption is the tool tip which shows up when the user moves his mouse over a particular data item (column, line, pie, bar etc.).
| Name | Range/Example | Description |
| showhovercap | Range: 0/1 | Option whether to show/hide hover caption box. 0 sets the tool-tips off, while 1 sets the tool-tips on. |
| hoverCapBgColor | HexColorCode | Background color of the hover caption box. |
| hoverCapBorderColor | HexColorCode | Border color of the hover caption box. |
| hoverCapSepChar | hoverCapSepChar=* | The character specified as the value of this parameter separates the name and value displayed in the hover caption box. The default value is a comma (,). |
留言列表
♡Beauty♡ (4)
