更新设备校准

lib/pages/sleep_report/chart/TimeSeriesChart.dart

@@ -1,243 +1,57 @@
 import 'package:flutter/material.dart';
 import 'package:fl_chart/fl_chart.dart';
+import 'package:vbvs_app/common/color/appConstants.dart';
 import 'package:vbvs_app/common/util/FitTool.dart';
-import 'dart:math';
-
 import 'package:vbvs_app/common/util/MyUtils.dart';
 
+class TimeSeriesPoint {
+  final int timestamp;
+  final double value;
+  TimeSeriesPoint(this.timestamp, this.value);
+}
+
 class TimeSeriesChart extends StatelessWidget {
-  final int startTime;
+  final int startTime; // 毫秒时间戳
   final int endTime;
   final double yMin;
   final double yMax;
   final List<TimeSeriesPoint> dataPoints;
-  final double actYMin;
-  final double actYMax;
 
-  TimeSeriesChart({
+  const TimeSeriesChart({
+    Key? key,
     required this.startTime,
     required this.endTime,
     required this.yMin,
     required this.yMax,
     required this.dataPoints,
-    required this.actYMin,
-    required this.actYMax,
-  });
-
-  @override
-  Widget build(BuildContext context) {
-    final midValue = (yMax + yMin) / 2;
-    final xLabels = _generateXLabels();
-
-    // Prepare spots and segments
-    List<FlSpot> spots = [];
-    List<Color> lineColors = [];
-
-    for (int i = 0; i < dataPoints.length; i++) {
-      final point = dataPoints[i];
-      final xValue = _convertTimeToXValue(point.timestamp);
-      final yValue = point.value;
-
-      spots.add(FlSpot(xValue, yValue));
-      if (yValue >= yMin && yValue <= yMax) {
-        lineColors.add(Colors.green); // Color for points within range
-      } else {
-        lineColors.add(Colors.red); // Color for points outside range
-      }
-    }
-
-    return AspectRatio(
-      aspectRatio: 2,
-      child: LineChart(
-        LineChartData(
-          lineTouchData: LineTouchData(
-            touchTooltipData: LineTouchTooltipData(
-              getTooltipItems: (List<LineBarSpot> touchedSpots) {
-                return touchedSpots.map((spot) {
-                  final time = DateTime.fromMillisecondsSinceEpoch(
-                    _convertXValueToTime(spot.x),
-                  );
-                  return LineTooltipItem(
-                    '${time.hour.toString().padLeft(2, '0')}:${time.minute.toString().padLeft(2, '0')}\n${spot.y.toStringAsFixed(0)}',
-                    const TextStyle(color: Colors.black),
-                  );
-                }).toList();
-              },
-            ),
-          ),
-          gridData: FlGridData(
-            show: true,
-            drawVerticalLine: false,
-            getDrawingHorizontalLine: (value) {
-              if (value == 0) {
-                return FlLine(
-                  color: themeController.currentColor.sc4,
-                  strokeWidth: 1,
-                );
-              } else if (value == yMin) {
-                return FlLine(
-                  color: themeController.currentColor.sc9,
-                  strokeWidth: 1,
-                  dashArray: [5, 5],
-                );
-              } else if (value == yMax) {
-                return FlLine(
-                  color: themeController.currentColor.sc9,
-                  strokeWidth: 1,
-                  dashArray: [5, 5],
-                );
-              } else if (value == midValue) {
-                return FlLine(
-                  color: themeController.currentColor.sc4,
-                  strokeWidth: 1,
-                  dashArray: [5, 5],
-                );
-              }
-              return FlLine(
-                color: Colors.grey.withOpacity(0.1),
-                strokeWidth: 1,
-              );
-            },
-          ),
-          titlesData: FlTitlesData(
-            show: true,
-            rightTitles: AxisTitles(
-              sideTitles: SideTitles(showTitles: false),
-            ),
-            topTitles: AxisTitles(
-              sideTitles: SideTitles(showTitles: false),
-            ),
-            bottomTitles: AxisTitles(
-              sideTitles: SideTitles(
-                showTitles: true,
-                reservedSize: 30,
-                getTitlesWidget: (value, meta) {
-                  final index = value.toInt();
-                  if (index >= 0 && index < xLabels.length) {
-                    return Padding(
-                      padding: const EdgeInsets.only(top: 8.0),
-                      child: Text(
-                        xLabels[index].label,
-                        style: TextStyle(
-                          fontSize: 10,
-                          color: Colors.grey,
-                        ),
-                      ),
-                    );
-                  }
-                  return const Text('');
-                },
-              ),
-            ),
-            leftTitles: AxisTitles(
-              sideTitles: SideTitles(
-                showTitles: true,
-                getTitlesWidget: (value, meta) {
-                  if (value == 0) {
-                    return Padding(
-                      padding: EdgeInsets.only(right: 14.rpx),
-                      child: Text(
-                        value.toStringAsFixed(0),
-                        style: TextStyle(
-                          fontSize: 18.rpx,
-                          color: themeController.currentColor.sc4,
-                        ),
-                        maxLines: 1,
-                        overflow: TextOverflow.ellipsis,
-                        textAlign: TextAlign.right,
-                      ),
-                    );
-                  } else if (value == yMin) {
-                    return Padding(
-                      padding: EdgeInsets.only(right: 14.rpx),
-                      child: Text(
-                        "${actYMin.toStringAsFixed(0)}",
-                        style: TextStyle(
-                          fontSize: 18.rpx,
-                          color: themeController.currentColor.sc4,
-                        ),
-                        maxLines: 1,
-                        overflow: TextOverflow.ellipsis,
-                        textAlign: TextAlign.right,
-                      ),
-                    );
-                  } else if (value == midValue) {
-                    return Padding(
-                      padding: EdgeInsets.only(right: 14.rpx),
-                      child: Text(
-                        "${((actYMax + actYMin) / 2).toStringAsFixed(0)}",
-                        // "${midValue}",
-                        style: TextStyle(
-                          fontSize: 18.rpx,
-                          color: themeController.currentColor.sc4,
-                        ),
-                        maxLines: 1,
-                        overflow: TextOverflow.ellipsis,
-                        textAlign: TextAlign.right,
-                      ),
-                    );
-                  } else if (value == yMax) {
-                    return Padding(
-                      padding: EdgeInsets.only(right: 14.rpx),
-                      child: Text(
-                        "${actYMax.toStringAsFixed(0)}",
-                        style: TextStyle(
-                          fontSize: 18.rpx,
-                          color: themeController.currentColor.sc4,
-                        ),
-                        maxLines: 1,
-                        overflow: TextOverflow.ellipsis,
-                        textAlign: TextAlign.right,
-                      ),
-                    );
-                  }
-                  return const Text('');
-                },
-                reservedSize: 40,
-              ),
-            ),
-          ),
-          borderData: FlBorderData(
-            show: false,
-            border: Border.all(color: Colors.grey.withOpacity(0.3)),
-          ),
-          minX: 0,
-          maxX: xLabels.length - 1,
-          minY: min(0, yMin) - (yMax - yMin) * 0.2,
-          maxY: yMax + (yMax - yMin) * 0.2,
-          lineBarsData: [
-            LineChartBarData(
-              spots: spots,
-              isCurved: false,
-              color: themeController.currentColor.sc2,
-              barWidth: 2,
-              isStrokeCapRound: true,
-              dotData: FlDotData(show: false), // Disable dots
-              belowBarData: BarAreaData(show: false),
-            ),
-          ],
-        ),
-      ),
-    );
-  }
+  }) : super(key: key);
 
+  // X轴刻度数据
   List<XLabel> _generateXLabels() {
     final labels = <XLabel>[];
     final startDate = DateTime.fromMillisecondsSinceEpoch(startTime);
     final endDate = DateTime.fromMillisecondsSinceEpoch(endTime);
 
+    // 第一个刻度，原始 startTime，HH:mm格式
     labels.add(XLabel(
       time: startTime,
       label:
           '${startDate.hour.toString().padLeft(2, '0')}:${startDate.minute.toString().padLeft(2, '0')}',
     ));
 
+    // 生成中间整点小时刻度，注意起点向上取整一个小时
     DateTime current = DateTime(
       startDate.year,
       startDate.month,
       startDate.day,
-      startDate.hour + 1,
+      startDate.hour,
     );
+    if (startDate.minute > 0 ||
+        startDate.second > 0 ||
+        startDate.millisecond > 0) {
+      // 如果 startTime 不是整点，跳到下一个整点小时
+      current = current.add(Duration(hours: 1));
+    }
 
     while (current.isBefore(endDate)) {
       labels.add(XLabel(
@@ -247,6 +61,7 @@ class TimeSeriesChart extends StatelessWidget {
       current = current.add(Duration(hours: 1));
     }
 
+    // 最后一个刻度，原始 endTime，HH:mm格式
     labels.add(XLabel(
       time: endTime,
       label:
@@ -256,31 +71,157 @@ class TimeSeriesChart extends StatelessWidget {
     return labels;
   }
 
-  double _convertTimeToXValue(int timestamp) {
-    final totalDuration = endTime - startTime;
-    final pointDuration = timestamp - startTime;
-    final xLabels = _generateXLabels();
-    return (pointDuration / totalDuration) * (xLabels.length - 1);
+  // 时间戳映射到0~(labels.length-1)之间
+  double _timeToX(double timestamp, List<XLabel> labels) {
+    int start = labels.first.time;
+    int end = labels.last.time;
+    double total = (end - start).toDouble();
+    double pos = (timestamp - start).clamp(0, total).toDouble();
+    return pos / total * (labels.length - 1);
   }
 
-  int _convertXValueToTime(double xValue) {
+  @override
+  Widget build(BuildContext context) {
     final xLabels = _generateXLabels();
-    final totalDuration = endTime - startTime;
-    final ratio = xValue / (xLabels.length - 1);
-    return startTime + (totalDuration * ratio).round();
+    final midY = (yMin + yMax) / 2;
+
+    List<FlSpot> spots = dataPoints.map((p) {
+      return FlSpot(_timeToX(p.timestamp.toDouble(), xLabels), p.value);
+    }).toList();
+
+    return AspectRatio(
+      aspectRatio: 2,
+      child: LineChart(
+        LineChartData(
+          minX: 0,
+          maxX: (xLabels.length - 1).toDouble(),
+          minY: yMin < 0 ? yMin : 0,
+          maxY: yMax,
+          gridData: FlGridData(show: false),
+          extraLinesData: ExtraLinesData(
+            horizontalLines: [
+              HorizontalLine(
+                  y: 0,
+                  color: themeController.currentColor.sc4,
+                  strokeWidth: 1.rpx),
+              HorizontalLine(
+                  y: yMin,
+                  color: themeController.currentColor.sc9,
+                  strokeWidth: 1.rpx,
+                  dashArray: [5, 5]),
+              HorizontalLine(
+                  y: yMax,
+                  color: themeController.currentColor.sc9,
+                  strokeWidth: 1.rpx,
+                  dashArray: [5, 5]),
+              HorizontalLine(
+                  y: midY,
+                  color: themeController.currentColor.sc4,
+                  strokeWidth: 1.rpx,
+                  dashArray: [5, 5]),
+            ],
+          ),
+          titlesData: FlTitlesData(
+            bottomTitles: AxisTitles(
+              sideTitles: SideTitles(
+                showTitles: true,
+                reservedSize: 30,
+                interval: 1,
+                getTitlesWidget: (value, meta) {
+                  int index = value.toInt();
+                  if (index < 0 || index >= xLabels.length)
+                    return const SizedBox.shrink();
+
+                  final dateTime =
+                      DateTime.fromMillisecondsSinceEpoch(xLabels[index].time);
+
+                  if (index == 0 || index == xLabels.length - 1) {
+                    // 开始和结束显示 HH:mm
+                    final formatted =
+                        '${dateTime.hour.toString().padLeft(2, '0')}:${dateTime.minute.toString().padLeft(2, '0')}';
+                    return Padding(
+                      padding: const EdgeInsets.only(top: 8.0),
+                      child: Text(formatted,
+                          style: TextStyle(
+                              color: themeController.currentColor.sc4,
+                              fontSize: 16.rpx)),
+                    );
+                  } else {
+                    // 中间显示小时H，24小时制，不补零
+                    final formatted = '${dateTime.hour}';
+                    return Padding(
+                      padding: const EdgeInsets.only(top: 8.0),
+                      child: Text(formatted,
+                          style: TextStyle(
+                              color: themeController.currentColor.sc4,
+                              fontSize: 16.rpx)),
+                    );
+                  }
+                },
+              ),
+            ),
+            leftTitles: AxisTitles(
+              sideTitles: SideTitles(
+                showTitles: true,
+                reservedSize: 40.rpx,
+                interval: 1,
+                getTitlesWidget: (value, meta) {
+                  // 只显示 yMin, midY, yMax, 和 0
+                  if ((value - 0).abs() < 0.01) {
+                    return Text('0',
+                        style: TextStyle(
+                            color: themeController.currentColor.sc4,
+                            fontSize: 16.rpx));
+                  } else if ((value - yMin).abs() < 0.01) {
+                    return Text(yMin.toStringAsFixed(0),
+                        style: TextStyle(
+                            color: themeController.currentColor.sc4,
+                            fontSize: 16.rpx));
+                  } else if ((value - midY).abs() < 0.01) {
+                    return Text(midY.toStringAsFixed(0),
+                        style: TextStyle(
+                            color: themeController.currentColor.sc4,
+                            fontSize: 16.rpx));
+                  } else if ((value - yMax).abs() < 0.01) {
+                    return Text(yMax.toStringAsFixed(0),
+                        style: TextStyle(
+                            color: themeController.currentColor.sc4,
+                            fontSize: 16.rpx));
+                  } else {
+                    return const SizedBox.shrink();
+                  }
+                },
+              ),
+            ),
+            rightTitles: AxisTitles(sideTitles: SideTitles(showTitles: false)),
+            topTitles: AxisTitles(sideTitles: SideTitles(showTitles: false)),
+          ),
+          borderData: FlBorderData(
+            show: true,
+            border: Border(
+              bottom: BorderSide(color: Colors.grey.withOpacity(0.3)),
+              left: BorderSide.none,
+              right: BorderSide.none,
+              top: BorderSide.none,
+            ),
+          ),
+          lineBarsData: [
+            LineChartBarData(
+              spots: spots,
+              isCurved: false,
+              color: themeController.currentColor.sc2,
+              barWidth: 2,
+              dotData: FlDotData(show: false),
+            )
+          ],
+        ),
+      ),
+    );
   }
 }
 
-class TimeSeriesPoint {
-  final int timestamp;
-  final double value;
-
-  TimeSeriesPoint(this.timestamp, this.value);
-}
-
 class XLabel {
   final int time;
   final String label;
-
   XLabel({required this.time, required this.label});
 }