FusionCharts是一个Flash的图表组件,它可以用来制作数据动画图表,其中动画效果用的是Adobe Flash 8 (原Macromedia Flash的)制作的flash , FusionCharts可用于任何网页的脚本语言类似于HTML , .NET,ASP , JSP技术的, PHP , ColdFusion等,提供互动性和强大的图表。使用XML作为其数据接口, FusionCharts充分利用流体美丽的Flash创建紧凑,互动性和视觉逮捕图表。

官方网站:http://www.fusioncharts.com/

**FusionCharts参数的详细说明
**

**功能特性
**animation                    是否动画显示数据,默认为1(True)
showNames                    是否显示横向坐标轴(x轴)标签名称
rotateNames                是否旋转显示标签,默认为0(False):横向显示
showValues                    是否在图表显示对应的数据值,默认为1(True)
yAxisMinValue                指定纵轴(y轴)最小值,数字
yAxisMaxValue                 指定纵轴(y轴)最小值,数字
showLimits                    是否显示图表限值(y轴最大、最小值),默认为1(True)

图表标题和轴名称
caption                    图表主标题
subCaption                    图表副标题
xAxisName                    横向坐标轴(x轴)名称
yAxisName                    纵向坐标轴(y轴)名称</wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr>

图表和画布的样式
bgColor                    图表背景色,6位16进制颜色值
canvasBgColor                画布背景色,6位16进制颜色值
canvasBgAlpha                画布透明度,[0-100]
canvasBorderColor            画布边框颜色,6位16进制颜色值
canvasBorderThickness        画布边框厚度,[0-100]
shadowAlpha                投影透明度,[0-100]
showLegend                    是否显示系列名,默认为1(True)</wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr>

字体属性
baseFont                    图表字体样式
baseFontSize                图表字体大小
baseFontColor                图表字体颜色,6位16进制颜色值
outCnvBaseFont                图表画布以外的字体样式
outCnvBaseFontSize            图表画布以外的字体大小
outCnvBaseFontColor        图表画布以外的字体颜色,6位16进制颜色值</wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr>

分区线和网格
numDivLines                画布内部水平分区线条数,数字
divLineColor                水平分区线颜色,6位16进制颜色值
divLineThickness            水平分区线厚度,[1-5]
divLineAlpha                水平分区线透明度,[0-100]
showAlternateHGridColor    是否在横向网格带交替的颜色,默认为0(False)
alternateHGridColor        横向网格带交替的颜色,6位16进制颜色值
alternateHGridAlpha        横向网格带的透明度,[0-100]
showDivLinues            是否显示Div行的值,默认??
numVDivLines                画布内部垂直分区线条数,数字
vDivLineColor                垂直分区线颜色,6位16进制颜色值
vDivLineThickness            垂直分区线厚度,[1-5]
vDivLineAlpha                垂直分区线透明度,[0-100]
showAlternateVGridColor    是否在纵向网格带交替的颜色,默认为0(False)
alternateVGridColor        纵向网格带交替的颜色,6位16进制颜色值
alternateVGridAlpha        纵向网格带的透明度,[0-100]</wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr>

数字格式
numberPrefix                增加数字前缀
numberSuffix                增加数字后缀    % 为 ‘%’
formatNumberScale        是否格式化数字,默认为1(True),自动的给你的数字加上K(千)或M(百万);若取0,则不加K或M
decimalPrecision            指定小数位的位数,[0-10]    例如:=’0′ 取整
divLineDecimalPrecision    指定水平分区线的值小数位的位数,[0-10]
limitsDecimalPrecision        指定y轴最大、最小值的小数位的位数,[0-10]
formatNumber                逗号来分隔数字(千位,百万位),默认为1(True);若取0,则不加分隔符
decimalSeparator            指定小数分隔符,默认为’.’
thousandSeparator            指定千分位分隔符,默认为’,’</wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr>

