mirror of
https://github.com/SyncrowIOT/web.git
synced 2025-07-10 07:07:19 +00:00
Added day of month axis name to all charts.
This commit is contained in:
@ -3,6 +3,7 @@ import 'package:flutter/material.dart';
|
|||||||
import 'package:intl/intl.dart';
|
import 'package:intl/intl.dart';
|
||||||
import 'package:syncrow_web/pages/analytics/models/air_quality_data_model.dart';
|
import 'package:syncrow_web/pages/analytics/models/air_quality_data_model.dart';
|
||||||
import 'package:syncrow_web/pages/analytics/modules/energy_management/helpers/energy_management_charts_helper.dart';
|
import 'package:syncrow_web/pages/analytics/modules/energy_management/helpers/energy_management_charts_helper.dart';
|
||||||
|
import 'package:syncrow_web/pages/analytics/widgets/charts_x_axis_title.dart';
|
||||||
import 'package:syncrow_web/utils/color_manager.dart';
|
import 'package:syncrow_web/utils/color_manager.dart';
|
||||||
import 'package:syncrow_web/utils/extension/build_context_x.dart';
|
import 'package:syncrow_web/utils/extension/build_context_x.dart';
|
||||||
|
|
||||||
@ -139,6 +140,7 @@ class AqiDistributionChart extends StatelessWidget {
|
|||||||
);
|
);
|
||||||
|
|
||||||
final bottomTitles = AxisTitles(
|
final bottomTitles = AxisTitles(
|
||||||
|
axisNameWidget: const ChartsXAxisTitle(),
|
||||||
sideTitles: SideTitles(
|
sideTitles: SideTitles(
|
||||||
showTitles: true,
|
showTitles: true,
|
||||||
getTitlesWidget: (value, _) => FittedBox(
|
getTitlesWidget: (value, _) => FittedBox(
|
||||||
|
@ -1,6 +1,7 @@
|
|||||||
import 'package:fl_chart/fl_chart.dart';
|
import 'package:fl_chart/fl_chart.dart';
|
||||||
import 'package:flutter/material.dart';
|
import 'package:flutter/material.dart';
|
||||||
import 'package:syncrow_web/pages/analytics/helpers/format_number_to_kwh.dart';
|
import 'package:syncrow_web/pages/analytics/helpers/format_number_to_kwh.dart';
|
||||||
|
import 'package:syncrow_web/pages/analytics/widgets/charts_x_axis_title.dart';
|
||||||
import 'package:syncrow_web/utils/color_manager.dart';
|
import 'package:syncrow_web/utils/color_manager.dart';
|
||||||
import 'package:syncrow_web/utils/extension/build_context_x.dart';
|
import 'package:syncrow_web/utils/extension/build_context_x.dart';
|
||||||
|
|
||||||
@ -15,6 +16,7 @@ abstract final class EnergyManagementChartsHelper {
|
|||||||
return FlTitlesData(
|
return FlTitlesData(
|
||||||
show: true,
|
show: true,
|
||||||
bottomTitles: AxisTitles(
|
bottomTitles: AxisTitles(
|
||||||
|
axisNameWidget: const ChartsXAxisTitle(),
|
||||||
drawBelowEverything: true,
|
drawBelowEverything: true,
|
||||||
sideTitles: SideTitles(
|
sideTitles: SideTitles(
|
||||||
interval: 1,
|
interval: 1,
|
||||||
@ -62,17 +64,12 @@ abstract final class EnergyManagementChartsHelper {
|
|||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
static String getToolTipLabel(num month, double value) {
|
static String getToolTipLabel(double value) => value.formatNumberToKwh;
|
||||||
final monthLabel = month.toString();
|
|
||||||
final valueLabel = value.formatNumberToKwh;
|
|
||||||
final labels = [monthLabel, valueLabel];
|
|
||||||
return labels.where((element) => element.isNotEmpty).join(', ');
|
|
||||||
}
|
|
||||||
|
|
||||||
static List<LineTooltipItem?> getTooltipItems(List<LineBarSpot> touchedSpots) {
|
static List<LineTooltipItem?> getTooltipItems(List<LineBarSpot> touchedSpots) {
|
||||||
return touchedSpots.map((spot) {
|
return touchedSpots.map((spot) {
|
||||||
return LineTooltipItem(
|
return LineTooltipItem(
|
||||||
getToolTipLabel(spot.x, spot.y),
|
getToolTipLabel(spot.y),
|
||||||
const TextStyle(
|
const TextStyle(
|
||||||
color: ColorsManager.textPrimaryColor,
|
color: ColorsManager.textPrimaryColor,
|
||||||
fontWeight: FontWeight.w600,
|
fontWeight: FontWeight.w600,
|
||||||
|
@ -2,6 +2,7 @@ import 'package:fl_chart/fl_chart.dart';
|
|||||||
import 'package:flutter/material.dart';
|
import 'package:flutter/material.dart';
|
||||||
import 'package:syncrow_web/pages/analytics/models/occupacy.dart';
|
import 'package:syncrow_web/pages/analytics/models/occupacy.dart';
|
||||||
import 'package:syncrow_web/pages/analytics/modules/energy_management/helpers/energy_management_charts_helper.dart';
|
import 'package:syncrow_web/pages/analytics/modules/energy_management/helpers/energy_management_charts_helper.dart';
|
||||||
|
import 'package:syncrow_web/pages/analytics/widgets/charts_x_axis_title.dart';
|
||||||
import 'package:syncrow_web/utils/color_manager.dart';
|
import 'package:syncrow_web/utils/color_manager.dart';
|
||||||
import 'package:syncrow_web/utils/extension/build_context_x.dart';
|
import 'package:syncrow_web/utils/extension/build_context_x.dart';
|
||||||
|
|
||||||
@ -88,8 +89,8 @@ class OccupancyChart extends StatelessWidget {
|
|||||||
}) {
|
}) {
|
||||||
final data = chartData;
|
final data = chartData;
|
||||||
|
|
||||||
final occupancyValue = double.parse(data[group.x.toInt()].occupancy);
|
final occupancyValue = double.parse(data[group.x].occupancy);
|
||||||
final percentage = '${(occupancyValue).toStringAsFixed(0)}%';
|
final percentage = '${occupancyValue.toStringAsFixed(0)}%';
|
||||||
|
|
||||||
return BarTooltipItem(
|
return BarTooltipItem(
|
||||||
percentage,
|
percentage,
|
||||||
@ -116,7 +117,7 @@ class OccupancyChart extends StatelessWidget {
|
|||||||
alignment: AlignmentDirectional.centerStart,
|
alignment: AlignmentDirectional.centerStart,
|
||||||
fit: BoxFit.scaleDown,
|
fit: BoxFit.scaleDown,
|
||||||
child: Text(
|
child: Text(
|
||||||
'${(value).toStringAsFixed(0)}%',
|
'${value.toStringAsFixed(0)}%',
|
||||||
style: context.textTheme.bodySmall?.copyWith(
|
style: context.textTheme.bodySmall?.copyWith(
|
||||||
fontSize: 12,
|
fontSize: 12,
|
||||||
color: ColorsManager.greyColor,
|
color: ColorsManager.greyColor,
|
||||||
@ -128,6 +129,7 @@ class OccupancyChart extends StatelessWidget {
|
|||||||
);
|
);
|
||||||
|
|
||||||
final bottomTitles = AxisTitles(
|
final bottomTitles = AxisTitles(
|
||||||
|
axisNameWidget: const ChartsXAxisTitle(),
|
||||||
sideTitles: SideTitles(
|
sideTitles: SideTitles(
|
||||||
showTitles: true,
|
showTitles: true,
|
||||||
getTitlesWidget: (value, _) => FittedBox(
|
getTitlesWidget: (value, _) => FittedBox(
|
||||||
|
23
lib/pages/analytics/widgets/charts_x_axis_title.dart
Normal file
23
lib/pages/analytics/widgets/charts_x_axis_title.dart
Normal file
@ -0,0 +1,23 @@
|
|||||||
|
import 'package:flutter/material.dart';
|
||||||
|
import 'package:syncrow_web/utils/color_manager.dart';
|
||||||
|
import 'package:syncrow_web/utils/extension/build_context_x.dart';
|
||||||
|
|
||||||
|
class ChartsXAxisTitle extends StatelessWidget {
|
||||||
|
const ChartsXAxisTitle({
|
||||||
|
this.label = 'Day of month',
|
||||||
|
super.key,
|
||||||
|
});
|
||||||
|
|
||||||
|
final String label;
|
||||||
|
|
||||||
|
@override
|
||||||
|
Widget build(BuildContext context) {
|
||||||
|
return Text(
|
||||||
|
label,
|
||||||
|
style: context.textTheme.bodySmall?.copyWith(
|
||||||
|
color: ColorsManager.lightGreyColor,
|
||||||
|
fontSize: 8,
|
||||||
|
),
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
Reference in New Issue
Block a user