要在ECharts中動態獲取數據庫數據，你需要使用一種后端語言（如PHP、Python等）作為中間層來連接數據庫并提供數據給前端的JavaScript代碼。下面是一種基本的步驟和示例：
1. 創建后端腳本：
使用你熟悉的后端語言（比如PHP）編寫一個腳本文件。
在腳本中連接到數據庫，并執行查詢語句來獲取所需的數據。
將查詢結果轉換為JSON格式，并將其輸出到瀏覽器。
<?php// 連接到數據庫
$conn = new mysqli("localhost", "username", "password", "database_name");
// 查詢并獲取數據
$result = $conn->query("SELECT * FROM your_table");
$data = array();
while ($row = $result->fetch_assoc()) {
$data[] = $row;
}
// 輸出數據為JSON格式
header('Content-Type: application/json');
echo json_encode($data);
// 關閉數據庫連接
$conn->close();
?>
2. 在前端頁面中使用JavaScript獲取后端數據：
在HTML文件中引入ECharts庫和jQuery或其他Ajax庫。
創建一個包含ECharts圖表的容器元素。
使用JavaScript代碼向后端腳本發送Ajax請求，并處理返回的數據。
使用ECharts提供的API在圖表中顯示數據。
<!DOCTYPE html><html>
<head>
<!-- 引入ECharts庫 -->
<script src="https://cdn.jsdelivr.net/npm/echarts@5.2.1/dist/echarts.min.js"></script>
<!-- 引入jQuery庫 -->
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
</head>
<body>
<!-- 創建一個用于顯示圖表的容器 -->
<div id="chartContainer" style="width: 600px; height: 400px;"></div>
<script>
// 使用Ajax請求后端數據
$.ajax({
url: "your_backend_script.php",
type: "GET",
dataType: "json",
success: function (data) {
// 處理返回的數據，并在ECharts中展示
var chartContainer = document.getElementById("chartContainer");
var myChart = echarts.init(chartContainer);
var option = {
// 根據需求設置ECharts的配置項和數據
series: [{
data: data,
type: 'bar'
}]
};
myChart.setOption(option);
}
});
</script>
</body>
</html>
上述示例代碼中使用了PHP作為后端語言，你可以根據你的實際情況選擇使用其他后端語言。另外，確保你已經正確安裝了ECharts庫和相應的數據庫驅動程序。
