FusionCharts的JavaScript类提供了一系列的函数来提供图表数据。 FusionCharts的JavaScript类支持XML或JSON格式的数据。这些数据可以是URL或字符串。

以XML文件为数据源,示例代码如下:

<html>
<head>
<title>My First chart using FusionCharts</title>
<script type="text/javascript" src="FusionCharts/FusionCharts.js">
</script>
</head>
<body>
<div id="chartContainer">FusionCharts will load here!</div>
<script type="text/javascript"><!-- var myChart = new FusionCharts( "FusionCharts/Column3D.swf",
"myChartId", "400", "300", "0", "0" );
myChart.setXMLUrl("Data.xml");
myChart.render("chartContainer"); // -->
</script>
</body>
</html>

在上面的代码中,图表数据来源于一个外部XML文件,该文件提供的Url由setXMLUrl()函数提供。

使用XML字符串作为数据来源:

如果在JavaScript中有XML数据作为字符串,你可以使用setDataXML()函数来提供这个XML字符串,如下面的代码所示:

// String containing chart XML
var strXML = ""<chart><set value='100' label='Week 1'/>...</chart>""; myChart.setXMLData( strXML );

》》》FusionCharts免费下载地址

FusionCharts使用教程:为JavaScript图表提供数据的更多相关文章

  1. FusionCharts简单教程(三)-----如何自定义图表上的工具提示

    最近有蛮多人总是问我这个FusionCharts制表的问题,帮助他们解决之后,在昨晚发现以前整理的笔记中有这个简单教程,而且以前也发表了几篇这个博文,所以就将其全部上传上来供别人参考.如有不正确之处望 ...

  2. FusionCharts简单教程(八)-----使用网格组件

            有时候我们会觉得使用图像不够直接,对于数据的显示没有表格那样直接明了.所以这里就介绍如何使用网格组件.将网格与图像结合起来.网格组件能够将FusionCharts中的单序列数据以列表的 ...

  3. 网页图表Highcharts实践教程之外层图表区

    网页图表Highcharts实践教程之外层图表区 Highcharts图表区 图表区是图表的基本区域.所有的数据和图形都是绘制在图表区中.从图形绘制范围来分,图表区域分为外层图表区和绘图区.本章将详细 ...

  4. 13个JavaScript图表(JS图表)图形绘制插件【转】

    现在网络上又有越来越多的免费的(JS 图表)JavaScript图表图形绘制插件.我之前给一家网站做过复杂的图形,我们用的是 highchart.在那段时间,没有很多可供选择的插件.但现在不同了,很容 ...

  5. ECharts-基于Canvas,纯Javascript图表库,提供直观,生动,可交互,可个性化定制的数据可视化图表

    ECharts http://ecomfe.github.com/echarts 基于Canvas,纯Javascript图表库,提供直观,生动,可交互,可个性化定制的数据可视化图表.创新的拖拽重计算 ...

  6. 导出Excel之Epplus使用教程3(图表设置)

    导出Excel之Epplus使用教程1(基本介绍) 导出Excel之Epplus使用教程2(样式设置) 导出Excel之Epplus使用教程3(图表设置) 导出Excel之Epplus使用教程4(其他 ...

  7. AGS API for JavaScript 图表上地图

    原文:AGS API for JavaScript 图表上地图 图1 图2 图3 -------------------------------------华丽丽的分割线--------------- ...

  8. ECharts JavaScript图表库 ECharts

    ECharts开源来自百度商业前端数据可视化团队,基于html5 Canvas,是一个纯Javascript图表库,提供直观,生动,可交互,可个性化定制的数据可视化图表.创新的拖拽重计算.数据视图.值 ...

  9. 13个JavaScript图表(JS图表)图形绘制插件

    转自:http://blog.jobbole.com/13671/ 1. Flash 过去是最佳解决方案,但很多人多在从那迁移: 2. 现代浏览器及其更强大的计算能力,使其在转化绘制实时数据方面的能力 ...

随机推荐

  1. window.parent ,window.top,window.self 详解及parent和opener的区别

    window.parent ,window.top,window.self 详解 在应用有frameset或者iframe的页面时,parent是父窗口,top是最顶级父窗口(有的窗口中套了好几层fr ...

  2. 17.[CVE-2017-12615]Tomcat任意文件上传漏洞

    [CVE-2017-12615] Tomcat任意文件上传漏洞 首先先贴出wooyun上的一个案例:http://wooyun.jozxing.cc/static/bugs/wooyun-2015-0 ...

  3. SqlServer2012-创建表、删除表 增加字段 删除字段操作

    新建表:create table [表名]([自动编号字段] int IDENTITY (1,1) PRIMARY KEY ,[字段1] nVarChar(50) default \'默认值\' nu ...

  4. EIP权限工作流平台总结-3后端框架

    1.预览地址:www.eipflow.com (1) 权限工作流:www.demo.eipflow.com/Account/Login (2) 基础权限版:www.auth.eipflow.com/A ...

  5. Fetch超时设置和终止请求

    1.基本使用 Fetch 是一个新的端获取资源的接口,用于替换笨重繁琐XMLHttpRequest.它有了Request 和 Response 以及Headers对象的概念,与后端语言请求资源更接近. ...

  6. Python-OpenCV中的图像模糊

    目录 1. 高斯模糊:cv2.GaussianBlur()   主要记录Python-OpenCV中的图像模糊操作: 1. 高斯模糊:cv2.GaussianBlur() def GaussianBl ...

  7. Docker 启动配置和远程访问

    1. 添加Docker 启动时的配置:   vi /etc/default/docker 添加:   DOCKER_OPTS=" --label name=dockerServer1 -H ...

  8. Python中的矩阵、多维数组:Numpy

    Numpy 是Python中科学计算的核心库.它提供一个高性能多维数据对象,以及操作这个对象的工具.部分功能如下: ndarray, 具有矢量算术运算和复杂广播能力的快速且节省空间的多维数组. 用于对 ...

  9. cf831D(dp)

    题目链接: http://codeforces.com/contest/831/problem/D 题意: 有 n 个人和 k 把钥匙, 数组 a 为 n 个人的初始位置, 数组 b 为 k 把钥匙的 ...

  10. Openjudge jubeeeeeat

    jubeeeeeat 题目链接 总时间限制:  1000ms 内存限制:  256000kB 描述 众所周知,LZF很喜欢打一个叫Jubeat的游戏.这是个音乐游戏,游戏界面是4×4的方阵,会根据音乐 ...