Tool-tip/Hover标题
showhovercap                是否显示悬停说明框,默认为1(True)
hoverCapBgColor            悬停说明框背景色,6位16进制颜色值
hoverCapBorderColor        悬停说明框边框颜色,6位16进制颜色值
hoverCapSepChar            指定悬停说明框内值与值之间分隔符,默认为’,’</wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr>

折线图的参数
lineThickness                折线的厚度
anchorRadius                折线节点半径,数字
anchorBgAlpha                折线节点透明度,[0-100]
anchorBgColor                折线节点填充颜色,6位16进制颜色值
anchorBorderColor            折线节点边框颜色,6位16进制颜色值</wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr>

Set标签使用的参数
value                        数据值
color                        颜色
link                        链接(本窗口打开[Url],新窗口打开[n-Url],调用JS函数[JavaScript:函数])
name                        横向坐标轴标签名称</wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr>

  1. 安装Firebug插件和FirePHP插件,FirePHP只是Firebug的一个扩展。

  2. 登陆FirePHP的主页:http://www.firephp.org/ 下载FirePHPCore Server Library

  3. 解压缩取得FirePHPCore文件夹下

    fb.php                   //php5 面向过程方式调试
    FirePHP.class.php        //php5 面向对象方式调试
    fb.php4                  //php4 面向过程方式调试
    FirePHP.class.php4       //php4 面向对象方式调试
选择自己想要的调试模式的文件。

例如:

//使用FirePHP.class.php
$this->load->library('firephp');   //载入firephp类
$this->firephp->log($this->pagination);  //调用该类的log方法

之后就可以在Firebug的控制台看到这个对象或者数据的结构,但并不影响整个页面HTML和Dom的结构。

[][1][  
][2]

 [1]: http://crackedzone.com/blog/wp-content/uploads/2011/08/FirePHP1.jpg
 [2]: http://crackedzone.com/blog/wp-content/uploads/2011/08/FirePHP.jpg

有的时候我们的数据表结构是这样的

currentdate counts
2011-07-12 15
2011-07-13 35
2011-07-14 43

2011-07-24 34
2011-07-25 12
2011-07-28 25
2011-07-29 34

2011-08-16 45
2011-08-17 85
2011-08-18 23

称这个表为A表,这是我们需要统计出A表 2011-07-01 到 2011-08-31 这两个月的每天的counts值。但是我们发现2011-07-01到2011-08-01, 2011-07-26到2011-07-27,2011-08-19到2011-08-31,这些地方是空的,也就是断行了,没有数据的,所以说如果要给这些地方返回 counts=0 在PHP中处理就显得非常的麻烦。
然而我们就可以在MySQL中创建一个临时表,该表内里面的的信息为

currentdate
2011-07-01
2011-07-02
2011-07-03

2011-08-29
2011-08-30
2011-08-31

称这个表为B表,因此只要A右链接B表,就能返回新的数据结果集。而且Mysql也提供在内存中创建临时表,但mysql链接释放的时候这个表也消失了。这不失为一个好办法,但是我没有测试过读写效率。

