Skip to content

Commit

Permalink
charts now work on iOS again. App didn't compile on iOS becaus of dar…
Browse files Browse the repository at this point in the history 
…t:js and dart:html imports
  • Loading branch information
@o-bagge
o-bagge committed Nov 15, 2024
1 parent 7a523df commit 9eb7552
Show file tree
Hide file tree
Showing 3 changed files with 118 additions and 58 deletions.
114 changes: 62 additions & 52 deletions open_earable/lib/sensor_data_tab/sensor_chart.dart
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
import 'dart:async';

import 'package:open_earable/sensor_data_tab/sensor_html_chart.dart';
import 'sensor_html_chart_stub.dart'
if (dart.library.html) 'sensor_html_chart.dart';
import 'package:open_earable/shared/earable_not_connected_warning.dart';
import 'package:open_earable_flutter/open_earable_flutter.dart';
import 'package:flutter/material.dart';
Expand Down Expand Up @@ -135,9 +136,9 @@ class EarableDataChart extends StatefulWidget {
}

static int getAvailableDataChartsCount(
OpenEarable openEarable,
bool isV2,
) {
OpenEarable openEarable,
bool isV2,
) {
if (isV2) {
return 9;
}
Expand Down Expand Up @@ -390,23 +391,26 @@ class _EarableDataChartState extends State<EarableDataChart> {
webSeriesList = [
ChartSeries(
id: 'X${_data.isNotEmpty ? " (${_units[widget.sensorName]})" : ""}',
label: 'X${_data.isNotEmpty ? " (${_units[widget.sensorName]})" : ""}',
label:
'X${_data.isNotEmpty ? " (${_units[widget.sensorName]})" : ""}',
getDomainFn: (SensorData data, _) => data.timestamp,
getMeasureFn: (SensorData data, _) => data.values[0],
getColorFn: (_, __) => colors[0],
data: _data,
),
ChartSeries(
id: 'Y${_data.isNotEmpty ? " (${_units[widget.sensorName]})" : ""}',
label: 'Y${_data.isNotEmpty ? " (${_units[widget.sensorName]})" : ""}',
label:
'Y${_data.isNotEmpty ? " (${_units[widget.sensorName]})" : ""}',
getDomainFn: (SensorData data, _) => data.timestamp,
getMeasureFn: (SensorData data, _) => data.values[1],
getColorFn: (_, __) => colors[1],
data: _data,
),
ChartSeries(
id: 'Z${_data.isNotEmpty ? " (${_units[widget.sensorName]})" : ""}',
label: 'Z${_data.isNotEmpty ? " (${_units[widget.sensorName]})" : ""}',
label:
'Z${_data.isNotEmpty ? " (${_units[widget.sensorName]})" : ""}',
getDomainFn: (SensorData data, _) => data.timestamp,
getMeasureFn: (SensorData data, _) => data.values[2],
getColorFn: (_, __) => colors[2],
Expand Down Expand Up @@ -443,7 +447,8 @@ class _EarableDataChartState extends State<EarableDataChart> {
webSeriesList = [
ChartSeries(
id: '${widget.chartTitle}${_data.isNotEmpty ? " (${_units[widget.sensorName]})" : ""}',
label: '${widget.chartTitle}${_data.isNotEmpty ? " (${_units[widget.sensorName]})" : ""}',
label:
'${widget.chartTitle}${_data.isNotEmpty ? " (${_units[widget.sensorName]})" : ""}',
getDomainFn: (SensorData data, _) => data.timestamp,
getMeasureFn: (SensorData data, _) => data.values[0],
getColorFn: (_, __) => colors[0],
Expand All @@ -468,52 +473,57 @@ class _EarableDataChartState extends State<EarableDataChart> {
child: Padding(
padding: const EdgeInsets.all(16.0),
child: kIsWeb
? ChartJsWidget(chartType: 'line', seriesList: webSeriesList, title: widget.sensorName)
? ChartJsWidget(
chartType: 'line',
seriesList: webSeriesList,
title: widget.sensorName)
: charts.LineChart(
seriesList,
animate: false,
behaviors: [
charts.SeriesLegend(
position: charts.BehaviorPosition.bottom,
// To position the legend at the end (bottom). You can change this as per requirement.
outsideJustification:
charts.OutsideJustification.middleDrawArea,
// To justify the position.
horizontalFirst: false,
// To stack items horizontally.
desiredMaxRows: 1,
// Optional if you want to define max rows for the legend.
entryTextStyle: charts.TextStyleSpec(
// Optional styling for the text.
color: charts.Color(r: 255, g: 255, b: 255),
fontSize: 12,
),
),
],
primaryMeasureAxis: charts.NumericAxisSpec(
tickProviderSpec: charts.BasicNumericTickProviderSpec(
desiredTickCount: 7,
zeroBound: false,
dataIsInWholeNumbers: false,
),
renderSpec: charts.GridlineRendererSpec(
labelStyle: charts.TextStyleSpec(
fontSize: 14,
color: charts.MaterialPalette.white, // Set the color here
),
),
viewport: charts.NumericExtents(_minY, _maxY),
),
domainAxis: charts.NumericAxisSpec(
renderSpec: charts.GridlineRendererSpec(
labelStyle: charts.TextStyleSpec(
fontSize: 14,
color: charts.MaterialPalette.white, // Set the color here
seriesList,
animate: false,
behaviors: [
charts.SeriesLegend(
position: charts.BehaviorPosition.bottom,
// To position the legend at the end (bottom). You can change this as per requirement.
outsideJustification:
charts.OutsideJustification.middleDrawArea,
// To justify the position.
horizontalFirst: false,
// To stack items horizontally.
desiredMaxRows: 1,
// Optional if you want to define max rows for the legend.
entryTextStyle: charts.TextStyleSpec(
// Optional styling for the text.
color: charts.Color(r: 255, g: 255, b: 255),
fontSize: 12,
),
),
],
primaryMeasureAxis: charts.NumericAxisSpec(
tickProviderSpec: charts.BasicNumericTickProviderSpec(
desiredTickCount: 7,
zeroBound: false,
dataIsInWholeNumbers: false,
),
renderSpec: charts.GridlineRendererSpec(
labelStyle: charts.TextStyleSpec(
fontSize: 14,
color: charts
.MaterialPalette.white, // Set the color here
),
),
viewport: charts.NumericExtents(_minY, _maxY),
),
domainAxis: charts.NumericAxisSpec(
renderSpec: charts.GridlineRendererSpec(
labelStyle: charts.TextStyleSpec(
fontSize: 14,
color: charts
.MaterialPalette.white, // Set the color here
),
),
viewport: charts.NumericExtents(_minX, _maxX),
),
),
),
viewport: charts.NumericExtents(_minX, _maxX),
),
),
),
),
],
Expand Down
21 changes: 15 additions & 6 deletions open_earable/lib/sensor_data_tab/sensor_html_chart.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,8 @@ import 'dart:ui_web';
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:open_earable/sensor_data_tab/sensor_chart.dart';
// Conditional imports
// For web-specific code

class ChartSeries {
final String id;
Expand All @@ -25,14 +27,14 @@ class ChartSeries {
});
}


class ChartJsWidget extends StatelessWidget {
final String chartType;
final List<ChartSeries> seriesList;

final String title;

const ChartJsWidget({super.key,
const ChartJsWidget({
super.key,
required this.chartType,
required this.seriesList,
required this.title,
Expand All @@ -57,13 +59,20 @@ class ChartJsWidget extends StatelessWidget {

// Extract labels and datasets after the widget has been built
WidgetsBinding.instance.addPostFrameCallback((_) {
final labels = seriesList[0].data.map((data) => seriesList[0].getDomainFn(data, null).toString()).toList();
final labels = seriesList[0]
.data
.map((data) => seriesList[0].getDomainFn(data, null).toString())
.toList();
final datasets = seriesList.map((series) {
return {
'label': series.label,
'data': series.data.map((data) => series.getMeasureFn(data, null)).toList(),
'borderColor': series.getColorFn(series.data[0], null), // Use colorFn for color
'backgroundColor': series.getColorFn(series.data[0], null) + '33', // With transparency
'data': series.data
.map((data) => series.getMeasureFn(data, null))
.toList(),
'borderColor':
series.getColorFn(series.data[0], null), // Use colorFn for color
'backgroundColor': series.getColorFn(series.data[0], null) +
'33', // With transparency
};
}).toList();

Expand Down
41 changes: 41 additions & 0 deletions open_earable/lib/sensor_data_tab/sensor_html_chart_stub.dart
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,41 @@
import 'package:flutter/material.dart';
import 'package:open_earable/sensor_data_tab/sensor_chart.dart';

class ChartSeries {
final String id;
final String label;
final Function(SensorData, int?) getDomainFn;
final Function(SensorData, int?) getMeasureFn;
final Function(SensorData, String?) getColorFn;

final List<SensorData> data;

ChartSeries({
required this.id,
required this.label,
required this.getDomainFn,
required this.getMeasureFn,
required this.getColorFn,
required this.data,
});
}

class ChartJsWidget extends StatelessWidget {
final String chartType;
final List<ChartSeries> seriesList;
final String title;

const ChartJsWidget({
super.key,
required this.chartType,
required this.seriesList,
required this.title,
});

@override
Widget build(BuildContext context) {
return Center(
child: Text("Chart.js is not supported on this platform."),
);
}
}

0 comments on commit 9eb7552

Please sign in to comment.