本文将介绍如何使用JavaScript创建柱状图和折线图。这种图表在数据可视化中非常常见,可以帮助用户直观地理解数据。
图表脚本需要在支持JavaScript的浏览器中运行。以下是支持此脚本的浏览器版本:
请注意,此脚本有一些限制:
要使用此图表脚本,需要在HTML文档中包含以下代码:
<script language="JavaScript" src="Graph.js"></script>
接下来,可以使用以下HTML和JavaScript代码来创建图表:
<table align="center">
<tr>
<td width="5%"></td>
<td id="here" align="center"></td>
<td valign="top" width="5%">
<a href="">帮助</a>
</td>
</tr>
</table>
<script language="JavaScript">
var bg = new Graph(10);
bg.parent = document.getElementById('here');
bg.title = '当前前10服务器';
bg.xCaption = '服务器';
bg.yCaption = '每个服务器的连接数per Server';
bg.xValues[0] = [188, '里约热内卢'];
bg.xValues[1] = [180, '圣保罗'];
bg.xValues[2] = [159, '巴西利亚'];
bg.xValues[3] = [67, '贝洛奥里藏特'];
bg.xValues[4] = [66, '福塔莱萨'];
bg.xValues[5] = [62, '马瑙斯'];
bg.xValues[6] = [48, '阿雷格里港'];
bg.xValues[7] = [26, '库里提巴'];
bg.xValues[8] = [16, '萨尔瓦多'];
bg.xValues[9] = [11, '纳塔尔'];
bg.showLine = true;
bg.showBar = true;
bg.orientation = 'horizontal'; // 或 'vertical';
bg.draw();
</script>