Basic attributes of the JSON format of the open flash chart

The data file must be in JSON format. The basic format of the JSON object:
{}
Write all objects in {} to make it look like the following JSON data format:
{
"Title ":{
"Text": "plain data lines ",
"Style": "{font-size: 20px; color: # 0000ff; font-family: verdana; text-align: center ;}"
}
}
Title (optional)
All attribute parameters are optional.
Text: String, title
Style: String, CSS style
Example:
{
"Title ":{
"Text": "yedeer.com.cn data line ",
"Style": "{font-size: 20px; color: #000000; font-family: verdana; text-align: center ;}"
}
}
Y_legend (optional)
All attribute parameters are optional.
Text: String, Y axis title
Style: String, CSS style
Example:
{
"Y_legend ":{
"Text": "yedeer.com.cn Chart ",
"Style": "{color: # 736aef; font-size: 12px ;}"
}
}
X axis (optional)
The attributes of this object are optional. If no attribute is specified, the default X axis attribute is used.
All optional attributes:
Stroke: Number, X axis line width
Tick-Height: Number, X axis dial line height value
Color: String, line color
Offset: Boolean. The minimum offset of the X axis in the column chart is 0.
Grid-color: String, Table Line color
3D: Boolean, set 3D
Steps: depending on the tick-height attribute
Labels: array of strings, the label of each X point
Example:
{
"X_axis ":{
"Stroke": 1,
"Tick-height": 10,
"Color": "# d000d0 ",
"Grid-color": "#00ff00 ",
"Labels": ["January," February "," March "," 0000l "," may "," June "," July "," August "," spetember "]
}
}
Y axis (optional)
The attribute should be similar to X axis (because it is not provided officially, I don't know if it is missing)
Min: integer, minimum value of Y axis
MAX: integer, Y axis maximum
Tick-length: Number, Y axis dial Length
Example:
{
"Y_axis ":{
"Stroke": 4,
"Tick-length": 3,
"Color": "# d000d0 ",
"Grid-color": "#00ff00 ",
"Offset": 0,
"Max": 20
}
}
Elements Element
The attribute of an element is a common object of an array.
The Common Object chart types are line, bar, scatter, and so on)
{
"Elements ":[
{
"Type": "bar ",
"Alpha": 0.5,
"Color": "# 9933cc ",
"Text": "page views ",
"Font-size": 10,
"Values": [, 7]
},
{
"Type": "bar ",
"Alpha": 0.5,
"Color": "# cc9933 ",
"Text": "page views 2 ",
"Font-size": 10,
"Values": [, 7]
}
]
}
Elements. Bar
The column chart must be included in the element array.
Type: string must be 'bar'
ALPHA: Number, value between 0 (transparent) and 1 (opaque)
Color: String, CSS color
Text: String, legend text
Font-size: Number. Set the font size of the legend text.
Values: array of number, the height of the column
Example:
{
"Elements ":[
{
"Type": "bar ",
"Alpha": 0.5,
"Color": "# 9933cc ",
"Text": "page views ",
"Font-size": 10,
"Values": [, 7]
}
]
}
Elements. Pie
A pie chart must be contained in an element data group.
Type: string, which must be 'pie'
Start-angle: Number, first slice Angle
Colours: array of string, CSS color
ALPHA: Number, value between 0 (transparent) and 1 (opaque)
Stroke: Number, outside slice width
Animate: Boolean, sliced chart Animation
Values: array of objects, each slice value or slice object and Value
Example:
{
"Elements ":[
{
"Type": "pie ",
"Start-angle": 180,
"Colours": ["# d01f3c", "#356aa0", "# c79810", "# 73880a", "# d15600", "#6bba70"],
"Alpha": 0.6,
"Stroke": 2,
"Animate": 1,
"Values": [, {"value": 0, "text": "zero"},]
}
]
}
Elements. hbar
Horizontal chart
Values: array of objects each value contains "right" and "Left" Optional values
Example:
{
"Elements ":[
{
"Type": "hbar ",
"Color": "# 9933cc ",
"Text": "page views ",
"Font-size": 10,
"Values": [{"right": 10 },{ "right": 15 },{ "Left": 13, "right": 17}]
}
]
}
Elements. line_dot
Linear chart
Values: array of number an array set
Example:
{
"Elements ":[
{
"Type": "line_dot ",
"Color": "# 736aff ",
"Text": "avg. Wave Height (CM )",
"Font-size": 10,
"Width": 2,
"Dot-size": 4,
"Values": [1.5, 1.69, 1.88, 2.06, 2.21, 2.34, null, 2.35, 2.23, 2.08]
}
]
}
Elements. Line *
Note: This is a simple definition of three different linear chart types (do not understand the attributes, please look up)
Example:
{
"Title ":{
"Text": "plain data lines ",
"Style": "{font-size: 30px ;}"
},

"Y_legend ":{
"Text": "Open flash Chart ",
"Style": "{font-size: 12px; color: # 736aff ;}"
},

"Elements ":[
{
"Type": "line ",
"Color": "# 9933cc ",
"Text": "page views ",
"Width": 2,
"Font-size": 10,
"Dot-size": 6,
"Values": [15,18, 19,14, 17,18, 15,18, 17]
},
{
"Type": "line_dot ",
"Color": "# cc3399 ",
"Width": 2,
"Text": "downloads ",
"Font-size": 10,
"Dot-size": 5,
"Values": [10, 12, 14, 9, 12, 13, 10, 13, 12]
},
{
"Type": "line_hollow ",
"Color": "#80a033 ",
"Width": 2,
"Text": "bounces ",
"Font-size": 10,
"Dot-size": 6,
"Values": [, 5]
}
],

"Y_axis ":{
"Max": 20
},

"X_axis ":{
"Steps": 2,
"Labels": ["January", "February", "March", "0000l", "may", "June", "July", "August ", "September"]
}
}
Example:
This is the JSON object content of a simple horizontal chart (if you do not understand the attributes, please review them up)
{
"Title ":{
"Text": "hbar Map x values ",
"Style": "{font-size: 20px; font-family: verdana; text-align: center ;}"
},

"Elements ":[
{
"Type": "hbar ",
"Color": "# 9933cc ",
"Text": "page views ",
"Font-size": 10,
"Values": [{"right": 10 },{ "right": 15 },{ "Left": 13, "right": 17}]
}
],
"X_axis ":{
"Min": 0,
"Max": 20,
"Offset": 0,
"Labels": ["A", "B", "C", "D", "E", "F", "g", "H ", "I", "J", "k", "L", "M", "n", "O", "P", "Q", "r ", "S", "T", "U", "V"]
},
"Y_axis ":{
"Stroke": 14,
"Tick-length": 30,
"Color": "# d09090 ",
"Grid-color": "#00ff00 ",
"Offset": 1,
"Labels": ["slashdot.org", "digg.com", "Reddit.com"]
}
}

 

This article from the csdn blog, reproduced please indicate the source: http://blog.csdn.net/wangwenhui11/archive/2009/06/19/4283571.aspx