如何在这个动态JQuery、CSS和HTML条形图中添加更多条
我正在尝试在我的web应用程序中使用。我想用它来显示我公司每个部门的月度统计数据。因此，在图例中，我可以列出部门名称（我有7个部门）。现在我想在图中创建7个条形图，但我还不能这样做。有人能告诉我如何在图表中添加更多的条吗 我的HTML代码：如何在这个动态JQuery、CSS和HTML条形图中添加更多条,jquery,html,css,Jquery,Html,Css,我正在尝试在我的web应用程序中使用。我想用它来显示我公司每个部门的月度统计数据。因此，在图例中，我可以列出部门名称（我有7个部门）。现在我想在图中创建7个条形图，但我还不能这样做。有人能告诉我如何在图表中添加更多的条吗 我的HTML代码： <!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewpor
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=1024">
<title>Example 3 - Animated Bar Chart via jQuery</title>
<link rel="stylesheet" href="css/common.css">
<link rel="stylesheet" href="css/03.css">
</head>
<body>
<div class="toggles">
<p><a href="#" id="reset-graph-button">Reset graph</a>
Mouse over the bars to display information.</p>
</div>
<div id="wrapper">
<div class="chart">
<h2>PMOD Divisions' Safety Training Record</h2>
<table id="data-table" border="1" cellpadding="10" cellspacing="0" summary="The effects of the zombie outbreak on the populations of endangered species from 2012 to 2016">
<caption>Population in thousands</caption>
<thead>
<tr>
<td> </td>
<th scope="col">September</th>
<th scope="col">October</th>
<th scope="col">November</th>
<th scope="col">December</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">A</th>
<td>4080</td>
<td>6080</td>
<td>6240</td>
</tr>
<tr>
<th scope="row">E</th>
<td>5680</td>
<td>6880</td>
<td>5760</td>
</tr>
<tr>
<th scope="row">D</th>
<td>1040</td>
<td>1760</td>
<td>2880</td>
</tr>
<tr>
<th scope="row">PE</th>
<td>5680</td>
<td>6880</td>
<td>5760</td>
</tr>
<tr>
<th scope="row">OD</th>
<td>5680</td>
<td>6880</td>
<td>5760</td>
</tr>
<tr>
<th scope="row">ES</th>
<td>5680</td>
<td>6770</td>
<td>5760</td>
</tr>
<tr>
<th scope="row">SS</th>
<td>5680</td>
<td>6880</td>
<td>5760</td>
</tr>
</tbody>
</table>
</div>
</div>
<!-- JavaScript at the bottom for fast page loading -->
<!-- Grab jQuery from Google -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<!-- Example JavaScript -->
<script src="js/03.js"></script>
</body>
</html>
示例3-通过jQuery制作的动画条形图
将鼠标悬停在条上以显示信息
PMOD部门的安全培训记录
以千计的人口
九月
十月
十一月
十二月
A.
4080
6080
6240
E
5680
6880
5760
D
1040
1760
2880
体育课
5680
6880
5760
OD
5680
6880
5760
锿
5680
6770
5760
党卫军
5680
6880
5760