Fusioncharts使用说明

背景

最近由于工作需要，再次接触到了Fusioncharts，但也有不足之处，现在官网上似乎是不支持flash的版本了，只能看到html5相关的javascript版本，无奈再次从网上搜索到了一些别人个人总结的一些用法。

总结

fusioncharts的flash版本的xml渲染数据结构常有element包含以下：

 <graph>

 <categories>

 　　<category Name='区间出现记录数（单位：个）' ShowName='1' />

 　　。。。

 </categories>

 <dataset SeriesName='小于-90dBM' Color='9D080D' ShowValues='1' Alpha='100'>

 　　<set Value='1000' Alpha='80' />

 　　。。。。

 </dataset>

 。。。

 </graph>

这里边的graph属性包含一下：

功能特性

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轴)名称

图表和画布的样式

bgColor 图表背景色，6位16进制颜色值

canvasBgColor 画布背景色，6位16进制颜色值

canvasBgAlpha 画布透明度，[0-100]

canvasBorderColor 画布边框颜色，6位16进制颜色值

canvasBorderThickness 画布边框厚度，[0-100]

shadowAlpha 投影透明度，[0-100]

showLegend 是否显示系列名，默认为1(True)

字体属性

baseFont 图表字体样式

baseFontSize 图表字体大小

baseFontColor 图表字体颜色，6位16进制颜色值

outCnvBaseFont 图表画布以外的字体样式

outCnvBaseFontSize 图表画布以外的字体大小

outCnvBaseFontColor 图表画布以外的字体颜色，6位16进制颜色值

分区线和网格

numDivLines 画布内部水平分区线条数，数字

divLineColor 水平分区线颜色，6位16进制颜色值

divLineThickness 水平分区线厚度，[1-5]

divLineAlpha 水平分区线透明度，[0-100]

showAlternateHGridColor 是否在横向网格带交替的颜色，默认为0(False)

alternateHGridColor 横向网格带交替的颜色，6位16进制颜色值

alternateHGridAlpha 横向网格带的透明度，[0-100]

showDivLineValues 是否显示Div行的值，默认？？

numVDivLines 画布内部垂直分区线条数，数字

vDivLineColor 垂直分区线颜色，6位16进制颜色值

vDivLineThickness 垂直分区线厚度，[1-5]

vDivLineAlpha 垂直分区线透明度，[0-100]

showAlternateVGridColor 是否在纵向网格带交替的颜色，默认为0(False)

alternateVGridColor 纵向网格带交替的颜色，6位16进制颜色值

alternateVGridAlpha 纵向网格带的透明度，[0-100]

数字格式

numberPrefix 增加数字前缀

numberSuffix 增加数字后缀 % 为 '%25'

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 指定千分位分隔符,默认为','

Tool-tip/Hover标题

showhovercap 是否显示悬停说明框，默认为1(True)

hoverCapBgColor 悬停说明框背景色，6位16进制颜色值

hoverCapBorderColor 悬停说明框边框颜色，6位16进制颜色值

hoverCapSepChar 指定悬停说明框内值与值之间分隔符,默认为','

折线图的参数

lineThickness 折线的厚度

anchorRadius 折线节点半径，数字

anchorBgAlpha 折线节点透明度，[0-100]

anchorBgColor 折线节点填充颜色，6位16进制颜色值

anchorBorderColor 折线节点边框颜色，6位16进制颜色值

Set标签使用的参数

value 数据值

color 颜色

link 链接（本窗口打开[Url]，新窗口打开[n-Url]，调用JS函数[JavaScript:函数]）

name 横向坐标轴标签名称

dataset 相关属性