//Type=heap
$this->DB->query("CREATE TEMPORARY TABLE IF NOT EXISTS tmp_table
(tmp_currentdate varchar(10) NOT NULL) TYPE = HEAP");
//设置插入数据用的SQL语句
$insertSql = "INSERT INTO tmp_table(tmp_currentdate) VALUES";
//插入数据
$this->startTime = mktime(0, 0, 0 ,7, 1, 2011);
$this->endTime   = mktime(0, 0, 0 ,9, 1, 2011);
$this->days      = ($this->endTime - $this->endTime) + 1;
for ($i=0; $idays; $i++) {
  $tmpDate = date('Y-m-d', $this->startTime + 60 * 60 * 24 * $i);
  $insertSql .= "('" . $tmpDate ."'),";
}
$insertSql = substr($insertSql,0 , strlen($insertSql)-1);

$this->DB->query($insertSql);

//临时表建立完成,等于B表


SELECT tmp_currentdate AS currentdate, IF(counts IS NULL,0,counts) AS counts
FROM
  (SELECT currentdate, counts FROM stat) AS A
RIGHT JOIN
  tmp_table AS TMP
ON A.currentdate=TMP.tmp_currentdate

就能返回出

currentdate counts  
2011-07-01 0  
2011-07-02 0  
…  
2011-07-11 0  
2011-07-12 15  
2011-07-13 35  
2011-07-14 43  
…

打开apache下的配置文件httpd.conf

找到NameVirtualHost *:80  去掉注释符,保证前面没有#,开始建立虚拟目录.

<VirtualHost *:80>
DocumentRoot "D:\www\guestbook"
ServerName local.guestbook.com
</VirtualHost>

<VirtualHost *:80>
DocumentRoot "D:\www\cart"
ServerName local.cart.com
</VirtualHost>

<VirtualHost *:80>
DocumentRoot "D:\www\zone"
ServerName local.zone.com
</VirtualHost>

保存配置文件,重启apache后,虚拟目录就创建好了。然后需要对域名进行强制解析转向到我们的虚拟目录。  
打开C:\WINDOWS\system32\drivers\etc文件夹下的host文件  
在最后添加上自己的本地地址localhost 或者自己的ip

localhost local.zone.com
192.168.1.100 local.guestbook.com
192.168.1.100 local.cart.com
192.168.1.100 local.crackedzone.com
192.168.1.100 local.test.com

由于工作需要,把原来的920px的网站要求使用960 Grid的标准来做,特地研究下了960 Grid System。说实在话我已经有点Out。简单的讲,960 GS就是一种基于网格的布局框架,使用它可以极大地简化页面的布局工作。要是你象我一样不太擅长做页面这些活,那它就是为你准备的。

官方网站:http://960.gs/

自出道以来,960 GS就受到了大家的热捧,关于它的介绍文章和示例简直铺天盖地,随便用Google一搜就有一长串列表供你选择。有鉴于此,本文并不打算在拾人牙慧,再嚼现饭,而只是简要说明其用法以及核心css文件,960.css,中各class的说明。各看官权且把本文作为960 GS的Cheat Sheet吧。

用法
在Web工程里引入960.css,你就可以安心使用其定义的各个class了。除了这个必须引入的文件,960 GS提供的下载包中还有两个css文件值得一提:reset.css和text.css。这两个文件的主要作用是为了消除浏览器间显示差异准备的,前者消除了html标签在各浏览器间的差异,而后者则主要针对的是字体。
对于这类消除浏览器差异的css文件,一般建议还是使用为妙。一来是因为简单,使用它们除了在页面开始引入之外就没有其他工作量;二来是用上它们还保证了应用在不同浏览器间的一致性,真是方便实惠。

Class说明
960.css里提供了以下class:
container_12和container_16,用于最外层的div,它们确定页面采用12列布局还是16列布局。grid_*,代表n列宽。12列对应1~12,16列对应1~16。使用时,一行内的grid数值之和等于container数值。clear,清除上一行的样式,一般在分行时使用。push_*和pull_*,将div往内推或往外拉n列宽。prefix_*和suffix_*,在div的前后留n列宽空白。alpha和omega,分别应用到内嵌表格的第一个和最后一个,其目的是为了去掉表格之间的空白。因为框住内嵌表格的外部表格本身已经有了自己与其他表格之间的空白,因此内嵌表格和外部表格之间的空白一般是不美观,不必要的。

在使用时需注意960 GS的限制:
页面的宽度限制为960px。上述class只限定了div的宽度,高度由开发者自行控制。只提供了12列、16列和24列布局。功能单一,只聚焦简化布局。
如果你的需求超出以上范围,最好就另寻高明了。这里有个简单的例子帮助你了解960 GS的使用:

也可以查看:http://blog.163.com/eric_chen2/blog/static/58326101200942804432903/

这篇文章写的比较具体。