// 假设您已经创建了一个 ECharts 实例,例如 myChart
// 初始化 ECharts 配置
let option = {
xAxis: {
type: 'category',
data: [], // 初始为空数组
},
yAxis: {
type: 'value',
},
series: [{
type: 'line',
data: [], // 初始为空数组
}],
};
// 设置 ECharts 配置
myChart.setOption(option);
// 数据缓存数组,用于存储实时请求的数据
let dataCache = [];
// 模拟新数据到达的函数
function newDataArrives(timestamp, value) {
// 添加新数据到缓存数组
dataCache.push({ timestamp: timestamp, value: value });
// 获取当前时间戳
let currentTime = Date.now();
// 过滤出最近 48 小时内的数据
dataCache = dataCache.filter(data => currentTime - data.timestamp <= 48 * 60 * 60 * 1000);
// 根据时间戳排序数据
dataCache.sort((a, b) => a.timestamp - b.timestamp);
// 更新图表数据
updateChart();
}
// 更新图表数据函数
function updateChart() {
// 根据最新数据更新 x 轴和 y 轴数据
let xAxisData = [];
let seriesData = [];
dataCache.forEach(data => {
xAxisData.push(new Date(data.timestamp).toLocaleString()); // 使用适当的时间格式
seriesData.push(data.value); // 根据实际数据结构获取值
});
// 更新 ECharts 配置
myChart.setOption({
xAxis: {
data: xAxisData,
},
series: [{
data: seriesData,
}],
});
}
// 模拟实时数据到达,timestamp 表示时间戳,value 表示实际数据值
// 您需要调用 newDataArrives(timestamp, value) 函数来添加新数据到图表中
// 假设有新数据到达时,可以通过某种方式获得时间戳和数据值
let timestamp = Date.now() - 24 * 60 * 60 * 1000; // 示例:假设新数据的时间戳是当前时间的前一天
let value = 42; // 示例:假设新数据的值为 42
// 添加新数据到图表中
newDataArrives(timestamp, value);
08-07
2122
![](https://csdnimg.cn/release/blogv2/dist/pc/img/readCountWhite.png)
01-20
9485
![](https://csdnimg.cn/release/blogv2/dist/pc/img/readCountWhite.png)
“相关推荐”对你有帮助么?
-
非常没帮助
-
没帮助
-
一般
-
有帮助
-
非常有帮助
提交