怎么使用：

 <!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 runat="server">

     <title></title>

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

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

     <script language="javascript" type="text/javascript">

         $(document).ready(function () {

             var myChartId = new Date().getTime();

             var chart = new FusionCharts('FusionChartsFiles/FCF_MSColumn3D.swf', myChartId, "400", "300");

             chart.setDataURL("Data.xml");

             chart.render(document.getElementById("divSignalRangeStatitistics"));

         });

     </script>

 </head>

 <body>

     <form id="form1" runat="server">

     <div id="divSignalRangeStatitistics">

     </div>

     </form>

 </body>

 </html>

对应的data.xml

 <?xml version="1.0" encoding="utf-8" ?>

 <graph baseFont='Arial' baseFontSize='12' outCnvBaseFontSize='12' numberSuffix='' animation='1' bgAlpha='50' showhovercap='1'  bgColor='ffffff' showValues='1' showNames='1' xAxisName='区域' yAxisName='接收信号数' yAxisMinValue='0' yAxisMaxValue='100' decimalPrecision='0' formatNumberScale='0' caption='信息强度分布图'>

   <categories FontSize='10' FontColor='0000FF'>

     <!--     AFD8F8,F6BD0F,8BBA00,FF8E46,008E8E,D64646,8E468E,588526,B3AA00,008ED6,9D080D,A186BE,    -->

     <category Name='信息强度区间出现记录数（单位：个）' ShowName='1' />

   </categories>

   <dataset SeriesName='小于-90dBM' Color='9D080D' ShowValues='1' Alpha='100'>

     <set Value='1000' Alpha='80' />

   </dataset>

   <dataset SeriesName='[-90dBm,-80dBm)' Color='F6BD0F' ShowValues='1' Alpha='100'>

     <set Value='3500' Alpha='80' />

   </dataset>

   <dataset SeriesName='[-80dBm,-70dBm)' Color='8BBA00' ShowValues='1' Alpha='100'>

     <set Value='2400' Alpha='80' />

   </dataset>

   <dataset SeriesName='[-70dBm,-60dBm)' Color='FF8E46' ShowValues='1' Alpha='100'>

     <set Value='8000' Alpha='80' />

   </dataset>

   <dataset SeriesName='[-60dBm,-50dBm)' Color='008E8E' ShowValues='1' Alpha='100'>

     <set Value='2100' Alpha='80' />

   </dataset>

   <dataset SeriesName='大于或等于-50dBm' Color='A186BE' ShowValues='1' Alpha='100'>

     <set Value='1987' Alpha='80' />

   </dataset>

 </graph>

使用技巧：

当我们遇到 y轴出现 Nan.NULL时，可以在graph上添加 yaliasMaxValue='100',既可以解决该问题。

当数据库初始化化，无数据时，往往这个工具不会显示坐标轴（比如 [-80dBm,-70dBm]的统计记录为0时，在坐标轴上就不会出现该统计柱状图）在图表上，我可们可以给这个坐标一个0.001,当让我们decimalPrecision(指定小数位的位数)设置值这时要低于3位小数，否则该0.001就会显示为非0的数据了。

参考：

http://www.cnblogs.com/mingforyou/archive/2012/11/13/2767829.html

http://blog.csdn.net/liangxanhai/article/details/8056295

Fusioncharts使用说明的更多相关文章

