feat: 测试信息增加图表视图(ECharts),表格/图表一键切换
- B2视图:峰峰值/频率/距离/速度 趋势折线图,三Y轴 - B4视图:工作频率/距离/速度 趋势折线图,三Y轴 - dataZoom时间范围缩放,图例可切换系列显隐 - 新增 /api/test-data/chart 接口返回全量数据
This commit is contained in:
@@ -31,8 +31,11 @@
|
||||
<option value="100">100</option>
|
||||
</select>
|
||||
</label>
|
||||
<button id="btn-chart" class="btn-chart" onclick="toggleChart()">📈 图表</button>
|
||||
</div>
|
||||
|
||||
<div id="chart-container" style="display:none; width:100%; height:500px; margin-bottom:16px;"></div>
|
||||
|
||||
<table id="test-data-table">
|
||||
<thead></thead>
|
||||
<tbody></tbody>
|
||||
@@ -59,6 +62,18 @@
|
||||
border-color: #2c3e50;
|
||||
}
|
||||
.tab-btn:hover:not(.active) { background: #e0e0e0; }
|
||||
.btn-chart {
|
||||
margin-left: 16px;
|
||||
padding: 6px 14px;
|
||||
border: 1px solid #27ae60;
|
||||
background: #fff;
|
||||
color: #27ae60;
|
||||
cursor: pointer;
|
||||
border-radius: 4px;
|
||||
font-size: 13px;
|
||||
}
|
||||
.btn-chart.active { background: #27ae60; color: #fff; }
|
||||
</style>
|
||||
<script src="https://cdn.jsdelivr.net/npm/echarts@5.5.0/dist/echarts.min.js"></script>
|
||||
<script src="{{ url_for('static', filename='js/test_data.js') }}"></script>
|
||||
{% endblock %}
|
||||
|
||||
Reference in New Issue
Block a user