-1
我在同一個.html頁面上有兩個條形圖,但第一個圖表覆蓋了第二個圖表。只顯示1個圖表。我不想使用iFrames,並且我已經使這些函數/變量具有唯一性。我還有什麼遺漏?不同數據集的多個Google圖表
<script type="text/javascript">
// Load the Visualization API and the piechart package.
google.charts.load('current', {'packages':['corechart']});
// Set a callback to run when the Google Visualization API is loaded.
google.charts.setOnLoadCallback(drawCycleStatusChart);
function drawCycleStatusChart() {
var jsonCycleData = $.ajax({
url: "cycleStatus.php",
dataType: "json",
async: false
}).responseText;
var jsonCycleObj = eval(jsonCycleData);
console.log(typeof jsonCycleData);
// Create our data table out of JSON data loaded from server.
var dataCycle = new google.visualization.arrayToDataTable(jsonCycleObj);
var optionsCycle = {
//isStacked: 'percent',
orientation: 'horizontal',
height: 600,
chartArea: {height: 500},
width: '100%',
fontName: 'Arial',
fontSize: 15,
annotations: {
textStyle: {fontSize: 10, fontName: 'Calibri'}
},
legend: {position: 'top', maxLines: 4},
hAxis: {
minValue: 0,
//title: 'Web UI Release Night Test Cycles in Production',
//titleTextStyle: {fontSize: 25, bold: true},
textStyle: {fontSize: 15, bold: false}
}
};
// Instantiate and draw our chart, passing in some options.
var chartCycle = new google.visualization.ColumnChart(document.getElementById('cycle_status'));
chartCycle.draw(dataCycle, optionsCycle);
}
// Load the Visualization API and the piechart package.
google.charts.load('current', {'packages':['corechart']});
// Set a callback to run when the Google Visualization API is loaded.
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
var jsonData = $.ajax({
url: "executionStatus.php",
dataType: "json",
async: false
}).responseText;
var jsonObj = eval(jsonData);
console.log(typeof jsonData);
// Create our data table out of JSON data loaded from server.
var data = new google.visualization.arrayToDataTable(jsonObj);
var options = {
isStacked: 'percent',
orientation: 'horizontal',
height: 600,
chartArea: {height: 300},
//width: '100%',
fontName: 'Arial',
fontSize: 15,
annotations: {
textStyle: {fontSize: 10, fontName: 'Calibri'}
},
legend: {position: 'top', maxLines: 4},
hAxis: {
minValue: 0,
//title: 'Web UI Release Night Test Cycles in Production',
//titleTextStyle: {fontSize: 25, bold: true},
textStyle: {fontSize: 15, bold: false}
}
};
// Instantiate and draw our chart, passing in some options.
var chart = new google.visualization.ColumnChart(document.getElementById('stacked_bar'));
chart.draw(data, options);
}
</script>
<div id="cycle_status"</div>
<div id="stacked_bar"></div>
發現我的錯誤! –
你應該在這裏發佈它爲他人着想或刪除問題 – happymacarts