Atitit.项目修改补丁打包工具使用说明
Atitit.项目修改补丁打包工具使用说明 1.1. 打包工具已经在群里面.打包工具.bat1 1.2. 使用方法:放在项目主目录下,执行即可1 1.3. 打包工具的原理以及要打包的项目列表1 1. ...
awk使用说明
原文地址:http://www.cnblogs.com/verrion/p/awk_usage.html Awk使用说明运维必须掌握的三剑客工具:grep(文件内容过滤器),sed(数据流处理器), ...
JavaScript图表FusionCharts免费在线公开课，由印度原厂技术工程师主讲，10月13日发车
FusionCharts公开课达人还你做轻松晋升图表大师 [开课时间]10月13日 14:30[主讲老师]印度原厂技术工程师[开课形式]网络在线公开课[活动费用]前50名免费现在就可以报名哦报 ...
FusionCharts和highcharts 饼图区别!
FusionCharts ---------------脚本--------------- <script src="../../../fashioncharts/js/FusionC ...
“我爱背单词”beta版发布与使用说明
我爱背单词BETA版本发布第二轮迭代终于画上圆满句号,我们的“我爱背单词”beta版本已经发布. Beta版本说明项目名称我爱背单词版本 Beta版团队名称北京航空航天大学计算机学院拒 ...
Oracle 中 union 和union all 的简单使用说明
1.刚刚工作不久,经常接触oracle,但是对oracle很多东西都不是很熟.今天我们来了解一下union和union all的简单使用说明.Union(union all): 指令的目的是将两个 S ...
FusionCharts的使用方法（超详细）
今天统计价格变化规律的时候找到的一个很好的文档,很详细一.简介 Ø FusionCharts 是InfoSoft Global 公司的一个产品,InfoSoft Global 公司是专业的Flash ...
FusionCharts参数说明（中文）
FushionCharts是把抽象数据图示化的套件,使用方便,配置简单.其相关参数中文说明如下. FusionCharts Free中文开发指南第二版.pdf 功能特性 animation ...
Map工具系列-02-数据迁移工具使用说明
所有cs端工具集成了一个工具面板 -打开(IE) Map工具系列-01-Map代码生成工具说明 Map工具系列-02-数据迁移工具使用说明 Map工具系列-03-代码生成BySQl工具使用说明 Map ...

随机推荐

iconv vs mb_convert_encoding
iconv 字符串按要求的字符编码来转换 string iconv ( string $in_charset , string $out_charset , string $str ) 将字符串 st ...
java-访问权限
使用以下修饰符来控制对属性和方法的访问: 1.public--公共的,其他任何类均可访问 2.private--私有的,只能在当前类内部被访问,其他都不能访问 3.protected--受保护的,相同 ...
迷宫bfs POJ3984
#include<stdio.h> int map[5][5]={0,1,0,0,0, 0,1,0,1,0, 0,0,0,0,0, 0,1,1,1,0, ...
servlet等一些砸碎的
1:servlet 中的synchronized 关键字能保证一次只有一个线程 2:servlet的线程问题只有在大量的方位时 3:AutoCloseable接口:资源自动关闭 4:EntityUti ...
【转】在C#用HttpWebRequest中发送GET/HTTP/HTTPS请求
http://zhoufoxcn.blog.51cto.com/792419/561934 这个需求来自于我最近练手的一个项目,在项目中我需要将一些自己发表的和收藏整理的网文集中到一个地方存放,如果全 ...
JDK核心包学习
StringBuffer 线程安全.可变字符序列 StringBuilder 非线程安全.可变字符序列,比StringBuffer更快 Boolean 使用valueOf产生Boolean实例 ...
RequestContextListener有什么用
问题: java.lang.IllegalStateException: No thread-bound request found: Are you referring to request att ...
Qt操作Oracle
很久以前写过<Qt数据库操作>的一篇文章,在操作数据库的时候,温习了一下!感觉很好!但在操作Oracle数据库时又遇到了一些问题.在使用QSqlRelationalTableModel操纵 ...
【Java 进阶篇】【第二课】异常处理
概念异常处理的存在是为了: 允许程序员跳过无法处理的问题,继续开发后续的工作,或根据异常做出更加聪明的处理方式. Java中存在一类对象叫“异常对象”. 当异常情况发生时,就会暗战预先的设定,抛 ...
VB的try语句，异常处理
Try语句格式 Try 程式语句 Catch Throw ex Finally 释放一些连接等动作,不管有没有抛异常,都会执行到这里 End try 捕捉异常的语句是很好用的,在程式发生错误时,可以利 ...

Fusioncharts使用说明

Fusioncharts使用说明的更多相关文章

随机推荐

热门专题