fusioncharts是什么技术
1个回答
展开全部
)
Candlestick Chart
FCF_Candlestick.swf
Funnel Chart(漏斗图)
Funnel Chart
FCF_Funnel.swf
Gantt Chart(甘特图)
Gantt Chart
FCF_Gantt.swf
四、安装使用
1. 在web项目目录下新建一个文件夹( 如FusionCharts),并把所有的SWF 文件都拷贝到这个文件夹里。
2. 在页面导入FusionCharts.js 文件,如:3. js加载数据生成报表(有两种方法)
方法一:xml文件引用法
(1)定义一个固定格式的xml文件(以Data.xml为例)
Date.xml的内容如下:
(2) js加载方法,代码如下:
方法二:字符串加载法
(1) 定义一个有固定格式的字符串,即可以将上述xml文件组合成字符串
var dataXml = “”;
(2)js加载方法,代码如下:解析:操作步骤:
<1>建立对象:
用四个参数建立了一个FusionCharts对象,
var myChart = new FusionCharts("../FusionCharts/FCF_Column3D.swf", "myChartId", "600", "500");
第一个参数是SWF文件的地址。
第二个是图形的id。这个id可以随便叫什么,但是要注意,当一个页面里有多个图形的时候,这个id一定要是唯一的。
第三个参数是图形的宽。
第四个参数是图形的高。
<2> 加载数据:
第一种加载方法需要设置数据文件的地址。如:
myChart.setDataURL("Data.xml");
第二种加载方法需要设置对应的字符串。如:
myChart2.setDataURL(dataXml); //dataXml为字符串
<3> 把图形渲染在指定的地方。
myChart.render("chartdiv");
"chartdiv"就是前面的DIV的id,这就表示把图形render到"chartdiv",即Flash图形就出现在这个id为"chartdiv1"的DIV里。
四、引起flash图像不能显示的可能原因
(一)如果没有在页面上看到图形,可能是下面的原因之一:
1. SWF没有放到正确的文件夹。
2. 在html文件里,SWF的路径设置不正确。
3. 没有安装Flash Player。
4. 没有启用浏览器Flash播放选项。
(二)如果你得到了一个“Error in Loading Data”的消息,可能是:
1. xml文件没放到正确的文件夹。
2. xml的文件名不正确。比如,你可能不小心把它命名Data.xml.txt。
(三)如果你得到了一个“Invalid XML Data”的消息,可能是:
1. xml文件里的内容有错误。
五、特殊字符
在FCF里,一些特殊的编码都需要经过编码。如:
“€”欧元符号 ——— 需要用“?”替换
“£”英镑符号 ——— 需要用“?”替换
“¥”人名币符号—— 需要用“?”替换
“¢”分符号 ————需要用“?”替换
“?百分号 ———— 需要用“%”替换
“&”连字符 ———— 需要用“&”替换
“>”大于号 ———— 需要用“>”替换
“'”单引号 ———— 需要用“'”替换
如果要显示双引号,直接使用就可以了,前提是属性值是用单引号括起来的。如果属性值是用双引号括起来的,要显示单引号,也可以直接使用,而不必用“'”来替换它。
五、属性参数大全
FusionCharts的XML标签属性有以下四种数据类型:
* Boolean - 布尔类型,只能为1或者0。例如:* Number - 数字类型,只能为数字。例如:* String - 字符串类型,只能为字符串。例如:* HexColorCode - 六进制颜色代码,前边没有‘#’。例如:<><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><>
1. 功能特性
animation …………………………[bool]是否动画显示数据,默认为1(True)
palette …………………………… [number]使用默认的调色板(1-5)
showNames ………………………[bool]是否显示横向坐标轴(x轴)标签名称
showLables ………………………[bool]是否显示标签,默认为1(True)显示(set中有lable属性时)
rotateNames ………………………[bool]是否旋转显示标签(name),默认为0(False):横向显示
rotateLabels ………………………[bool]设置x轴上的lable显示方式,默认为0横向显示
showValues ………………………[bool]是否在图表显示对应的数据值,默认为1(True)
yAxisMinValue ………………… [number]指定纵轴(y轴)最小值,数字
yAxisMaxValue ………………… [number] 指定纵轴(y轴)最小值,数字
showLimits ………………………[bool]是否显示图表限值(y轴最大、最小值),默认为1(True)
labelDisplay ………………………[string ]标签的呈现方式[“WRAP”,”STAGGER”,”ROTATE”,
“NONE”](超长屏蔽、折行、倾斜、不显示)
staggerLines …………………… [number]多少个字符后折行(labelDisplay=’stagger’)
rotateValues ………………………[bool]是否滚动显示值 (showValues=’1’)
showYAxisValues …………………[bool]是否显示y轴数据
yAxisValuesStep ………………… [number]y轴标记的显示间隔
adjustDiv …………………………[bool]自动调整divlines
clickURL …………………………[string]图表的焦点链接地址
defaultAnimation …………………[bool]是否开启默认动画
connectNullData …………………[bool]是否呈现空值(?)
slantLabels ……………………… [bool]
showDivLineValues ………………[bool]
rotateYAxisName …………………[bool]
yAxisNameWidth ……………… [number] (In Pixels)
labelStep ……………………… [number] (1 or above)
setAdaptiveYMin
<><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><>
2. 图表标题和轴名称
caption ………………………… [string]图表主标题
subCaption ………………………[string] 图表副标题
xAxisName …………………… [string]横向坐标轴(x轴)名称
yAxisName ……………………[string] 纵向坐标轴(y轴)名称
<><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><>
3. 图表和画布的样式
bgColor ……………………[color]图表背景色,可以使用逗号分割多个颜色值 6位16进制颜色值
bgRatio ………………………[number]多个颜色值所占的比率,[0-100]
bgAngle ………………………[number]角度,[0-360]
bgSWF ……………………… [string] 设置一个外部的Flash 为flash的背景(须在同一个域下)
bgSWFAlpha …………………[number] 背景flash透明度,[0-100]
bgAlpha……………………… [number]设置图表背景透明度,[0-100]
shadowAlpha …………………[number]投影透明度,[0-100]
showLegend ………………… [bool]是否显示系列名,默认为1(True)
canvasBgColor …………………[color]画布背景色,6位16进制颜色值
canvasBgAlpha …………………[number]画布透明度,[0-100] 0为不透明
canvasBorderColor …………… [color]画布边框颜色,6位16进制颜色值
canvasBorderThickness …………[number]画布边框厚度,[0-100]
canvasBaseColor ……………… [color]设置图表基部的颜色,6位16进制颜色值
canvasBaseDepth ……………… [number]设置图表基部的高度
canvasBgDepth …………………[number]设置图表背景的深度
showCanvasBg …………………[bool]设置是否显示图表背景
showBorder …………………… [bool]画布透明度,默认为1显示
showCanvasBase ………………[bool]设置是否显示图表基部
pieFillAlpha ……………………[number]各色块填充颜色的深度
pieSliceDepth …………………[bool]设置各个色块间隔线的宽度(不能与pieBorderAlpha同用)
useRoundEdges ……………… [bool]设置图表图形边角是否是为圆角,默认为0不是
chartLeftMargin ……………… [number]设置图表左边距,像素
chartRightMargin ………………[number]设置图表右边距,像素
chartTopMargin ……………… [number]设置图表上边距,像素
chartBottomMargin ……………[number]设置图表下边距,像素
canvasBgRatio …………………[ ?]
canvasBgAngle …………………[number]
borderColor ……………………[color]
Candlestick Chart
FCF_Candlestick.swf
Funnel Chart(漏斗图)
Funnel Chart
FCF_Funnel.swf
Gantt Chart(甘特图)
Gantt Chart
FCF_Gantt.swf
四、安装使用
1. 在web项目目录下新建一个文件夹( 如FusionCharts),并把所有的SWF 文件都拷贝到这个文件夹里。
2. 在页面导入FusionCharts.js 文件,如:3. js加载数据生成报表(有两种方法)
方法一:xml文件引用法
(1)定义一个固定格式的xml文件(以Data.xml为例)
Date.xml的内容如下:
(2) js加载方法,代码如下:
方法二:字符串加载法
(1) 定义一个有固定格式的字符串,即可以将上述xml文件组合成字符串
var dataXml = “”;
(2)js加载方法,代码如下:解析:操作步骤:
<1>建立对象:
用四个参数建立了一个FusionCharts对象,
var myChart = new FusionCharts("../FusionCharts/FCF_Column3D.swf", "myChartId", "600", "500");
第一个参数是SWF文件的地址。
第二个是图形的id。这个id可以随便叫什么,但是要注意,当一个页面里有多个图形的时候,这个id一定要是唯一的。
第三个参数是图形的宽。
第四个参数是图形的高。
<2> 加载数据:
第一种加载方法需要设置数据文件的地址。如:
myChart.setDataURL("Data.xml");
第二种加载方法需要设置对应的字符串。如:
myChart2.setDataURL(dataXml); //dataXml为字符串
<3> 把图形渲染在指定的地方。
myChart.render("chartdiv");
"chartdiv"就是前面的DIV的id,这就表示把图形render到"chartdiv",即Flash图形就出现在这个id为"chartdiv1"的DIV里。
四、引起flash图像不能显示的可能原因
(一)如果没有在页面上看到图形,可能是下面的原因之一:
1. SWF没有放到正确的文件夹。
2. 在html文件里,SWF的路径设置不正确。
3. 没有安装Flash Player。
4. 没有启用浏览器Flash播放选项。
(二)如果你得到了一个“Error in Loading Data”的消息,可能是:
1. xml文件没放到正确的文件夹。
2. xml的文件名不正确。比如,你可能不小心把它命名Data.xml.txt。
(三)如果你得到了一个“Invalid XML Data”的消息,可能是:
1. xml文件里的内容有错误。
五、特殊字符
在FCF里,一些特殊的编码都需要经过编码。如:
“€”欧元符号 ——— 需要用“?”替换
“£”英镑符号 ——— 需要用“?”替换
“¥”人名币符号—— 需要用“?”替换
“¢”分符号 ————需要用“?”替换
“?百分号 ———— 需要用“%”替换
“&”连字符 ———— 需要用“&”替换
“>”大于号 ———— 需要用“>”替换
“'”单引号 ———— 需要用“'”替换
如果要显示双引号,直接使用就可以了,前提是属性值是用单引号括起来的。如果属性值是用双引号括起来的,要显示单引号,也可以直接使用,而不必用“'”来替换它。
五、属性参数大全
FusionCharts的XML标签属性有以下四种数据类型:
* Boolean - 布尔类型,只能为1或者0。例如:* Number - 数字类型,只能为数字。例如:* String - 字符串类型,只能为字符串。例如:* HexColorCode - 六进制颜色代码,前边没有‘#’。例如:<><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><>
1. 功能特性
animation …………………………[bool]是否动画显示数据,默认为1(True)
palette …………………………… [number]使用默认的调色板(1-5)
showNames ………………………[bool]是否显示横向坐标轴(x轴)标签名称
showLables ………………………[bool]是否显示标签,默认为1(True)显示(set中有lable属性时)
rotateNames ………………………[bool]是否旋转显示标签(name),默认为0(False):横向显示
rotateLabels ………………………[bool]设置x轴上的lable显示方式,默认为0横向显示
showValues ………………………[bool]是否在图表显示对应的数据值,默认为1(True)
yAxisMinValue ………………… [number]指定纵轴(y轴)最小值,数字
yAxisMaxValue ………………… [number] 指定纵轴(y轴)最小值,数字
showLimits ………………………[bool]是否显示图表限值(y轴最大、最小值),默认为1(True)
labelDisplay ………………………[string ]标签的呈现方式[“WRAP”,”STAGGER”,”ROTATE”,
“NONE”](超长屏蔽、折行、倾斜、不显示)
staggerLines …………………… [number]多少个字符后折行(labelDisplay=’stagger’)
rotateValues ………………………[bool]是否滚动显示值 (showValues=’1’)
showYAxisValues …………………[bool]是否显示y轴数据
yAxisValuesStep ………………… [number]y轴标记的显示间隔
adjustDiv …………………………[bool]自动调整divlines
clickURL …………………………[string]图表的焦点链接地址
defaultAnimation …………………[bool]是否开启默认动画
connectNullData …………………[bool]是否呈现空值(?)
slantLabels ……………………… [bool]
showDivLineValues ………………[bool]
rotateYAxisName …………………[bool]
yAxisNameWidth ……………… [number] (In Pixels)
labelStep ……………………… [number] (1 or above)
setAdaptiveYMin
<><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><>
2. 图表标题和轴名称
caption ………………………… [string]图表主标题
subCaption ………………………[string] 图表副标题
xAxisName …………………… [string]横向坐标轴(x轴)名称
yAxisName ……………………[string] 纵向坐标轴(y轴)名称
<><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><>
3. 图表和画布的样式
bgColor ……………………[color]图表背景色,可以使用逗号分割多个颜色值 6位16进制颜色值
bgRatio ………………………[number]多个颜色值所占的比率,[0-100]
bgAngle ………………………[number]角度,[0-360]
bgSWF ……………………… [string] 设置一个外部的Flash 为flash的背景(须在同一个域下)
bgSWFAlpha …………………[number] 背景flash透明度,[0-100]
bgAlpha……………………… [number]设置图表背景透明度,[0-100]
shadowAlpha …………………[number]投影透明度,[0-100]
showLegend ………………… [bool]是否显示系列名,默认为1(True)
canvasBgColor …………………[color]画布背景色,6位16进制颜色值
canvasBgAlpha …………………[number]画布透明度,[0-100] 0为不透明
canvasBorderColor …………… [color]画布边框颜色,6位16进制颜色值
canvasBorderThickness …………[number]画布边框厚度,[0-100]
canvasBaseColor ……………… [color]设置图表基部的颜色,6位16进制颜色值
canvasBaseDepth ……………… [number]设置图表基部的高度
canvasBgDepth …………………[number]设置图表背景的深度
showCanvasBg …………………[bool]设置是否显示图表背景
showBorder …………………… [bool]画布透明度,默认为1显示
showCanvasBase ………………[bool]设置是否显示图表基部
pieFillAlpha ……………………[number]各色块填充颜色的深度
pieSliceDepth …………………[bool]设置各个色块间隔线的宽度(不能与pieBorderAlpha同用)
useRoundEdges ……………… [bool]设置图表图形边角是否是为圆角,默认为0不是
chartLeftMargin ……………… [number]设置图表左边距,像素
chartRightMargin ………………[number]设置图表右边距,像素
chartTopMargin ……………… [number]设置图表上边距,像素
chartBottomMargin ……………[number]设置图表下边距,像素
canvasBgRatio …………………[ ?]
canvasBgAngle …………………[number]
borderColor ……………………[color]
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
深圳市禾盛邦科技
2023-10-20 广告
2023-10-20 广告
作为深圳市禾盛邦科技有限公司的工作人员,我非常乐意回答关于UVLED交联机的问题。UVLED交联机是一种利用UVLED光源照射特定材料,引发材料分子间的交联反应,从而改善材料性能的设备。UVLED交联机具有高效节能、环保无污染、操作简单、可...
点击进入详情页
本回答由深圳市禾盛邦科技提供
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询