2
我是Highcharts的新手，並試圖學習如何在PHP和MySQL中使用它。我想從數組中的一些示例數據中顯示一個簡單的柱形圖。但是，我遇到了一些問題實現這一點。這些列未顯示在圖表中，我正在獲取圖例中空白的額外標籤。如果有人能夠幫助我清理這些代碼，使其工作並提供示例代碼和評論以幫助我們更好地理解它，那將會有很大的幫助。我相信其他幾個人也在尋找一個類似的例子。我瀏覽過這個網站，並通過HighCharts論壇和示例，無法找到我正在尋找的內容，這可以更好地幫助我學習如何使用PHP和MySQL創建動態列類型圖表。如果你可以提前幫助很多謝謝。HIghCharts PHP MySQL
這是我的代碼，我知道它有幾個問題，我試圖保持這個很簡單的例子，很容易讓新手和學生理解。非常感謝您的幫助：
我的樣本數據包含該人的姓氏和銷售額。它是在一個TSV格式和陣列看起來像這樣：李四3567右5476 - 約翰遜4351布朗2945
data.php
<?php
$con = mysql_connect("localhost","root","");
if (!$con) {
die('Could not connect: ' . mysql_error());
}
mysql_select_db("test", $con);
$result = mysql_query("SELECT * FROM user");
while($row = mysql_fetch_array($result)) {
echo $row['lastname'] . "\t" . $row['sales']. "\n";
}
mysql_close($con);
?>
的index.php
<!DOCTYPE html><html><head>
</head><body>
<div id="container" style="height: 400px; width: 900px"></div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script src="http://www.highcharts.com/js/highcharts.src.js"></script>
<script>
jQuery(function($) {
var options = {
chart: {renderTo: 'container', defaultSeriesType:'column', height: 400},
title: {text: 'Sales Performance'},
xAxis: {title: {text: 'Sales Peoples'}, type: 'linear'},
yAxis: {title: {text: 'Dollars'}, plotLines: [{ value: 0, width: 1, color: '#808080'}]},
tooltip: {
formatter: function() {
return '<b>'+ this.series.name +'</b><br/>'+'('+this.x +' : '+ this.y +')';
}
},
legend: {layout: 'vertical', align: 'left', verticalAlign: 'top', x: 40, y: 100, borderWidth: 0, width: 300 },
series: []
};
jQuery.get('data.php', null, function(tsv) {
var data = {};
tsv = tsv.split(/\n/g); // split into rows
for (var row=0, rows=tsv.length; row<rows; row++) {
var line = tsv[row].split(/\t/g), // split into columns
series_name = line[0],
x = Number(line[1]),
y = Number(line[2]);
if (!data[series_name]) data[series_name] = [];
data[series_name].push([x,y]);
//alert("The data is: "+series_name)
}
for (var series_name in data) {
options.series.push({
name: series_name,
data: data[series_name]
});
}
new Highcharts.Chart(options);
});
});
</script>
</body></html>
教程可以幫你http://sgeek.org/create-chart-using-mysql-highcharts/ –