`
- 浏览:
629029 次
- 性别:
- 来自:
上海
-
从 http://www.infosoftglobal.com/ 站点下载免费版本到本地，解压到本地，取出 JSClass目录和Charts 目录下所有文件拷贝到你的网站chart目录下，即可开始FusionCharts的使用之旅。
一、 开始一个简单的demo
1. 在你的网站根目录下新建 Data.xml文档，作为图表的数据源，内容如下：
<graph caption='Monthly Unit Sales' xAxisName='Month' yAxisName='Units' showNames='1' decimalPrecision='0' formatNumberScale='0'>
<set name='Jan' value='462' color='AFD8F8' />
<set name='Feb' value='857' color='F6BD0F' />
<set name='Mar' value='671' color='8BBA00' />
<set name='Apr' value='494' color='FF8E46' />
<set name='May' value='761' color='008E8E' />
<set name='Jun' value='960' color='D64646' />
<set name='Jul' value='629' color='8E468E' />
<set name='Aug' value='622' color='588526' />
<set name='Sep' value='376' color='B3AA00' />
<set name='Oct' value='494' color='008ED6' />
<set name='Nov' value='761' color='9D080D' />
<set name='Dec' value='960' color='A186BE' />
</graph>
2. 再建立一个展示页面，Demo.html ：
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>第一个Flash图表页面</title>
<!-- 引入FusionCharts 需要的JS脚本文件 -->
<script language="JavaScript" src="chart/FusionCharts.js"></script>
</head>
<body>
<div id="chartDiv" align="center">First Chart Container Pie 3D</div>
<script type="text/javascript">
var myChart1 = new FusionCharts("chart/FCF_Column3D.swf", "myChartId", "600", "350");
myChart1.setDataURL("Data.xml");
myChart1.render("chartDiv");
</script>
</body>
</html>
3. 猛击 Demo.html 文件，即可看到效果：
4. 够简单吧，这样才好。
二、 对中文字符的支持
1. 让 FusionCharts支持中文
修改一下刚才 Data.xml 文件，加入几个中文字符，狂刷新浏览器，会看到几个不协调的字符。这里我修改图表标题(caption='Monthly Unit Sales' è caption='月销售历史')：
FusionCharts告诉我们XML文件加载失败，可能有非法字符。下面要修改Data.xml，使之好好工作。官方说当前Data.xml文件缺乏BOM标记（Byte Order Mark），打开UltraEdit 文本编辑器，另存为的时候，一定要选择：
UTF-8编码方式(已经附加BOM标记)，直接覆盖原文件。
再次刷新Demo.html 页面，即可看到标题变成了中文：
若您对16进制熟悉，以16进制打开文件，直接修改前6位字符为
”EF BB BF”,保存成UTF-8格式即可。
牢记：静态的XML文件，须包含BOM特征码。
2. 让动态产生的XML文件避免中文问题
我们实验一下把Data.xml文件替换成动态生成XML方式。
新建一个JSP 页面：Data.jsp ,输入以下内容：
<%@ page language="java" contentType="text/xml; charset=UTF-8"%>
<%
String xmlStr = "<graph caption='Monthly Unit Sales' xAxisName='Month' yAxisName='Units' showNames='1' decimalPrecision='0' formatNumberScale='0'>"
+ "<set name='Jan' value='462' color='AFD8F8' />"
+ "<set name='Feb' value='857' color='F6BD0F' />"
+ "<set name='Mar' value='671' color='8BBA00' />"
+ "<set name='Apr' value='494' color='FF8E46' />"
+ "<set name='May' value='761' color='008E8E' />"
+ "<set name='Jun' value='960' color='D64646' />"
+ "<set name='Jul' value='629' color='8E468E' />"
+ "<set name='Aug' value='622' color='588526' />"
+ "<set name='Sep' value='376' color='B3AA00' />"
+ "<set name='Oct' value='494' color='008ED6' />"
+ "<set name='Nov' value='761' color='9D080D' />"
+ "<set name='Dec' value='960' color='A186BE' />"
+ "</graph>";
out.write(xmlStr);
%>
在Demo.html页面，修改 setDataURL参数为“Data.jsp”，再次刷新Demo.html页面，即可看到效果。
下面在JSP页面中同样把图表标题修改成中文，刷新浏览器，会看到“Invalid XML Data”字样。
怎么办，设置JSP文件具有BOM标记，不行！设置其XML输出编码尝试一下吧：
<%@ page language="java" contentType="text/xml; charset=GBK"%>
看到了吗，UTF-8 被修改成了 GBK编码，刷新Demo.html文件，看一看到正常效果了。
牢记 ：动态产生的XML文档，编码须是GBK或者gb2312。
三、 表格数据源-字符串形式加载
以上使用FusionCharts 提供的 setDataURL方法，参数须是可访问、产生xml文档的URL地址。若不是url，字符串亦可作为参数传递过去：
新建Demo2.html文件：
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>使用字符串充当数据源</title>
<script language="JavaScript" src="chart/FusionCharts.js"></script>
</head>
<body>
<div id="chartDiv" align="center"> Chart Container Pie 3D</div>
<script type="text/javascript">
//数据源
var xmlData = "<graph caption='Monthly Unit Sales' xAxisName='Month' yAxisName='Units' showNames='1' decimalPrecision='0' formatNumberScale='0'>" +
"<set name='Jan' value='462' color='AFD8F8' />" +
"<set name='Feb' value='857' color='F6BD0F' />" +
"<set name='Mar' value='671' color='8BBA00' />" +
"<set name='Apr' value='494' color='FF8E46' />" +
"<set name='May' value='761' color='008E8E' />" +
"<set name='Jun' value='960' color='D64646' />" +
"<set name='Jul' value='629' color='8E468E' />" +
"<set name='Aug' value='622' color='588526' />" +
"<set name='Sep' value='376' color='B3AA00' />" +
"<set name='Oct' value='494' color='008ED6' />" +
"<set name='Nov' value='761' color='9D080D' />" +
"<set name='Dec' value='960' color='A186BE' />" +
"</graph>";
var myChart1 = new FusionCharts("chart/FCF_Column3D.swf", "myChartId", "600", "350");
myChart1.setDataXML(xmlData);
myChart1.render("chartDiv");
</script>
</body>
</html>
访问Demo2.html页面，会看到正常的图标显示。
尝试一下将图表标题修改成中文，这次很顺利的显示出来了，但标题显示为乱码:
怎么办 ？把当前的html文件修改成包含有BOM特征码的UTF-8文件，这招不好使了。
解决方法，建立一个JSP页面（Demo2.jsp），比Demo2.html文件多了一行内容:
<%@ page language="java" contentType="text/html; charset=UTF-8"%>
访问一下，可以看到中午乱码问题解决了。
牢记 ：提供字符串数据源的页面必须硬编码才行，可以是GBK或UTF-8。
再深入一下，动态产生的字符串数据源，是否也存在乱码问题。
修改Demo2.jsp中的
myChart1.setDataXML("<jsp:include page= 'Data2.jsp' />");</sp>
分享到：
相关推荐
包含FusionCharts使用手记 官方Demo 中文开发指南 解决中文乱码Demo Area2D.swf Bar2D.swf Bubble.swf Column2D.swf Column3D.swf Doughnut2d.swf Doughnut3D.swf FCExporter.swf Funnel.swf InverseMSArea.swf ...
漫画作品与时间旅行题材
Spring Boot特点： 1、创建一个单独的Spring应用程序； 2、嵌入式Tomcat，无需部署WAR文件； 3、简化Maven配置； 4、自动配置Spring； 5、提供生产就绪功能，如指标，健康检查和外部配置； 6、绝对没有代码生成和XML的配置要求；第一章 绪 论 1 1.1背景及意义 1 1.2国内外研究概况 2 1.3 研究的内容 2 第二章 关键技术的研究 3 2.1 相关技术 3 2.2 Java技术 3 2.3 ECLIPSE 开发环境 4 2.4 Tomcat介绍 4 2.5 Spring Boot框架 5 第三章 系统分析 5 3.1 系统设计目标 6 3.2 系统可行性分析 6 3.3 系统功能分析和描述 7 3.4系统UML用例分析 8 3.4.1管理员用例 9 3.4.2用户用例 9 3.5系统流程分析 10 3.5.1添加信息流程 11 3.5.2操作流程 12 3.5.3删除信息流程 13 第四章 系统设计 14 4.1 系统体系结构 15 4.2 数据库设计原则 16 4.3 数据表 17 第五章 系统实现 18 5.1用户功能模块 18 5.2
内容概要：本文作为PyTorch的入门指南，首先介绍了PyTorch相较于TensorFlow的优势——动态计算图、自动微分和丰富API。接着讲解了环境搭建、PyTorch核心组件如张量（Tensor）、autograd模块以及神经网络的定义方式（如nn.Module），并且给出了详细的神经网络训练流程，包括前向传播、计算损失值、进行反向传播以计算梯度，最终调整权重参数。此外还简要提及了一些拓展资源以便进一步探索这个深度学习工具。 适用人群：初次接触深度学习技术的新学者和技术爱好者，有一定程序基础并希望通过PyTorch深入理解机器学习算法实现的人。 使用场景及目标：该文档有助于建立使用者对于深度学习及其具体实践有更加直观的理解，在完成本教程之后，读者应当能够在个人设备上正确部署Python环境，并依据指示独立创建自己的简易深度学习项目。 其他说明：文中所提及的所有示例均可被完整重现，同时官方提供的资料链接也可以方便有兴趣的人士对感兴趣之处继续挖掘，这不仅加深了对PyTorch本身的熟悉程度，也为未来的研究或者工程项目打下了良好的理论基础和实践经验。
古镇美食自驾游：舌尖上的历史韵味
1.版本：matlab2014/2019a/2024a 2.附赠案例数据可直接运行matlab程序。 3.代码特点：参数化编程、参数可方便更改、代码编程思路清晰、注释明细。 4.适用对象：计算机，电子信息工程、数学等专业的大学生课程设计、期末大作业和毕业设计。
漫画作品与神话传说融合
1.版本：matlab2014/2019a/2024a 2.附赠案例数据可直接运行matlab程序。 3.代码特点：参数化编程、参数可方便更改、代码编程思路清晰、注释明细。 4.适用对象：计算机，电子信息工程、数学等专业的大学生课程设计、期末大作业和毕业设计。
ADC推理软件AI程序
漫画作品与科幻元素融合
1.版本：matlab2014/2019a/2024a 2.附赠案例数据可直接运行matlab程序。 3.代码特点：参数化编程、参数可方便更改、代码编程思路清晰、注释明细。 4.适用对象：计算机，电子信息工程、数学等专业的大学生课程设计、期末大作业和毕业设计。
1.版本：matlab2014/2019a/2024a 2.附赠案例数据可直接运行matlab程序。 3.代码特点：参数化编程、参数可方便更改、代码编程思路清晰、注释明细。 4.适用对象：计算机，电子信息工程、数学等专业的大学生课程设计、期末大作业和毕业设计。
1.版本：matlab2014/2019a/2024a 2.附赠案例数据可直接运行matlab程序。 3.代码特点：参数化编程、参数可方便更改、代码编程思路清晰、注释明细。 4.适用对象：计算机，电子信息工程、数学等专业的大学生课程设计、期末大作业和毕业设计。
1.版本：matlab2014/2019a/2024a 2.附赠案例数据可直接运行matlab程序。 3.代码特点：参数化编程、参数可方便更改、代码编程思路清晰、注释明细。 4.适用对象：计算机，电子信息工程、数学等专业的大学生课程设计、期末大作业和毕业设计。
java-springboot+vue景区民宿预约系统实现源码（完整前后端+mysql+说明文档+LunW+PPT）.zip
在智慧城市建设的大潮中，智慧园区作为其中的璀璨明珠，正以其独特的魅力引领着产业园区的新一轮变革。想象一下，一个集绿色、高端、智能、创新于一体的未来园区，它不仅融合了科技研发、商业居住、办公文创等多种功能，更通过深度应用信息技术，实现了从传统到智慧的华丽转身。 智慧园区通过“四化”建设——即园区运营精细化、园区体验智能化、园区服务专业化和园区设施信息化，彻底颠覆了传统园区的管理模式。在这里，基础设施的数据收集与分析让管理变得更加主动和高效，从温湿度监控到烟雾报警，从消防水箱液位监测到消防栓防盗水装置，每一处细节都彰显着智能的力量。而远程抄表、空调和变配电的智能化管控，更是在节能降耗的同时，极大地提升了园区的运维效率。更令人兴奋的是，通过智慧监控、人流统计和自动访客系统等高科技手段，园区的安全防范能力得到了质的飞跃，让每一位入驻企业和个人都能享受到“拎包入住”般的便捷与安心。 更令人瞩目的是，智慧园区还构建了集信息服务、企业服务、物业服务于一体的综合服务体系。无论是通过园区门户进行信息查询、投诉反馈，还是享受便捷的电商服务、法律咨询和融资支持，亦或是利用云ERP和云OA系统提升企业的管理水平和运营效率，智慧园区都以其全面、专业、高效的服务，为企业的发展插上了腾飞的翅膀。而这一切的背后，是大数据、云计算、人工智能等前沿技术的深度融合与应用，它们如同智慧的大脑，让园区的管理和服务变得更加聪明、更加贴心。走进智慧园区，就像踏入了一个充满无限可能的未来世界，这里不仅有科技的魅力，更有生活的温度，让人不禁对未来充满了无限的憧憬与期待。
边境自驾游异国风情深度体验
在智慧城市建设的大潮中，智慧园区作为其中的璀璨明珠，正以其独特的魅力引领着产业园区的新一轮变革。想象一下，一个集绿色、高端、智能、创新于一体的未来园区，它不仅融合了科技研发、商业居住、办公文创等多种功能，更通过深度应用信息技术，实现了从传统到智慧的华丽转身。 智慧园区通过“四化”建设——即园区运营精细化、园区体验智能化、园区服务专业化和园区设施信息化，彻底颠覆了传统园区的管理模式。在这里，基础设施的数据收集与分析让管理变得更加主动和高效，从温湿度监控到烟雾报警，从消防水箱液位监测到消防栓防盗水装置，每一处细节都彰显着智能的力量。而远程抄表、空调和变配电的智能化管控，更是在节能降耗的同时，极大地提升了园区的运维效率。更令人兴奋的是，通过智慧监控、人流统计和自动访客系统等高科技手段，园区的安全防范能力得到了质的飞跃，让每一位入驻企业和个人都能享受到“拎包入住”般的便捷与安心。 更令人瞩目的是，智慧园区还构建了集信息服务、企业服务、物业服务于一体的综合服务体系。无论是通过园区门户进行信息查询、投诉反馈，还是享受便捷的电商服务、法律咨询和融资支持，亦或是利用云ERP和云OA系统提升企业的管理水平和运营效率，智慧园区都以其全面、专业、高效的服务，为企业的发展插上了腾飞的翅膀。而这一切的背后，是大数据、云计算、人工智能等前沿技术的深度融合与应用，它们如同智慧的大脑，让园区的管理和服务变得更加聪明、更加贴心。走进智慧园区，就像踏入了一个充满无限可能的未来世界，这里不仅有科技的魅力，更有生活的温度，让人不禁对未来充满了无限的憧憬与期待。
,,CAD、DXF导图，自动进行位置路径规划，源码可进行简单功能添加实现设备所需功能，已经在冲孔机，点胶机上应用，性价比超高。 打孔机实测一分钟1400个孔 ,CAD、DXF导图；自动位置路径规划；源码功能添加；设备功能实现；冲孔机点胶机应用；高性价比。,CAD导图DXF，自动规划位置路径，实测打孔速度惊人！性价比超高冲孔机实现多功能定制