FusionCharts 技术文档-Data String Method

Data String Method：

 

在该方法中，整个图表数据（XML或JSON）被设置为一个字符串，并嵌入到图表的相同的页面。当图表呈现在一个页面或得到更新，从字符串读取图表数据，然后呈现图表。下图与下面介绍的步骤将帮助您更好地理解：

http://docs.fusioncharts.com/charts/contents/FirstChart/Images/dataEmbedMethod.jpg

1. 与数据URL方法不同，在这里，整个XML或JSON数据被嵌入在网页中的字符串包含表。这些数据可以被嵌入以各种方式，如：

·数据可以由动态数据源产生，如数据库等,由服务器端脚本嵌入到网页（同时创建页面）

·数据可以使用在页面本身JavaScript来创建，没有外部的依赖关系（例如，从HTML表单中创建图表时）产生

·可以使用各种Web API（应用程序接口），AJAX响应获取数据和存储字符串在页面本身

1. 图表一旦被加载在最终用户的计算机上或图表的数据需要更新时，它读取XML/ JSON字符串或JSON对象嵌入到网页使用JavaScript函数
2. 最后，呈现出所需的图表。

 

实际上Effectively，在这个过程中，你需要建立以下图表：

 

图表容器 Chart Container Page页 - 其中包含的HTML代码嵌入图表。它也包含了要使用的图表的XML数据。

图表SWF文件 - 你希望呈现的图表SWF文件。每个图表FusionCharts的XT是一个SWF文件，创建一个特定类型的图表。例如，如果你想创建3D柱形图，你会需要的SWF文件称为Column3D.swf的。

FusionCharts的JavaScript文件 - 这些文件有助于图表SWF文件嵌入在你的HTML页面和渲染的JavaScript（HTML5）后备图。被命名为名 FusionCharts.js, FusionCharts.HC.js, FusionCharts.HC.Widgets.jsand jquery.min.js.的文件。

Sample Usage of Data String method using FusionCharts JavaScript Class

FusionCharts的JavaScript类提供了其他功能的实现是相同的：setJSONData setChartData，setDataXML（不赞成）

 

FusionCharts JavaScript API – Functions：网址http://docs.fusioncharts.com/charts/

Using various server side scripts

To ease embedding of charts in your web pages, FusionCharts XT provides wrapper classes ready for various server-side scripts like ASP, ASP.NET C#, ASP.NET VB.NET, PHP, J2EE, Ruby on Rails and ColdFusion. Moreover, in ASP and PHP, the APIs allow you to connect to arrays and databases and even dynamically build XML data which can directly be provided to chart.

Here, we provide highlights of code snippets that are used in each technology to embed FusionCharts XT using Data String method.

Using ASP

Call renderChart("http://www.cnblogs.com/FusionCharts/Column3D.swf", "", chartDataAsString, "myFirst", 600, 300, false, false)

Read more.

Using ASP.NET C#

FusionCharts.RenderChart("../FusionCharts/Column3D.swf", "", chartDataAsString, "myFirst", "600", "300", false, false);

Read more.

Using ASP.NET VB

FusionCharts.RenderChart("../FusionCharts/Column3D.swf", "", chartDataAsString, "myFirst", "600", "300", False, False)

Read more.

Using PHP

renderChart("http://www.cnblogs.com/FusionCharts/Column3D.swf", "", $chartDataAsString, "myFirst", 600, 300, false, false);

Read more.

Using J2EE

<jsp:include page="../Includes/FusionChartsRenderer.jsp" flush="true">

        <jsp:param name="chartSWF" value="http://www.cnblogs.com/FusionCharts/Column3D.swf" />

        <jsp:param name="strURL" value="" />

        <jsp:param name="strXML" value=chartDataAsString />

        <jsp:param name="chartId" value="myFirst" />

        <jsp:param name="chartWidth" value="600" />

        <jsp:param name="chartHeight" value="300" />

        <jsp:param name="debugMode" value="false" />

        <jsp:param name="registerWithJS" value="false" />

</jsp:include>

Read more.

Using ColdFusion

<cfoutput>#renderChart("http://www.cnblogs.com/FusionCharts/Column3D.swf", "", chartDataAsString, "myFirst", 600, 300, false, false)#</cfoutput>

Read more.

Using Ruby on Rails

render_chart '/FusionCharts/Column3D.swf', '', chartDataAsString, 'configuredChart', 600, 300, false, false

Read more.

 

转载于:https://www.cnblogs.com/leecheeme/archive/2013/04/27/3046347.html