Flash图表组件FusionCharts帮助文档十三：调整图表比例（百分比）
来源：互联网 发布：英文网络用语 编辑：程序博客网 时间：2024/05/16 11:51
FusionCharts图表不仅允许你设置图表宽度和高度的绝对像素值，还允许设置宽度和高度的百分比值。 FusionCharts图表会根据父容器元素的尺寸自动调整图表的百分比大小。本文主要介绍如何利用代码方式动态调整FusionCharts图表的百分比大小。
<div id="chartContainer" style="width:800px; height:300px;">
This text is replaced by the chart
</div>
<script type="text/javascript"><!--
var myChart = new FusionCharts("Column3D.swf", "myChartId", "80%", "100%", "0", "1");
myChart.setXMLUrl("Data.xml");
myChart.render("chartContainer");
// --></script>
在上述代码中，我们指定图表的宽度为80%和高度为100%。"chartContainer" 是图表的容器元素。因此，图表的百分比宽度和高度取决于DIV的尺寸。
在上面的示例中，我们将DIV的宽度和高度分别设置为800像素和300像素。因此，图表的大小将自动调整为 640x300 像素，图表效果如下：
动态调整图表大小：
当图表的父容器大小改变时，FusionCharts XT能够自动地调整图表大小。操作步骤如下：
1、设置图表百分比
2、设置HTML图表容器，当调整浏览器大小时，图表容器大小也会自动调整。
当调整图表容器大小时，图表也会动态调整其大小。在下面的例子中，图表以全屏方式呈现在Web浏览器中。如果调整浏览器的大小，图表也会根据浏览器的大小而进行调整。
<html>
<head>
<title>My First chart using FusionCharts XT
- Using dynamically resizable chart</title>
<script type="text/javascript" src="FusionCharts/FusionCharts.js"></script>
</head>
<body style="height:100%;">
<div id="chartContainer" style="height:100%;" >
FusionCharts XT will load here
</div>
<script type="text/javascript"><!--
var myChart = new FusionCharts("FusionCharts/Area2D.swf", "myChartId", "100%", "100%", "0", "1");
myChart.setXMLUrl("LargeData.xml");
myChart.render("chartContainer");
// --></script>
</body>
</html>
- Flash图表组件FusionCharts帮助文档十三：调整图表比例（百分比）
- Flash图表组件FusionCharts帮助文档汇总
- Flash图表组件FusionCharts帮助文档十二:创建透明图表
- Flash图表组件FusionCharts帮助文档九：网格组件用法
- Flash图表控件FusionCharts调整图表百分比大小
- Flash图表组件FusionCharts帮助文档三：在iPhone/iPad中生成JavaScript图表
- Flash图表组件FusionCharts帮助文档四：在图表中添加货币符号
- Flash图表组件FusionCharts帮助文档七：加载多个图表文件
- Flash图表组件FusionCharts帮助文档十一:Excel静态数据变为动态图表
- Flash图表FusionCharts帮助文档（持续更新中）
- Flash图表组件FusionCharts帮助文档一：调用静态方法RenderChart
- Flash图表组件FusionCharts帮助文档一：调用静态方法RenderChart
- Flash图表组件FusionCharts帮助文档二：为饼图/环形图添加图例
- Flash图表组件FusionCharts帮助文档五：用BOM实现多语言(UTF-8)
- Flash图表组件FusionCharts帮助文档六：在地图上作标记
- Flash图表组件FusionCharts帮助文档八：添加向下钻取链接
- Flash图表组件FusionCharts帮助文档十：将柱状图转换为饼状图
- 基于Flash的图表组件-FusionCharts
- ARM MMU工作原理剖析
- Flash图表组件FusionCharts帮助文档十：将柱状图转换为饼状图
- TwinCAT与AMD的处理器的不兼容问题
- Flash图表组件FusionCharts帮助文档十一:Excel静态数据变为动态图表
- Flash图表组件FusionCharts帮助文档十二:创建透明图表
- Flash图表组件FusionCharts帮助文档十三：调整图表比例（百分比）
- Android Password Field Example
- TOJ 4224 Cryptologist
- Make选项及makefile常用变量
- Linux 链接脚本详解
- OATH FOR MYSELF(Updata all the time)
- Same Tree
- SQL Server 2012安装Northwind示例数据库
- 对日外包十日谈 之 我所了解的对日外包企业
