首先需要在 HTML 页面中引入 ECharts 相关代码：
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>ECharts Demo</title> </head> <body> <div id="chart"></div> <script src="https://cdn.bootcdn.net/ajax/libs/echarts/4.9.0/echarts.min.js"></script> <script src="https://cdn.bootcdn.net/ajax/libs/echarts/4.9.0/echarts-gl.min.js"></script> <script> // 代码实现部分 </script> </body> </html>
接下来需要使用 AJAX 获取 MySQL 数据库中的内容，具体代码如下：
// 引入 MySQL 模块
const mysql = require('mysql');
// 创建连接池
const pool = mysql.createPool({
connectionLimit: 10,
host : 'localhost',
user : 'root',
password : '123456',
database : 'test'
});
// 发送 SQL 查询语句
pool.query('SELECT * FROM `table`', function (error, results, fields) {
if (error) throw error;
// 处理查询结果
const data = results.map(item =>[item.x, item.y]);
// 将数据绑定到 ECharts 中进行展示
const chart = echarts.init(document.getElementById('chart'));
chart.setOption({
title: {
text: 'MySQL 数据库内容展示'
},
tooltip: {
trigger: 'item',
axisPointer: {
type: 'cross'
}
},
xAxis: {
type: 'value',
axisLabel: {
formatter: '{value}'
}
},
yAxis: {
type: 'value',
axisLabel: {
formatter: '{value}'
}
},
series: [{
data: data,
type: 'scatter'
}]
});
});在发起 AJAX 请求时，需要先引入 Node.js 中的 MySQL 模块，并根据 MySQL 数据库的连接信息创建连接池。将查询结果处理后，可以得到一个二维数组，然后将其绑定到 ECharts 中进行展示。
通过以上代码，就可以实现 ECharts 获取 MySQL 数据库中的内容，并将其展示为散点图或其他类型的图表。