一：直接的HTML代码（如下所示）来嵌入图表:
<html>
...
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" width="900" height="300" id="Column3D" >
<param name="movie" value="../FusionCharts/Column3D.swf" />
<param name="FlashVars" value="&dataURL=Data.xml">
<param name="quality" value="high" />
<embed src="../FusionCharts/Column3D.swf" flashVars="&dataURL=Data.xml" quality="high" width="900" height="300" name="Column3D" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />
</object>
...
</html>
正如上面你所见到的, 我们使用<OBJECT> 和 <EMBED> 标记在HTML页面中来嵌入图表. 这种嵌入方式我们称之为直接的HTML嵌入式.
然而，在最近的更新中使用IE浏览器处理ActiveX对象（Flash是ActiveX对象），最终用户将首先需要单击该图表以激活它。下面是一个例子所示:
直到用户点击图表后，他才能进行交互图表工作即使用工具提示和链接。这有可能在你图表链接中误导你。.
二：JavaScript解决方案
由于上述的“点击激活的解决办法...”问题，您需要在您的HTML网页中使用JavaScript嵌入FusionCharts. 当您使用JavaScript来写一个ActiveX对象的标记，Internet Explorer中不显示上述边界和消息，并且对象也不需要通过点击激活。
为了方便起见，我们已经提供了一个叫做FusionChart de Javascript类，它可以帮助你以一种用户友好的方式工作。这个类在下载包>JSClass文件夹中。这个文件名为FusionCharts.js.
我们不会讨论这个类的技术细节。如果你对此感兴趣，你可以直接查看这个JavaScript类的源文件。这里我们会看到使用这个类的例子.
现在让我们以修改我们以前三维柱状图（我的第一个图表）为例，使用此JavaScript类嵌入图表.
用FusionCharts.js全局访问
由于你包含FusionCharts的网页现在需要使用JavaScript类，把JS文件放在根目录是个好主意，因为它是全局可访问的.我们复制此文件到我们上一个创建的FusionCharts文件夹中，其中已经包含了SWF图表文件。复制到这里可以确保所有的图表和这个JS文件能从这个核心位置被所有页面访问。
在HTML页面中使用这个类
现在我们来修改我们的HTML页面来使用这个类来嵌入图表.
创建一个Chart.html的副本并另存为JSChart.html，并把它们保存在同一个文件夹中。进行下面的改动:
<html>
<head>
<script language="JavaScript" src="../FusionCharts/FusionCharts.js"></script>
</head>
<body bgcolor="#ffffff">
<div id="chartdiv" align="center">The chart will appear within this DIV. This text will be replaced by the chart.</div>
<script type="text/javascript">
var myChart = new FusionCharts("../FusionCharts/Column3D.swf", "myChartId", "900", "300", "0", "0");
myChart.setDataURL("Data.xml");
myChart.render("chartdiv");
</script>
</body>
</html>
在这里，我们首先包括FusionCharts的JavaScript类文件:
<script language="JavaScript" src="../FusionCharts/FusionCharts.js"></script>
创建一个具有为ID的DIV(上面这个例子中叫chartdiv).
<div id="chartdiv" align="center">...</div>
图表实例使用以下代码:
var myChart = new FusionCharts("../FusionCharts/Column3D.swf", "myChartId", "900", "300", "0", "0");
在这里，myChart是JavaScript对象的名字，它包含到我们的图表中.
我们使用如下的参数:
我们打算使用swf文件的URL来指定图表类型
为图表指定ID,你可以为图表指定任意ID.只要确保如果你在一个HTML页面中使用多个图表，每个图表都具有唯一的ID
指定图表的宽高.
最后两个参数是debugMode和registerWithJS，一般设置为0。我们将稍后解释这些参数.
为图表传递XML数据路径使用下面的方式:
myChart.setDataURL("Data.xml");
最后通过调用类的render()方法，指定图表想要显示的DIV的ID来进行渲染.
myChart.render("chartdiv");
现在当你在IE中运行这个页面，你会看到同样的3D柱状图-但是没有“点击激活”的信息.此外，你也无须点击此图表来激活。
<html>
...
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" width="900" height="300" id="Column3D" >
<param name="movie" value="../FusionCharts/Column3D.swf" />
<param name="FlashVars" value="&dataURL=Data.xml">
<param name="quality" value="high" />
<embed src="../FusionCharts/Column3D.swf" flashVars="&dataURL=Data.xml" quality="high" width="900" height="300" name="Column3D" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />
</object>
...
</html>
正如上面你所见到的, 我们使用<OBJECT> 和 <EMBED> 标记在HTML页面中来嵌入图表. 这种嵌入方式我们称之为直接的HTML嵌入式.
然而，在最近的更新中使用IE浏览器处理ActiveX对象（Flash是ActiveX对象），最终用户将首先需要单击该图表以激活它。下面是一个例子所示:
直到用户点击图表后，他才能进行交互图表工作即使用工具提示和链接。这有可能在你图表链接中误导你。.
二：JavaScript解决方案
由于上述的“点击激活的解决办法...”问题，您需要在您的HTML网页中使用JavaScript嵌入FusionCharts. 当您使用JavaScript来写一个ActiveX对象的标记，Internet Explorer中不显示上述边界和消息，并且对象也不需要通过点击激活。
为了方便起见，我们已经提供了一个叫做FusionChart de Javascript类，它可以帮助你以一种用户友好的方式工作。这个类在下载包>JSClass文件夹中。这个文件名为FusionCharts.js.
我们不会讨论这个类的技术细节。如果你对此感兴趣，你可以直接查看这个JavaScript类的源文件。这里我们会看到使用这个类的例子.
现在让我们以修改我们以前三维柱状图（我的第一个图表）为例，使用此JavaScript类嵌入图表.
用FusionCharts.js全局访问
由于你包含FusionCharts的网页现在需要使用JavaScript类，把JS文件放在根目录是个好主意，因为它是全局可访问的.我们复制此文件到我们上一个创建的FusionCharts文件夹中，其中已经包含了SWF图表文件。复制到这里可以确保所有的图表和这个JS文件能从这个核心位置被所有页面访问。
在HTML页面中使用这个类
现在我们来修改我们的HTML页面来使用这个类来嵌入图表.
创建一个Chart.html的副本并另存为JSChart.html，并把它们保存在同一个文件夹中。进行下面的改动:
<html>
<head>
<script language="JavaScript" src="../FusionCharts/FusionCharts.js"></script>
</head>
<body bgcolor="#ffffff">
<div id="chartdiv" align="center">The chart will appear within this DIV. This text will be replaced by the chart.</div>
<script type="text/javascript">
var myChart = new FusionCharts("../FusionCharts/Column3D.swf", "myChartId", "900", "300", "0", "0");
myChart.setDataURL("Data.xml");
myChart.render("chartdiv");
</script>
</body>
</html>
在这里，我们首先包括FusionCharts的JavaScript类文件:
<script language="JavaScript" src="../FusionCharts/FusionCharts.js"></script>
创建一个具有为ID的DIV(上面这个例子中叫chartdiv).
<div id="chartdiv" align="center">...</div>
图表实例使用以下代码:
var myChart = new FusionCharts("../FusionCharts/Column3D.swf", "myChartId", "900", "300", "0", "0");
在这里，myChart是JavaScript对象的名字，它包含到我们的图表中.
我们使用如下的参数:
我们打算使用swf文件的URL来指定图表类型
为图表指定ID,你可以为图表指定任意ID.只要确保如果你在一个HTML页面中使用多个图表，每个图表都具有唯一的ID
指定图表的宽高.
最后两个参数是debugMode和registerWithJS，一般设置为0。我们将稍后解释这些参数.
为图表传递XML数据路径使用下面的方式:
myChart.setDataURL("Data.xml");
最后通过调用类的render()方法，指定图表想要显示的DIV的ID来进行渲染.
myChart.render("chartdiv");
现在当你在IE中运行这个页面，你会看到同样的3D柱状图-但是没有“点击激活”的信息.此外，你也无须点击此图表来激活。
91
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
