0
我無法在我的aspx頁面上加載多個條形圖。該頁面只加載一個圖表。如果我評論第一張圖表的代碼，那麼它會加載第二張圖表，這同樣適用於圖表3.下面是我的代碼，請幫忙？ ：Google Chart - 我無法在一個頁面上加載多個條形圖
<asp:Content ID="Content2" ContentPlaceHolderID="cphMainMenuUserMaster" runat="server">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<body>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<div style="width: 1064px; height: 150px; margin: 0 auto;">
<UControl:ucMenu ID="ucMenuOption" runat="server" />
<div style="width: 850px; float: right; border-radius: 4px; border: 1px solid #e1e1e1">
<div style="height: 30px; border: 1px solid #e1e1e1; border-top: none; border-right: none;
border-left: none; text-align: center; background-image: url(../Images/panel_header.jpg);
background-repeat: repeat-x; color: #7bae23; font-weight: bold; font-size: 15px;
padding-top: 6px">
Weekly Graph
</div>
<div id="div_weekly_graph" style="width: 750px; height: 350px; margin-bottom: 20px;
margin-top: 20px; padding-left: 50px">
<%-- <img id="imgLoadingWeekly" alt="Loading Graph" src="../Images/graphLoadingIcon.gif"
style="position: relative; top: 70px" />--%>
</div>
<div style="height: 30px; border: 1px solid #e1e1e1; border-right: none; border-left: none;
text-align: center; background-image: url(../Images/panel_header.jpg); background-repeat: repeat-x;
color: #7bae23; font-weight: bold; font-size: 15px; padding-top: 6px">
Monthly Graph
</div>
<div id="div_monthly_graph" style="width: 800px; height: 400px; margin-bottom: 10px">
<%-- <img id="imgLoadingGraphMothly" alt="Loading Graph" src="../Images/graphLoadingIcon.gif"
style="position: relative; top: 70px" />--%>
</div>
<div style="height: 30px; border: 1px solid #e1e1e1; border-right: none; border-left: none;
text-align: center; background-image: url(../Images/panel_header.jpg); background-repeat: repeat-x;
color: #7bae23; font-weight: bold; font-size: 15px; padding-top: 6px">
Semi Annual Graph
</div>
<div id="div_semiannual_graph" style="width: 800px; height: 400px; margin-bottom: 10px">
<%-- <img id="imgLoadingGraphSemiAnnual" alt="Loading Graph" src="../Images/graphLoadingIcon.gif"
style="position: relative; top: 70px" />--%>
</div>
</div>
</div>
<script src="../Scripts/jquery-1.4.1.js" type="text/javascript"></script>
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load("visualization", "1.1", { packages: ["bar"] });
google.setOnLoadCallback(drawChart);
function drawChart() {
var data = google.visualization.arrayToDataTable([
['Year', 'Sales', 'Expenses', 'Profit', 'Test'],
['2014', 1000, 400, 200, 323],
['2015', 1170, 460, 250, 323],
['2016', 660, 1120, 300, 323],
['2017', 1030, 540, 350, 323],
['2017', 1030, 540, 350, 323],
['2017', 1030, 540, 350, 323]
]);
var data2 = google.visualization.arrayToDataTable([
['Year', 'Sales', 'Expenses', 'Profit', 'Test'],
['2014', 1000, 400, 200, 323],
['2015', 1170, 460, 250, 323],
['2016', 660, 1120, 300, 323],
['2017', 1030, 540, 350, 323],
['2017', 1030, 540, 350, 323],
['2017', 1030, 540, 350, 323]
]);
var options = {
chart: {
title: '',
subtitle: ''
}
};
var options2 = {
chart: {
title: '',
subtitle: ''
}
};
var chart = new google.charts.Bar(document.getElementById('div_weekly_graph'));
var chart2 = new google.charts.Bar(document.getElementById('div_semiannual_graph'));
chart.draw(data, options);
chart2.draw(data2, options2);
}
</script>
</body>
</asp:Content>