feat(dashboard): 添加后台仪表板功能并优化数据分析

- 新增 dashboard.js 文件实现前端图表展示功能
- 添加彩球渲染和颜色映射功能
- 实现数据加载和渲染逻辑
- 添加多种统计图表包括冷热号码、比例分析、生肖排名等
- 重构区域转移动态数据方法
- 更新区域到区域颜色转移概率计算逻辑
- 优化转移概率数据结构和显示方式
- 添加热力图和各种统计图表的响应式支持
This commit is contained in:
2026-04-26 00:14:50 +08:00
parent c3e430a24b
commit 8d9161eb1a
2 changed files with 39 additions and 41 deletions
+10 -11
View File
@@ -131,24 +131,23 @@ define(['jquery'], function ($) {
html += '</tbody></table></div>';
}
html += '</div>';
// 下方:区域→波色交叉转移
// 下方:区域→区域转移矩阵,单元格内显示波色概率
var ztc = data.zonetocolortransition;
if (ztc && ztc.matrix && ztc.matrix.length > 0) {
html += '<div style="margin-top:20px;font-size:12px;color:#999;margin-bottom:8px;">区域→波色交叉转移(共 ' + ztc.total_transitions + ' 次</div>';
html += '<table class="table table-bordered table-condensed text-center" style="max-width:500px;margin:0 auto;"><thead><tr><th style="width:80px;position:relative;"><div style="width:100%;height:35px;border-bottom:1px solid #e5e5e5;position:relative;"><span style="position:absolute;top:2px;right:5px;font-size:12px;">波色</span><span style="position:absolute;bottom:2px;left:5px;font-size:12px;">特码</span></div></th>';
var cwColors2 = ['#e74c3c', '#3498db', '#2ecc71'];
for (var z = 0; z < ztc.colors.length; z++) {
html += '<th><span style="color:' + cwColors2[z] + '">' + ztc.colors[z] + '</span></th>';
html += '<div style="margin-top:20px;font-size:12px;color:#999;margin-bottom:8px;">区域→区域转移矩阵(单元格内为波色概率</div>';
html += '<table class="table table-bordered table-condensed text-center" style="max-width:600px;margin:0 auto;"><thead><tr><th style="width:80px;position:relative;"><div style="width:100%;height:35px;border-bottom:1px solid #e5e5e5;position:relative;"><span style="position:absolute;top:2px;right:5px;font-size:12px;">区域</span><span style="position:absolute;bottom:2px;left:5px;font-size:12px;">特码</span></div></th>';
for (var z = 0; z < ztc.zones.length; z++) {
html += '<th>' + ztc.zones[z] + '</th>';
}
html += '</tr></thead><tbody>';
for (var r = 0; r < 5; r++) {
html += '<tr><td style="font-weight:bold;">' + ztc.zones[r] + '</td>';
for (var c = 0; c < 3; c++) {
var pct = ztc.probabilities[r][c];
for (var c = 0; c < 5; c++) {
var cnt = ztc.matrix[r][c];
var bg = pct > 40 ? cwColors2[c] : pct > 20 ? cwColors2[c] + 'cc' : pct > 0 ? '#95a5a6' : '#f5f5f5';
var txt = pct > 20 ? '#fff' : '#333';
html += '<td style="background-color:' + bg + ';color:' + txt + ';">' + cnt + '次<br>' + pct + '%</td>';
var cp = ztc.color_probs[r][c];
var bg = cnt > 0 ? '#fafafa' : '#fff';
var txt = (cp.red > 40 || cp.blue > 40 || cp.green > 40) ? '#fff' : '#333';
html += '<td style="background-color:' + bg + ';color:' + txt + ';"><span style="color:#e74c3c;">红' + cp.red + '%</span><br><span style="color:#3498db;">蓝' + cp.blue + '%</span><br><span style="color:#2ecc71;">绿' + cp.green + '%</span><br><span style="font-size:11px;color:#000;">(' + cnt + '次)</span></td>';
}
html += '</tr>';
}