customize update delay and speed.
This commit is contained in:
parent
6475847cb0
commit
6c4c5a1c75
@ -1,3 +1,5 @@
|
|||||||
|
import 'dart:math';
|
||||||
|
|
||||||
import 'package:flutter/material.dart';
|
import 'package:flutter/material.dart';
|
||||||
import 'package:real_time_chart/real_time_chart.dart';
|
import 'package:real_time_chart/real_time_chart.dart';
|
||||||
|
|
||||||
@ -55,19 +57,8 @@ class _MyHomePageState extends State<MyHomePage> {
|
|||||||
bool up = true;
|
bool up = true;
|
||||||
|
|
||||||
Stream<double> getDataStream() {
|
Stream<double> getDataStream() {
|
||||||
return Stream.periodic(const Duration(milliseconds: 10), (_) {
|
return Stream.periodic(const Duration(milliseconds: 500), (_) {
|
||||||
if (count >= 100) {
|
return Random().nextInt(300).toDouble();
|
||||||
up = false;
|
|
||||||
} else if (count <= 0) {
|
|
||||||
up = true;
|
|
||||||
}
|
|
||||||
if (up) {
|
|
||||||
count++;
|
|
||||||
} else {
|
|
||||||
count--;
|
|
||||||
}
|
|
||||||
|
|
||||||
return count * 1.0;
|
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -6,9 +6,18 @@ import 'package:flutter/material.dart';
|
|||||||
import 'point.dart';
|
import 'point.dart';
|
||||||
|
|
||||||
class RealTimeGraph extends StatefulWidget {
|
class RealTimeGraph extends StatefulWidget {
|
||||||
final Stream<double> stream;
|
const RealTimeGraph({
|
||||||
|
Key? key,
|
||||||
|
this.updateDelay = const Duration(milliseconds: 100),
|
||||||
|
this.speed = 1,
|
||||||
|
required this.stream,
|
||||||
|
this.pointsSpacing = 3.0,
|
||||||
|
}) : super(key: key);
|
||||||
|
|
||||||
const RealTimeGraph({Key? key, required this.stream}) : super(key: key);
|
final Stream<double> stream;
|
||||||
|
final Duration updateDelay;
|
||||||
|
final int speed;
|
||||||
|
final double pointsSpacing;
|
||||||
|
|
||||||
@override
|
@override
|
||||||
RealTimeGraphState createState() => RealTimeGraphState();
|
RealTimeGraphState createState() => RealTimeGraphState();
|
||||||
@ -17,6 +26,7 @@ class RealTimeGraph extends StatefulWidget {
|
|||||||
class RealTimeGraphState extends State<RealTimeGraph>
|
class RealTimeGraphState extends State<RealTimeGraph>
|
||||||
with TickerProviderStateMixin {
|
with TickerProviderStateMixin {
|
||||||
StreamSubscription<double>? streamSubscription;
|
StreamSubscription<double>? streamSubscription;
|
||||||
|
|
||||||
List<Point<double>> _data = [];
|
List<Point<double>> _data = [];
|
||||||
Timer? timer;
|
Timer? timer;
|
||||||
|
|
||||||
@ -25,10 +35,10 @@ class RealTimeGraphState extends State<RealTimeGraph>
|
|||||||
super.initState();
|
super.initState();
|
||||||
|
|
||||||
// Subscribe to the stream provided in the constructor
|
// Subscribe to the stream provided in the constructor
|
||||||
streamSubscription = widget.stream.listen(_listener);
|
streamSubscription = widget.stream.listen(_streamListener);
|
||||||
|
|
||||||
// Start a periodic timer to update the data for visualization
|
// Start a periodic timer to update the data for visualization
|
||||||
timer = Timer.periodic(const Duration(milliseconds: 50), (_) {
|
timer = Timer.periodic(widget.updateDelay, (_) {
|
||||||
//_data.removeWhere((element) => element.y > 100);
|
//_data.removeWhere((element) => element.y > 100);
|
||||||
|
|
||||||
// Clone the data to avoid modifying the original list while iterating
|
// Clone the data to avoid modifying the original list while iterating
|
||||||
@ -36,7 +46,7 @@ class RealTimeGraphState extends State<RealTimeGraph>
|
|||||||
|
|
||||||
// Increment the x value of each data point
|
// Increment the x value of each data point
|
||||||
for (var element in data) {
|
for (var element in data) {
|
||||||
element.x = element.x - 1;
|
element.x = element.x - widget.speed;
|
||||||
}
|
}
|
||||||
|
|
||||||
// Trigger a rebuild with the updated data
|
// Trigger a rebuild with the updated data
|
||||||
@ -59,14 +69,17 @@ class RealTimeGraphState extends State<RealTimeGraph>
|
|||||||
height: constraints.maxWidth,
|
height: constraints.maxWidth,
|
||||||
width: constraints.maxHeight,
|
width: constraints.maxHeight,
|
||||||
child: CustomPaint(
|
child: CustomPaint(
|
||||||
painter: _GraphPainter(data: _data),
|
painter: _PointsGraphPainter(
|
||||||
|
data: _data,
|
||||||
|
pointsSpacing: widget.pointsSpacing,
|
||||||
|
),
|
||||||
),
|
),
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
void _listener(double data) {
|
void _streamListener(double data) {
|
||||||
// Insert the new data point in the beginning of the list
|
// Insert the new data point in the beginning of the list
|
||||||
_data.insert(0, Point(0, data));
|
_data.insert(0, Point(0, data));
|
||||||
}
|
}
|
||||||
@ -80,10 +93,15 @@ class RealTimeGraphState extends State<RealTimeGraph>
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
class _GraphPainter extends CustomPainter {
|
class _PointsGraphPainter extends CustomPainter {
|
||||||
final List<Point<double>> data;
|
final List<Point<double>> data;
|
||||||
|
|
||||||
_GraphPainter({required this.data});
|
_PointsGraphPainter({
|
||||||
|
required this.data,
|
||||||
|
required this.pointsSpacing,
|
||||||
|
});
|
||||||
|
|
||||||
|
final double pointsSpacing;
|
||||||
|
|
||||||
@override
|
@override
|
||||||
void paint(Canvas canvas, Size size) {
|
void paint(Canvas canvas, Size size) {
|
||||||
@ -91,31 +109,29 @@ class _GraphPainter extends CustomPainter {
|
|||||||
..style = PaintingStyle.stroke
|
..style = PaintingStyle.stroke
|
||||||
..strokeWidth = 1.5
|
..strokeWidth = 1.5
|
||||||
..color = Colors.white;
|
..color = Colors.white;
|
||||||
List<Offset> points = [];
|
|
||||||
|
|
||||||
// Iterate over the data points and add intermediate points if necessary
|
// Iterate over the data points and add intermediate points if necessary
|
||||||
for (int i = 0; i < data.length - 1; i++) {
|
for (int i = 0; i < data.length - 1; i++) {
|
||||||
double y1 = size.height - data[i].y;
|
final y1 = size.height - data[i].y;
|
||||||
double x1 = data[i].x + size.width;
|
final x1 = data[i].x + size.width;
|
||||||
double y2 = size.height - data[i + 1].y;
|
final y2 = size.height - data[i + 1].y;
|
||||||
double x2 = data[i + 1].x + size.width;
|
final x2 = data[i + 1].x + size.width;
|
||||||
double yDiff = y1 - y2;
|
final yDiff = (y2 - y1).abs();
|
||||||
double xDiff = x1 - x2;
|
final xDiff = (x2 - x1).abs();
|
||||||
|
|
||||||
// If the difference in y values is small, add intermediate points
|
// If the difference in y values is small, add intermediate points
|
||||||
if (xDiff.abs() <= 10) {
|
if (yDiff >= pointsSpacing) {
|
||||||
int numOfIntermediatePoints = (xDiff / 2).round();
|
int numOfIntermediatePoints = (yDiff / pointsSpacing).round();
|
||||||
double yInterval = yDiff / numOfIntermediatePoints;
|
final yInterval = (y2 - y1) / numOfIntermediatePoints;
|
||||||
double xInterval = xDiff / numOfIntermediatePoints;
|
final xInterval = (x2 - x1) / numOfIntermediatePoints;
|
||||||
for (int j = 1; j <= numOfIntermediatePoints; j++) {
|
for (int j = 0; j <= numOfIntermediatePoints; j++) {
|
||||||
double intermediateY = y1 + yInterval * j;
|
final intermediateY = y1 + yInterval * j;
|
||||||
double intermediateX = x1 + xInterval * j;
|
final intermediateX = x1 + xInterval * j;
|
||||||
points.add(Offset(intermediateX, intermediateY));
|
canvas.drawPoints(
|
||||||
|
PointMode.points, [Offset(intermediateX, intermediateY)], paint);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
canvas.drawPoints(PointMode.points, points, paint);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
@override
|
@override
|
||||||
|
Loading…
x
Reference in New Issue
Block a user