
FusionCharts
文章平均质量分 92
zzc1684
这个作者很懒,什么都没留下…
展开
-
FusionChart使用教程:数据库的动态数据交互
简单介绍一下FusionCharts,这是一款动态的制作报表的工具,主要通过XML数据和SWF文件进行交互,实现类似于flash的非常漂亮的报表。下面就做一个Demo,简要介绍一下啊FusionCharts的功能,以及如何实现一个完整动态数据的交互。 下载FusionCharts的官方API发布包,我做这个例子的时候是V3.1下载后,在MyEclipse下 新建一个Web工程。然后将发布包...原创 2014-11-10 09:07:25 · 309 阅读 · 0 评论 -
FusionCharts使用教程:图表导出为图像/PDF
FusionCharts XT图表控件包中的所有图表都可以通过配置而导出为图像/PDF。FusionCharts图表的导出可以在客户端或服务器端进行,所有导出的图像/ PDF可以被保存在客户端或服务器上。下列图像展示了如何在客户端通过图表的上下文菜单将图像导出为图表。其实,你也可以通过JavaScript APIs导出图表。默认情况下,菜单项目不会出现在FusionCharts图表中,你需...原创 2014-11-13 09:08:01 · 189 阅读 · 0 评论 -
JS图表控件FusionCharts使用教程:使用JavaScript更新图表数据
在使用FusionCharts的时候,用户可以先创建一个简单的图表,然后改变它的数据(请参见下面的代码)。图表最初据显示8月份的销售数据,当用户点击按钮时改为显示9月份的销售数据。每个月都有单独的XML文件,代码如下:<html> <head> <title>Update Chart data</title> <script...原创 2014-11-13 09:08:33 · 211 阅读 · 0 评论 -
JS图表控件FusionCharts使用教程:为JavaScript图表提供数据
FusionCharts的JavaScript类提供了一系列的函数来提供图表数据。 FusionCharts的JavaScript类支持XML或JSON格式的数据。这些数据可以是URL或字符串。以XML文件为数据源,示例代码如下:<html> <head> <title>My First chart using FusionC...原创 2014-11-13 09:09:03 · 192 阅读 · 0 评论 -
JS图表控件FusionCharts使用教程:使用JavaScript渲染图表(不用Flash)
在使用FusionCharts的时候,如果用户希望只使用JavaScript建立图表(而不是使用Flash),你那么就需要添加另一行代码,如下所示:FusionCharts.setCurrentRenderer('javascript'); 这段代码会使FusionCharts渲染器跳过Flash渲染,并创建纯基于JavaScript的图表。修改后的代码如下:<htm...原创 2014-11-13 09:10:46 · 612 阅读 · 0 评论 -
JS图表控件FusionCharts使用教程:如何使用JavaScript渲染iPhone/iPod/iPad图表
FusionCharts使用JavaScript:FusionCharts XT允许用户创建建立JavaScript图表(也就是web上的HTML5 /Canvas图表)。 这个特性允许用户在不支持Flash播放器的web浏览器上创建图表,如iPhone / iPad。FusionCharts内部利用Highcharts库生成JavaScript图表。这个功能能够无缝地使用当前的Fu...原创 2014-11-13 09:12:09 · 294 阅读 · 0 评论 -
JS图表控件FusionCharts使用教程:定制图表中的趋势线和趋势区
FusionCharts中的趋势线是什么在FusionCharts图表中,趋势线是横跨图标的水平/垂直线条,用来表示一些预订数据值。在图表中展示趋势线用户可以使用<chart>元素中的trendlines属性来显示图表中的趋势线。示例:<chart caption='Quarterly Sales Summary' subcaption='Figures ...原创 2014-11-14 08:54:48 · 341 阅读 · 0 评论 -
JS图表控件FusionCharts使用教程:自定义图表y轴最大/最小值
自定义图表y轴的最大值和最小值用户可以使用FusionCharts图表中<chart>元素的yAxisMaxValue和yAxisMinValue属性设置图表限制。示例:<chart yAxisMinValue='0' yAxisMaxValue='100' ... > 如何设置图表y轴的最小值(不是默认值0)用户可以将Y轴最小值设置为0或者是基...原创 2014-11-14 08:55:12 · 537 阅读 · 0 评论 -
JS图表控件FusionCharts使用教程:调整图表百分比大小
在使用FusionCharts的时候,用户可以为图表的宽度和高度设置百分比值,用来替代绝对的像素值。图表将根据父容器元素自动调整其尺寸。让我们来看看在HTML中这是如何实现的。》》》免费下载FusionCharts最新版以百分比的方式调整图表,首先需要更新HTML代码,如下所示:<div id="chartContainer" style="width:800px;heigh...原创 2014-11-14 08:55:30 · 291 阅读 · 0 评论 -
FusionCharts使用教程:为图表添加向下钻取链接
FusionCharts中的所有图表都支持向下钻取功能。这意味着你可以将单个数据图(柱状图中的柱形、饼图中的扇形)或者整个图表转换成热点(或链接)。从广义上来讲,FusionCharts图表的向下钻取功能可以分为两种类型:1、Simple link:向下钻取至一个简单链接或调用JavaScript函数。2、Chart links (LinkedCharts):向下钻取至一个详细的Lin...原创 2014-11-14 08:56:10 · 200 阅读 · 0 评论 -
FusionCharts使用教程:LinkedCharts实现无限层级向下钻取
FusionCharts XT引入了一个灵活的向下钻取功能-LinkedCharts,允许你利用单个数据源无限层级向下钻取图表。所有的链接皆来从父表及其数据,包含了所有子图表的数据和数据连接。单击父表的数据图项目(柱图,饼图等),用户可以向下钻取到子图表。通过drill-up选项,子图表可以替换父图表。以下为LinkedChart功能的实现效果:如何渲染FusionCharts...原创 2014-11-14 08:56:47 · 347 阅读 · 0 评论 -
FusionCharts使用教程:利用C#创建各类动态图表
曾经在在PHP中使用FusionCharts一文中介绍如何在PHP中使用FusionCharts,并简要说明setDataURL(srcUrl)和setJSONData(jsonStr)这两种数据格式。本文主要介绍如何利于C#创建FusionCharts图表。1、在项目引用中添加FusionCharts.dll2、生成XML格式的字符串与选定图表对应的Flash文件,采用FusionC...原创 2014-11-15 09:23:57 · 444 阅读 · 0 评论 -
JS图表控件FusionCharts使用教程:自定义图表的工具提示
什么是FusionCharts的工具提示当鼠标指示到FusionCharts图表中一个特定的数据点时所显示出来的信息就是工具提示。提示的信息可以是以下内容:单系列图(除了饼图和环图):名称和值饼图和环图:名称和值/百分比多系列和组合图:系列名称、类别名称、数据值如何禁用图表中的工具提示用户可以通过设置showToolTip='0'选择禁用图表上的工具提示。示例:...原创 2014-11-12 12:34:16 · 156 阅读 · 0 评论 -
JS图表控件FusionCharts使用教程:自定义图表上的垂直线
什么是垂直分割线FusionCharts中的垂直(或条形图中的水平)分隔线是用来帮助用户分隔数据块的。可以被放置在任何两个数据点,即使是不规则的间隔也可以。XML代码如下:<chart caption='Monthly Revenue' xAxisName='Month' yAxisName='Revenue' numberPrefix='$' showV...原创 2014-11-12 12:34:01 · 274 阅读 · 0 评论 -
JS图表控件FusionCharts使用教程:在图表中显示标识和图片
在FusionCharts的图表中显示外部标识使用FusionCharts之后,用户可以在运行时加载需要在图表中显示的外部标识/图片/图像。这个标识可以GIF / JPEG / PNG或SWF文件格式驻留在和图表SWF相同的子域。用户需要使用图表元素的logoURL属性加载标识,如下所示:<chart yAxisName='Sales Figure' caption='Top 5...原创 2014-11-12 12:33:31 · 180 阅读 · 0 评论 -
FusionCharts使用教程:显示双Y轴
项目中需要FusionCharts图表显示双Y轴,好像FCF_MSLine.swf不可以这样,只能显示一个Y轴,多条线, 找了一下,用MSCombiDY2D.swf可以实现,生成图如下: 两个图表的数据是一样的,设置有一此不同而己。对应的XML文本如下: 现在要将区域图表变为曲线只需将 改为 说明: parentYAxis='P'表示...原创 2014-11-10 09:08:14 · 522 阅读 · 0 评论 -
FusionCharts使用教程:使用FusionCharts ASP Class创建图表
FusionCharts可与ASP一同使用以绘制动态数据驱动图表。使用FusionCharts ASP Class来渲染图表变得更加容易。接下来,我们一起来看看如何使用FusionCharts ASP Class功能并创建图表。注意:本文中所讨论的代码都包含在Download Package > Code > ASPClass > BasicExample文件夹中。创...原创 2014-11-10 09:08:49 · 190 阅读 · 0 评论 -
FusionCharts使用教程:利用XML/JSON属性加载外部LOGO
在使用FusionCharts图表时,你可以在运行时加载外部Logo并显示于图表中。Logo可以是GIF/JPEG/PNG或SWF文件。你可以使用chart元素的logoURL属性来加载一个Logo。XML<chart yAxisName='Sales Figure' caption='Top 5 Sales Person' numberPrefix='$' useRound...原创 2014-11-10 09:09:42 · 160 阅读 · 0 评论 -
FusionCharts使用教程:利用HTML表单数据渲染图表
本文中,我们将利用HTML表单数据渲染FusionCharts图表。接下来,我们将构建一个简单的餐厅销售的例子,由专人输入餐厅每天所出售的食物。我们将获得这些餐厅销售数据,并绘制图表。本文所涉及的示例代码可以在FusionCharts试用版中获取。示例效果如下:用户在输入框中输入食物项目的相关值,然后点击 "Chart it!"。该按钮将生成输入框中所输入数据的对应图表。部分示...原创 2014-11-10 09:10:46 · 273 阅读 · 0 评论 -
自定义FusionCharts图表右键菜单的各种典型示例
对于FusionCharts图表控件的右键菜单,我想用过FusionCharts图表控件的朋友都不会觉得陌生,因为我们很多功能都需要在图表右键菜单内得以体现并实现我们某些功能,下面就罗列了几个典型的例子:一、导出图表图表导出我们配置导出菜单,chart属性配置如下所示:exportEnabled='1' exportAtClient='1' exportHandler='fcExp...原创 2014-11-11 09:01:20 · 117 阅读 · 0 评论 -
FusionCharts使用教程:Fusioncharts API参考方法(Functions)总结
chartType()FusionCharts的JavaScript类API提供了大量的功能。下面的列表显示在每个功能的详细信息:一、FusionCharts的类 - 实例功能1、configure(name:string , value:string) or configure(configurations: Object)绘制图表前,图表配置设置。主要是,您可以使用此功能,...原创 2014-11-11 09:01:52 · 164 阅读 · 0 评论 -
FusionCharts使用教程:事件API总结
1、FusionCharts API:Initialize(初始化)事件提示用户FusionCharts图表组件相关的Flash和JS文件等等是否准备就绪,能够创建FusionCharts图表对象。///添加初始化完成的事件InitializedFusionCharts.addEventListener('Initialized', function (identifier, pa...原创 2014-11-11 09:03:57 · 201 阅读 · 0 评论 -
JS图表控件FusionCharts使用教程:自定义图表导出菜单或界面
FusionCharts的导出组件界面有两种模式:Compact Mode: 用于保存单张图片,每一个单独的导出组件实例都代表单独的图表。在这种模式下,只有一个按钮和标题是可见的。Full Mode: 保存多个图表,无论是单独或作为一个单独的文件。在这种模式下,用户可以选择需要保存的图表以及保存的格式。在两种模式下,你可以自定义导出组件的颜色、字体和标题。在进入属性之前,先快速...原创 2014-11-11 09:04:19 · 226 阅读 · 0 评论 -
JS图表控件FusionCharts使用教程:如何设置图片导出格式
通过设置FusionCharts的<chart exportEnabled='1' ...>属性,就可以导出图表,图表的右键菜单将会显示所有可能导出的格式- JPG、PNG和PDF,如下所示:不过如果你只需要显示可选择的格式或改变菜单项的标签,可以进行如下操作:1<chart ... exportFormats='PDF=Expor...原创 2014-11-11 09:04:58 · 155 阅读 · 0 评论 -
JS图表控件FusionCharts使用教程:如何高亮显示数据
使用Flash图表控件FusionCharts时,通过改变alpha值是高亮显示数据的最简单方式。XML代码如下:<chart> <set label='John' value='420' /> <set label='Mary' value='295'> <set label='Tom' value='523' />...原创 2014-11-12 09:02:44 · 177 阅读 · 0 评论 -
JS图表控件FusionCharts使用教程:在图表标绘非连续数据
你可能经常要以不完整的数据点绘制图表。例如,当绘制每月的销售图表时,你可能没有所有的月数据。所以,你可能只想以一个空白的区域来显示缺失的数据,不在这个区域中绘制任何东西。FusionCharts可以让这个目标很容易的实现。》》》免费下载Flash图表控件FusionCharts最新版用户可以通过不提供任何值到需要隐藏的相应<set>元素来隐藏任意数量的数据块。具体操作参...原创 2014-11-12 09:03:08 · 131 阅读 · 0 评论 -
FusionCharts使用教程:在PHP程序中创建JavaScript图表
绝大多数图表控件都可用于PHP应用程序,其中大部门是服务器端组件,无需任何交互即可生成图表和仪表的静态图像,而一些客户端图表组件则需要借助于JavaScript来生成交互式图表、仪表和网格。FusionCharts为PHP开发者提供了服务器端库,开发人员无需精通JavaScript也能在JavaScript中创建图表。FusionCharts提供的服务器端库有助于链接到数据源,生成图表数据以及...原创 2014-11-15 09:24:32 · 354 阅读 · 0 评论