您的位置：首页 > 运维架构

Open Flash Chart 图表组件

2013-01-29 16:47 495 查看

Open Flash Chart 图表组件

下载：http://teethgrinder.co.uk/open-flash-chart/

data-files里是各种实例文件，调用即可预览。

实例：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

<title>ofc2</title>

<script type="text/javascript" src="swfobject.js"></script>

</head>

<body>

<p><strong>例子：</strong></p><div id="my_chart"></div>

<script type="text/javascript">

//swfobject.embedSWF("open-flash-chart.swf", "my_chart", "550", "200", "9.0.0", "expressInstall.swf", {"data-file":"data.txt"} );

swfobject.embedSWF("open-flash-chart.swf", "my_chart", "550", "200", "9.0.0", "expressInstall.swf", {"data-file":"data.asp"} );

</script>

</body>

</html>

data.txt

{

"y_legend":{

"text":"Timeofday",

"style":"{color:#736AFF;}"

},

"elements":[

{

"type":"line",

"colour":"#736AFF",

"text":"Avg.waveheight(cm)",

"font-size":10,

"width":2,

"dot-size":4,

"halo-size":0,

"values":

[1.5,1.69,1.88,2.06,2.21,2.34,2.43,2.48,2.49,2.47,2.40,2.30,2.17,2.01,1.83,1.64,1.44,1.24,1.05,0.88,0.74,0.62,0.54,0.50,0.50,0.54,0.61,0.72,0.86,1.03,1.22,1.41,1.61,1.81,1.99,2.15,2.29,2.39,2.46,2.49,2.48,{"value":2.44,"colour":"#FF0000","tip":"monkies"},2.35,2.23,2.08]

}

],

"x_axis":{

"labels":{

"rotate":"vertical",

"labels":["2:00am","2:10","2:20","2:30","2:40","2:50",

"3:00am","3:10","3:20","3:30","3:40","3:50",

"4:00am","4:10","4:20","4:30","4:40","4:50",

"5:00am","5:10","5:20","5:30","5:40","5:50",

"6:00am","6:10","6:20","6:30","6:40","6:50",

"7:00am","7:10","7:20","7:30","7:40","7:50",

"8:00am","8:10","8:20","8:30","8:40","8:50",

"9:00am","9:10","9:20"]

}

},

"y_axis":{

"max":3

}}

data.asp

<%

data="{"&Chr(10)

data=data&"""y_legend"":{"&Chr(10)

data=data&"""text"":""Timeofday"","&Chr(10)

data=data&"""style"":""{color:#736AFF;}"""&Chr(10)

data=data&"},"&Chr(10)

data=data&"""elements"":["&Chr(10)

data=data&"{"&Chr(10)

data=data&"""type"":""line"","&Chr(10)

data=data&"""colour"":""#736AFF"","&Chr(10)

data=data&"""text"":""Avg.waveheight(cm)"","&Chr(10)

data=data&"""font-size"":10,"&Chr(10)

data=data&"""width"":2,"&Chr(10)

data=data&"""dot-size"":4,"&Chr(10)

data=data&"""halo-size"":0,"&Chr(10)

data=data&"""values"":"&Chr(10)

data=data&"[1.5,1.69,1.88,2.06,2.21,2.34,2.43,2.48,2.49,2.47,2.40,2.30,2.17,2.01,1.83,1.64,1.44,1.24,1.05,0.88,0.74,0.62,0.54,0.50,0.50,0.54,0.61,0.72,0.86,1.03,1.22,1.41,1.61,1.81,1.99,2.15,2.29,2.39,2.46,2.49,2.48,{""value"":2.44,""colour"":""#FF0000"",""tip"":""monkies""},2.35,2.23,2.08]"&Chr(10)

data=data&"}"&Chr(10)

data=data&"],"&Chr(10)

data=data&"""x_axis"":{"&Chr(10)

data=data&"""labels"":{"&Chr(10)

data=data&"""rotate"":""vertical"","&Chr(10)

data=data&"""labels"":[""2:00am"",""2:10"",""2:20"",""2:30"",""2:40"",""2:50"","&Chr(10)

data=data&"""3:00am"",""3:10"",""3:20"",""3:30"",""3:40"",""3:50"","&Chr(10)

data=data&"""4:00am"",""4:10"",""4:20"",""4:30"",""4:40"",""4:50"","&Chr(10)

data=data&"""5:00am"",""5:10"",""5:20"",""5:30"",""5:40"",""5:50"","&Chr(10)

data=data&"""6:00am"",""6:10"",""6:20"",""6:30"",""6:40"",""6:50"","&Chr(10)

data=data&"""7:00am"",""7:10"",""7:20"",""7:30"",""7:40"",""7:50"","&Chr(10)

data=data&"""8:00am"",""8:10"",""8:20"",""8:30"",""8:40"",""8:50"","&Chr(10)

data=data&"""9:00am"",""9:10"",""9:20""]"&Chr(10)

data=data&"}"&Chr(10)

data=data&"},"&Chr(10)

data=data&"""y_axis"":{"&Chr(10)

data=data&"""max"":3"&Chr(10)

data=data&"}}"

Response.Write data

%>

open flash chart 参数详解

http://www.phpufo.com/?p=507

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签： Open Flash Chart 图表组件

相关文章推荐

新的分享

章节导航