added some comments

This commit is contained in:
TAJAOUART Mounir 2023-02-10 11:52:15 +01:00
parent 3ccb5a42d4
commit 1b651874b2

View File

@ -23,17 +23,40 @@ class RealTimeGraph extends StatefulWidget {
Key? key, Key? key,
}) : super(key: key); }) : super(key: key);
// Callback to build custom Y-axis text.
final Widget Function(double)? axisTextBuilder; final Widget Function(double)? axisTextBuilder;
// Enum to display chart as line or points.
final ChartDisplay displayMode; final ChartDisplay displayMode;
// Flag to display Y-axis values or not.
final bool displayYAxisValues; final bool displayYAxisValues;
// The stream to listen to for new data.
final Stream<double> stream; final Stream<double> stream;
// The frequency of updating the chart.
final Duration updateDelay; final Duration updateDelay;
// The spacing between points in the chart.
final double pointsSpacing; final double pointsSpacing;
// The stroke width of the Y-axis line.
final double axisStroke; final double axisStroke;
// The stroke width of the graph line.
final double graphStroke; final double graphStroke;
// The color of the graph.
final Color graphColor; final Color graphColor;
// The color of the Y-axis line.
final Color axisColor; final Color axisColor;
// The minimum value of the Y-axis.
final double minValue; final double minValue;
// The speed at which the chart updates.
final int speed; final int speed;
@override @override
@ -190,62 +213,67 @@ class _PointGraphPainter extends CustomPainter {
required this.color, required this.color,
}); });
// List of data points to be plotted on the graph
final List<Point<double>> data; final List<Point<double>> data;
// Spacing between consecutive data points on the graph
final double pointsSpacing; final double pointsSpacing;
// Stroke width of the graph
final double graphStroke; final double graphStroke;
// Color of the graph
final Color color; final Color color;
@override @override
void paint(Canvas canvas, Size size) { void paint(Canvas canvas, Size size) {
// Paint object used to draw the graph
final paint = Paint() final paint = Paint()
..style = PaintingStyle.fill ..style = PaintingStyle.fill
..strokeWidth = graphStroke ..strokeWidth = graphStroke
..color = color; ..color = color;
// Find the maximum y value in the data // If the data is not empty, calculate the maximum y value and the y scaling factor
double maxY = 0;
// Calculate the scaling factor for the y values
double yScale = 1;
// Iterate over the data points and add intermediate points if necessary
if (data.isNotEmpty) { if (data.isNotEmpty) {
maxY = data.map((point) => point.y).reduce(max); double maxY = data.map((point) => point.y).reduce(max);
yScale = (maxY > size.height) ? (size.height / maxY) : 1; double yScale = (maxY > size.height) ? (size.height / maxY) : 1;
}
for (int i = 0; i < data.length - 1; i++) { // Iterate over the data points and draw them on the canvas
double y1 = data[i].y * yScale; for (int i = 0; i < data.length - 1; i++) {
double x1 = data[i].x + size.width; double y1 = data[i].y * yScale;
double y2 = data[i + 1].y * yScale; double x1 = data[i].x + size.width;
double x2 = data[i + 1].x + size.width; double y2 = data[i + 1].y * yScale;
double yDiff = (y2 - y1).abs(); double x2 = data[i + 1].x + size.width;
double xDiff = (x2 - x1).abs(); double yDiff = (y2 - y1).abs();
double xDiff = (x2 - x1).abs();
// If the difference in y values is small, add intermediate points // If the difference in y values or x values is large, add intermediate points
if (yDiff >= pointsSpacing || xDiff >= pointsSpacing) { if (yDiff >= pointsSpacing || xDiff >= pointsSpacing) {
int numOfIntermediatePoints = yDiff >= pointsSpacing int numOfIntermediatePoints = yDiff >= pointsSpacing
? (yDiff / pointsSpacing).round() ? (yDiff / pointsSpacing).round()
: (xDiff / pointsSpacing).round(); : (xDiff / pointsSpacing).round();
double yInterval = (y2 - y1) / numOfIntermediatePoints; double yInterval = (y2 - y1) / numOfIntermediatePoints;
double xInterval = (x2 - x1) / numOfIntermediatePoints; double xInterval = (x2 - x1) / numOfIntermediatePoints;
for (int j = 0; j <= numOfIntermediatePoints; j++) { for (int j = 0; j <= numOfIntermediatePoints; j++) {
final intermediateY = y1 + yInterval * j; final intermediateY = y1 + yInterval * j;
final intermediateX = x1 + xInterval * j; final intermediateX = x1 + xInterval * j;
if (intermediateX.isFinite && intermediateY.isFinite) { if (intermediateX.isFinite && intermediateY.isFinite) {
canvas.drawCircle( // Draw an intermediate point if it is within the canvas bounds
Offset(intermediateX, size.height - intermediateY), canvas.drawCircle(
sqrt(graphStroke), Offset(intermediateX, size.height - intermediateY),
paint, sqrt(graphStroke),
); paint,
);
}
} }
} }
// Draw the data point
canvas.drawCircle(
Offset(x1, size.height - y1),
sqrt(graphStroke),
paint,
);
} }
canvas.drawCircle(
Offset(x1, size.height - y1),
sqrt(graphStroke),
paint,
);
} }
} }
@ -260,8 +288,13 @@ class _LineGraphPainter extends CustomPainter {
required this.color, required this.color,
}); });
// The data to be plotted in the graph
final List<Point<double>> data; final List<Point<double>> data;
// The width of the graph's lines
final double graphStroke; final double graphStroke;
// The color of the graph
final Color color; final Color color;
@override @override
@ -270,7 +303,10 @@ class _LineGraphPainter extends CustomPainter {
..style = PaintingStyle.stroke ..style = PaintingStyle.stroke
..strokeWidth = graphStroke ..strokeWidth = graphStroke
..color = color; ..color = color;
// A path object to store the graph's lines
Path path = Path(); Path path = Path();
// Find the maximum y value in the data // Find the maximum y value in the data
double maxY = 0; double maxY = 0;
@ -281,18 +317,21 @@ class _LineGraphPainter extends CustomPainter {
if (data.isNotEmpty) { if (data.isNotEmpty) {
maxY = data.map((point) => point.y).reduce(max); maxY = data.map((point) => point.y).reduce(max);
yScale = (maxY > size.height) ? (size.height / maxY) : 1; yScale = (maxY > size.height) ? (size.height / maxY) : 1;
// Start the path at the first data point
path.moveTo( path.moveTo(
data.first.x + size.width, data.first.x + size.width,
(size.height - data.first.y * yScale), (size.height - data.first.y * yScale),
); );
} }
// Plot the lines between each subsequent data point
for (int i = 0; i < data.length - 1; i++) { for (int i = 0; i < data.length - 1; i++) {
double y = data[i + 1].y * yScale; double y = data[i + 1].y * yScale;
double x = data[i + 1].x + size.width; double x = data[i + 1].x + size.width;
path.lineTo(x, size.height - y); path.lineTo(x, size.height - y);
} }
// Draw the path on the canvas
canvas.drawPath(path, paint); canvas.drawPath(path, paint);
} }