WEB开发网
开发学院网页设计JavaScript 使用FusionCharts+Jquery实现报表钻取 阅读

使用FusionCharts+Jquery实现报表钻取

 2009-12-11 00:00:00 来源:WEB开发网   
核心提示:实现效果:查看原图(大图)技术实现:数据源:<?xmlversion="1.0"encoding="utf-8"?><chartcaption="月统计表"xAxisName="月份"yAxisName="值&q

实现效果:

使用FusionCharts+Jquery实现报表钻取

查看原图(大图)

技术实现:

数据源:

<?xml version="1.0" encoding="utf-8" ?>
<chart caption="月统计表" xAxisName="月份" yAxisName="值" showValues="0" decimals="0" formatNumberScale="0" baseFont="Arial" baseFontSize="12">
  <set label="一月" value="462" link="JavaScript:ShowDrillChart('1, 235')" />
  <set label="二月" value="857" link="JavaScript:ShowDrillChart('2, 857')"/>
  <set label="三月" value="671" link="JavaScript:ShowDrillChart('3, 671')"/>
  <set label="四月" value="494" link="JavaScript:ShowDrillChart('4, 494')"/>
  <set label="五月" value="761" link="JavaScript:ShowDrillChart('5, 761')"/>
  <set label="六月" value="960" link="JavaScript:ShowDrillChart('6, 960')"/>
  <set label="七月" value="629" link="JavaScript:ShowDrillChart('7, 629')"/>
  <set label="八月" value="622" link="JavaScript:ShowDrillChart('8, 622')"/>
  <set label="九月" value="376" link="JavaScript:ShowDrillChart('9, 376')"/>
  <set label="十月" value="494" link="JavaScript:ShowDrillChart('10, 494')"/>
  <set label="十一月" value="761" link="JavaScript:ShowDrillChart('11, 761')"/>
  <set label="十二月" value="960" link="JavaScript:ShowDrillChart('12, 960')"/>
</chart>
<!--
baseFont="Arial"    设置字体
baseFontSize="12    设置字号
caption="月统计表"  报表标题
xAxisName="Month"   月份
yAxisName="Units"   对应的值
link="JavaScript:ShowDrillChart('1, 235')"  调用页面JS方法,并传递相应参数
-->

1 2 3  下一页

Tags:使用 FusionCharts Jquery

编辑录入:爽爽 [复制链接] [打 印]
赞助商链接