### Install Application Bundle Source: https://github.com/imanneo/fl_chart/blob/main/example/linux/CMakeLists.txt Configures the installation process to create a relocatable application bundle, including cleaning the build directory, installing the executable, and copying data and libraries. ```cmake # === Installation === # By default, "installing" just makes a relocatable bundle in the build # directory. set(BUILD_BUNDLE_DIR "${PROJECT_BINARY_DIR}/bundle") if(CMAKE_INSTALL_PREFIX_INITIALIZED_TO_DEFAULT) set(CMAKE_INSTALL_PREFIX "${BUILD_BUNDLE_DIR}" CACHE PATH "..." FORCE) endif() # Start with a clean build bundle directory every time. install(CODE " file(REMOVE_RECURSE \"${BUILD_BUNDLE_DIR}/\") " COMPONENT Runtime) set(INSTALL_BUNDLE_DATA_DIR "${CMAKE_INSTALL_PREFIX}/data") set(INSTALL_BUNDLE_LIB_DIR "${CMAKE_INSTALL_PREFIX}/lib") install(TARGETS ${BINARY_NAME} RUNTIME DESTINATION "${CMAKE_INSTALL_PREFIX}" COMPONENT Runtime) install(FILES "${FLUTTER_ICU_DATA_FILE}" DESTINATION "${INSTALL_BUNDLE_DATA_DIR}" COMPONENT Runtime) install(FILES "${FLUTTER_LIBRARY}" DESTINATION "${INSTALL_BUNDLE_LIB_DIR}" COMPONENT Runtime) foreach(bundled_library ${PLUGIN_BUNDLED_LIBRARIES}) install(FILES "${bundled_library}" DESTINATION "${INSTALL_BUNDLE_LIB_DIR}" COMPONENT Runtime) endforeach(bundled_library) # Copy the native assets provided by the build.dart from all packages. set(NATIVE_ASSETS_DIR "${PROJECT_BUILD_DIR}native_assets/linux/") install(DIRECTORY "${NATIVE_ASSETS_DIR}" DESTINATION "${INSTALL_BUNDLE_LIB_DIR}" COMPONENT Runtime) # Fully re-copy the assets directory on each build to avoid having stale files # from a previous install. set(FLUTTER_ASSET_DIR_NAME "flutter_assets") install(CODE " file(REMOVE_RECURSE \"${INSTALL_BUNDLE_DATA_DIR}/${FLUTTER_ASSET_DIR_NAME}\") " COMPONENT Runtime) install(DIRECTORY "${PROJECT_BUILD_DIR}/${FLUTTER_ASSET_DIR_NAME}" DESTINATION "${INSTALL_BUNDLE_DATA_DIR}" COMPONENT Runtime) # Install the AOT library on non-Debug builds only. if(NOT CMAKE_BUILD_TYPE MATCHES "Debug") install(FILES "${AOT_LIBRARY}" DESTINATION "${INSTALL_BUNDLE_LIB_DIR}" COMPONENT Runtime) endif() ``` -------------------------------- ### Installation Configuration Source: https://github.com/imanneo/fl_chart/blob/main/example/windows/CMakeLists.txt Configures installation rules for the application executable, support files, and assets. It ensures files are copied next to the executable for in-place running. ```cmake # === Installation === # Support files are copied into place next to the executable, so that it can # run in place. This is done instead of making a separate bundle (as on Linux) # so that building and running from within Visual Studio will work. set(BUILD_BUNDLE_DIR "$") # Make the "install" step default, as it's required to run. set(CMAKE_VS_INCLUDE_INSTALL_TO_DEFAULT_BUILD 1) if(CMAKE_INSTALL_PREFIX_INITIALIZED_TO_DEFAULT) set(CMAKE_INSTALL_PREFIX "${BUILD_BUNDLE_DIR}" CACHE PATH "..." FORCE) endif() set(INSTALL_BUNDLE_DATA_DIR "${CMAKE_INSTALL_PREFIX}/data") set(INSTALL_BUNDLE_LIB_DIR "${CMAKE_INSTALL_PREFIX}") install(TARGETS ${BINARY_NAME} RUNTIME DESTINATION "${CMAKE_INSTALL_PREFIX}" COMPONENT Runtime) install(FILES "${FLUTTER_ICU_DATA_FILE}" DESTINATION "${INSTALL_BUNDLE_DATA_DIR}" COMPONENT Runtime) install(FILES "${FLUTTER_LIBRARY}" DESTINATION "${INSTALL_BUNDLE_LIB_DIR}" COMPONENT Runtime) if(PLUGIN_BUNDLED_LIBRARIES) install(FILES "${PLUGIN_BUNDLED_LIBRARIES}" DESTINATION "${INSTALL_BUNDLE_LIB_DIR}" COMPONENT Runtime) endif() # Fully re-copy the assets directory on each build to avoid having stale files # from a previous install. set(FLUTTER_ASSET_DIR_NAME "flutter_assets") install(CODE " file(REMOVE_RECURSE \"${INSTALL_BUNDLE_DATA_DIR}/${FLUTTER_ASSET_DIR_NAME}\") " COMPONENT Runtime) install(DIRECTORY "${PROJECT_BUILD_DIR}/${FLUTTER_ASSET_DIR_NAME}" DESTINATION "${INSTALL_BUNDLE_DATA_DIR}" COMPONENT Runtime) # Install the AOT library on non-Debug builds only. install(FILES "${AOT_LIBRARY}" DESTINATION "${INSTALL_BUNDLE_DATA_DIR}" CONFIGURATIONS Profile;Release COMPONENT Runtime) ``` -------------------------------- ### Install Project Dependencies Source: https://github.com/imanneo/fl_chart/blob/main/CONTRIBUTING.md Install all necessary packages for the FL Chart project. ```bash flutter packages get ``` -------------------------------- ### Install Xcode Command Line Tools Source: https://github.com/imanneo/fl_chart/blob/main/example/fastlane/README.md Ensure you have the latest version of the Xcode command line tools installed before proceeding with fastlane installation. ```sh xcode-select --install ``` -------------------------------- ### Line Chart Samples Source: https://github.com/imanneo/fl_chart/blob/main/repo_files/documentations/line_chart.md Visual examples and source code links for various line chart implementations. ```APIDOC ## Line Chart Samples ### Description This section provides visual examples and links to source code for different line chart configurations and features. ### Samples - **Sample 1**: [Source Code](/example/lib/presentation/samples/line/line_chart_sample1.dart) - **Sample 2**: [Source Code](/example/lib/presentation/samples/line/line_chart_sample2.dart) - **Sample 3**: [Source Code](/example/lib/presentation/samples/line/line_chart_sample3.dart) - **Sample 4**: [Source Code](/example/lib/presentation/samples/line/line_chart_sample4.dart) - **Sample 5**: [Source Code](/example/lib/presentation/samples/line/line_chart_sample5.dart) - **Sample 6 - Reversed**: [Source Code](/example/lib/presentation/samples/line/line_chart_sample6.dart) - **Sample 7**: [Source Code](/example/lib/presentation/samples/line/line_chart_sample7.dart) - **Sample 8**: [Source Code](/example/lib/presentation/samples/line/line_chart_sample8.dart) - **Sample 9**: [Source Code](/example/lib/presentation/samples/line/line_chart_sample9.dart) - **Sample 10**: [Source Code](/example/lib/presentation/samples/line/line_chart_sample10.dart) - **Sample 11**: [Source Code](/example/lib/presentation/samples/line/line_chart_sample11.dart) ``` -------------------------------- ### Scatter Chart Samples Source: https://github.com/imanneo/fl_chart/blob/main/repo_files/documentations/scatter_chart.md Visual examples of scatter chart implementations. ```APIDOC ## Scatter Chart Samples ### Sample 1 ![Scatter Chart Sample 1](https://github.com/imaNNeo/fl_chart/raw/main/repo_files/images/scatter_chart/scatter_chart_sample_1.gif) [Source Code](/example/lib/presentation/samples/scatter/scatter_chart_sample1.dart) ### Sample 2 ![Scatter Chart Sample 2](https://github.com/imaNNeo/fl_chart/raw/main/repo_files/images/scatter_chart/scatter_chart_sample_2.gif) [Source Code](/example/lib/presentation/samples/scatter/scatter_chart_sample2.dart) ``` -------------------------------- ### Custom Gauge Pointers: Needle and Circle Source: https://github.com/imanneo/fl_chart/blob/main/repo_files/documentations/gauge_chart.md Example of using GaugePointerNeedlePainter and GaugePointerCirclePainter to create a speedometer-like needle with a pivot cap. Both pointers share the same value to align them. ```dart pointers: const [ GaugePointer( value: 0.65, painter: GaugePointerNeedlePainter(length: 70, width: 8, tailLength: 14), ), GaugePointer( value: 0.65, painter: GaugePointerCirclePainter(radius: 8, color: Colors.black), ), ], ``` -------------------------------- ### Gist - Toggleable Tooltip Source: https://github.com/imanneo/fl_chart/blob/main/repo_files/documentations/bar_chart.md A gist demonstrating a toggleable tooltip functionality for charts. This code requires specific setup within a Flutter project. ```dart import 'package:fl_chart/fl_chart.dart'; import 'package:flutter/material.dart'; const Color barBackgroundColor = Color(0xff72d7cf); const Color barColor = Color(0xff374142); const Color chipBackgroundColor = Color(0xff374142); class BarChartToggleableTooltipSample extends StatefulWidget { const BarChartToggleableTooltipSample({super.key}); @override State createState() => _BarChartToggleableTooltipSampleState(); } class _BarChartToggleableTooltipSampleState extends State { @override Widget build(BuildContext context) { return AspectRatio( aspectRatio: 1.70, child: Card( elevation: 0, shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(4)), color: barBackgroundColor, child: Padding(padding: const EdgeInsets.all(16), child: _BarChart()), ), ); } } class _BarChart extends StatefulWidget { const _BarChart(); @override State<_BarChart> createState() => _BarChartState(); } class _BarChartState extends State<_BarChart> { int touchedIndex = -1; @override Widget build(BuildContext context) { return BarChart( BarChartData( alignment: BarChartAlignment.center, barTouchData: BarTouchData( handleBuiltInTouches: false, touchTooltipData: BarTouchTooltipData( tooltipBgColor: Colors.grey.shade800, tooltipRoundedRadius: 10, getTooltipItem: ( BarChartGroupData group, int groupIndex, BarChartRodData rod, int rodIndex, ) { return BarTooltipItem( rod.toY.round().toString(), const TextStyle(color: Colors.white, fontWeight: FontWeight.bold, fontSize: 14), ); }, ), touchCallback: (FlTouchEvent event, BarTouchResponse? response) { setState(() { if (response?.spot == null || response?.touchHeight == null) { touchedIndex = -1; } else { touchedIndex = response!.spot!.touchedBarGroupIndex; } }); }, ), titlesData: FlTitlesData( show: true, bottomTitles: AxisTitles( sideTitles: SideTitles( showTitles: true, reservedSize: 30, getTitlesWidget: (value, meta) { switch (value.toInt()) { case 0: return const Text('Mn', overflow: TextOverflow.ellipsis); case 1: return const Text('Te', overflow: TextOverflow.ellipsis); case 2: return const Text('Wd', overflow: TextOverflow.ellipsis); case 3: return const Text('Th', overflow: TextOverflow.ellipsis); case 4: return const Text('Fr', overflow: TextOverflow.ellipsis); case 5: return const Text('Sa', overflow: TextOverflow.ellipsis); case 6: return const Text('Su', overflow: TextOverflow.ellipsis); default: return const SizedBox(); } }, ), ), leftTitles: AxisTitles( sideTitles: SideTitles(showTitles: false), ), topTitles: AxisTitles( sideTitles: SideTitles(showTitles: false), ), rightTitles: AxisTitles( sideTitles: SideTitles(showTitles: false), ), ), gridData: GridData( show: true, drawVerticalLine: false, getDrawingHorizontalLine: (value) => const FlLine(color: Colors.transparent), drawHorizontalLine: true, getDrawingVerticalLine: (value) => const FlLine(color: Colors.transparent), drawVerticalLine: true, ), borderData: FlBorderData( show: false, ), backgroundColor: Colors.transparent, titles: null, extraLinesData: [], barGroups: [ BarChartGroupData( x: 0, barRods: [ BarChartRodData(toY: 8, width: 16, color: touchedIndex == 0 ? Colors.pink : barColor, borderRadius: BorderRadius.zero) ], ), BarChartGroupData( x: 1, barRods: [ BarChartRodData(toY: 10, width: 16, color: touchedIndex == 1 ? Colors.pink : barColor, borderRadius: BorderRadius.zero) ], ), BarChartGroupData( x: 2, barRods: [ BarChartRodData(toY: 14, width: 16, color: touchedIndex == 2 ? Colors.pink : barColor, borderRadius: BorderRadius.zero) ], ), BarChartGroupData( x: 3, barRods: [ BarChartRodData(toY: 13, width: 16, color: touchedIndex == 3 ? Colors.pink : barColor, borderRadius: BorderRadius.zero) ], ), BarChartGroupData( x: 4, barRods: [ BarChartRodData(toY: 11, width: 16, color: touchedIndex == 4 ? Colors.pink : barColor, borderRadius: BorderRadius.zero) ], ), BarChartGroupData( x: 5, barRods: [ BarChartRodData(toY: 12, width: 16, color: touchedIndex == 5 ? Colors.pink : barColor, borderRadius: BorderRadius.zero) ], ), BarChartGroupData( x: 6, barRods: [ BarChartRodData(toY: 10, width: 16, color: touchedIndex == 6 ? Colors.pink : barColor, borderRadius: BorderRadius.zero) ], ), ], ), ); } } ``` -------------------------------- ### Set Flutter Library Path Source: https://github.com/imanneo/fl_chart/blob/main/example/windows/flutter/CMakeLists.txt Defines the path to the Flutter library DLL. This is published to the parent scope for use in the install step. ```cmake set(FLUTTER_LIBRARY "${EPHEMERAL_DIR}/flutter_windows.dll") # Published to parent scope for install step. set(FLUTTER_LIBRARY ${FLUTTER_LIBRARY} PARENT_SCOPE) set(FLUTTER_ICU_DATA_FILE "${EPHEMERAL_DIR}/icudtl.dat" PARENT_SCOPE) set(PROJECT_BUILD_DIR "${PROJECT_DIR}/build/" PARENT_SCOPE) set(AOT_LIBRARY "${PROJECT_DIR}/build/windows/app.so" PARENT_SCOPE) ``` -------------------------------- ### Navigate to Project Directory Source: https://github.com/imanneo/fl_chart/blob/main/CONTRIBUTING.md Change the current directory to the cloned fl_chart project. ```bash cd fl_chart ``` -------------------------------- ### Run Pre-Push Checks Source: https://github.com/imanneo/fl_chart/blob/main/CONTRIBUTING.md Execute both tests and style checks sequentially before pushing your code. This command runs 'make runTests' followed by 'make checkstyle'. ```bash make sure ``` -------------------------------- ### Apply Absolute Angle to RadarChart Title Source: https://github.com/imanneo/fl_chart/blob/main/repo_files/documentations/migration_guides/0.55.0/MIGRATION_00_55_00.md Example of applying an absolute angle to a RadarChart title for custom rotation. ```dart RadarChartTitle(text: 'Desktop', angle: 90); ``` -------------------------------- ### Apply Relative Angle to RadarChart Title Source: https://github.com/imanneo/fl_chart/blob/main/repo_files/documentations/migration_guides/0.55.0/MIGRATION_00_55_00.md Example of applying a relative angle to a RadarChart title for custom rotation. ```dart RadarChartTitle(text: 'Desktop', angle: angle + 90); ``` -------------------------------- ### Format Code Source: https://github.com/imanneo/fl_chart/blob/main/CONTRIBUTING.md Run this command to automatically reformat your code according to project standards. ```bash make format ``` -------------------------------- ### Apply Standard Build Settings Source: https://github.com/imanneo/fl_chart/blob/main/example/windows/runner/CMakeLists.txt Applies a standard set of build settings to the executable target. This can be customized or removed if different build configurations are needed. ```cmake # Apply the standard set of build settings. This can be removed for applications # that need different build settings. apply_standard_settings(${BINARY_NAME}) ``` -------------------------------- ### Project-Level CMake Configuration Source: https://github.com/imanneo/fl_chart/blob/main/example/windows/CMakeLists.txt Sets up the minimum CMake version, project name, and executable name. It also includes modern CMake policies and defines build configurations. ```cmake cmake_minimum_required(VERSION 3.14) project(fl_chart_app LANGUAGES CXX) # The name of the executable created for the application. Change this to change # the on-disk name of your application. set(BINARY_NAME "fl_chart_app") # Explicitly opt in to modern CMake behaviors to avoid warnings with recent # versions of CMake. cmake_policy(SET CMP0063 NEW) ``` -------------------------------- ### Basic Bar Chart Usage Source: https://github.com/imanneo/fl_chart/blob/main/repo_files/documentations/bar_chart.md Demonstrates the fundamental way to create a Bar Chart using the BarChart widget and BarChartData. ```APIDOC ## Basic Bar Chart Usage ### Description This section shows the basic implementation of a Bar Chart. ### Method Widget Instantiation ### Endpoint N/A ### Request Body N/A ### Request Example ```dart BarChart( BarChartData( // Configuration for the bar chart data ), duration: Duration(milliseconds: 150), // Optional: Animation duration curve: Curves.linear, // Optional: Animation curve ); ``` ### Response N/A ``` -------------------------------- ### Clone FL Chart Repository Source: https://github.com/imanneo/fl_chart/blob/main/CONTRIBUTING.md Clone the FL Chart repository to your local machine. Replace 'your-username' with your GitHub username. ```bash git clone https://github.com/your-username/fl_chart.git ``` -------------------------------- ### Define C++ Wrapper Plugin Sources Source: https://github.com/imanneo/fl_chart/blob/main/example/windows/flutter/CMakeLists.txt Lists the C++ source files specific to plugin registration and prepends the wrapper root directory. These are used when building the plugin wrapper library. ```cmake list(APPEND CPP_WRAPPER_SOURCES_PLUGIN "plugin_registrar.cc" ) list(TRANSFORM CPP_WRAPPER_SOURCES_PLUGIN PREPEND "${WRAPPER_ROOT}/") ``` -------------------------------- ### Find System Dependencies Source: https://github.com/imanneo/fl_chart/blob/main/example/linux/flutter/CMakeLists.txt Finds required system libraries (GTK, GLIB, GIO) using PkgConfig for the Flutter application. ```cmake find_package(PkgConfig REQUIRED) pkg_check_modules(GTK REQUIRED IMPORTED_TARGET gtk+-3.0) pkg_check_modules(GLIB REQUIRED IMPORTED_TARGET glib-2.0) pkg_check_modules(GIO REQUIRED IMPORTED_TARGET gio-2.0) ``` -------------------------------- ### Bar Chart Sample 1: Basic Bar Chart Source: https://github.com/imanneo/fl_chart/blob/main/repo_files/documentations/bar_chart.md Demonstrates a simple bar chart. Ensure the fl_chart package is added to your project dependencies. ```dart import 'package:fl_chart/fl_chart.dart'; import 'package:flutter/material.dart'; class BarChartSample1 extends StatefulWidget { const BarChartSample1({super.key}); @override State createState() => _BarChartSample1State(); } class _BarChartSample1State extends State { @override Widget build(BuildContext context) { return AspectRatio( aspectRatio: 1.70, child: Card( elevation: 0, shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(4)), color: const Color(0xff0293ee), child: Padding(padding: const EdgeInsets.all(16), child: _BarChart()), ), ); } } class _BarChart extends StatelessWidget { const _BarChart(); @override Widget build(BuildContext context) { return BarChart( BarChartData( alignment: BarChartAlignment.center, barTouchData: BarTouchData( enabled: false, ), titlesData: FlTitlesData( show: true, bottomTitles: AxisTitles( sideTitles: SideTitles( showTitles: true, reservedSize: 30, getTitlesWidget: (value, meta) { switch (value.toInt()) { case 0: return const Text('Mn', overflow: TextOverflow.ellipsis); case 1: return const Text('Te', overflow: TextOverflow.ellipsis); case 2: return const Text('Wd', overflow: TextOverflow.ellipsis); case 3: return const Text('Th', overflow: TextOverflow.ellipsis); case 4: return const Text('Fr', overflow: TextOverflow.ellipsis); case 5: return const Text('Sa', overflow: TextOverflow.ellipsis); case 6: return const Text('Su', overflow: TextOverflow.ellipsis); default: return const SizedBox(); } }, ), ), leftTitles: AxisTitles( sideTitles: SideTitles(showTitles: false), ), topTitles: AxisTitles( sideTitles: SideTitles(showTitles: false), ), rightTitles: AxisTitles( sideTitles: SideTitles(showTitles: false), ), ), gridData: GridData( show: true, drawVerticalLine: false, getDrawingHorizontalLine: (value) => const FlLine(color: Color(0xff374142), strokeWidth: 1), drawHorizontalLine: true, getDrawingVerticalLine: (value) => const FlLine(color: Color(0xff374142), strokeWidth: 1), drawVerticalLine: true, ), borderData: FlBorderData( show: false, ), backgroundColor: Colors.transparent, titles: null, extraLinesData: [], barGroups: [ BarChartGroupData( x: 0, barRods: [ BarChartRodData(toY: 8, width: 16, color: Colors.white.withOpacity(0.6), borderRadius: BorderRadius.zero) ], ), BarChartGroupData( x: 1, barRods: [ BarChartRodData(toY: 10, width: 16, color: Colors.white.withOpacity(0.6), borderRadius: BorderRadius.zero) ], ), BarChartGroupData( x: 2, barRods: [ BarChartRodData(toY: 14, width: 16, color: Colors.white.withOpacity(0.6), borderRadius: BorderRadius.zero) ], ), BarChartGroupData( x: 3, barRods: [ BarChartRodData(toY: 13, width: 16, color: Colors.white.withOpacity(0.6), borderRadius: BorderRadius.zero) ], ), BarChartGroupData( x: 4, barRods: [ BarChartRodData(toY: 11, width: 16, color: Colors.white.withOpacity(0.6), borderRadius: BorderRadius.zero) ], ), BarChartGroupData( x: 5, barRods: [ BarChartRodData(toY: 12, width: 16, color: Colors.white.withOpacity(0.6), borderRadius: BorderRadius.zero) ], ), BarChartGroupData( x: 6, barRods: [ BarChartRodData(toY: 10, width: 16, color: Colors.white.withOpacity(0.6), borderRadius: BorderRadius.zero) ], ), ], ), ); } } ``` -------------------------------- ### Define Project and Executable Name Source: https://github.com/imanneo/fl_chart/blob/main/example/linux/CMakeLists.txt Sets the minimum CMake version and the project name, along with the desired name for the application's executable. ```cmake cmake_minimum_required(VERSION 3.13) project(runner LANGUAGES CXX) # The name of the executable created for the application. Change this to change # the on-disk name of your application. set(BINARY_NAME "fLChartApp") # The unique GTK application identifier for this application. See: # https://wiki.gnome.org/HowDoI/ChooseApplicationID set(APPLICATION_ID "dev.flchart.app") ``` -------------------------------- ### Basic RadarChart Implementation Source: https://github.com/imanneo/fl_chart/blob/main/repo_files/documentations/radar_chart.md This is the fundamental way to render a RadarChart. Ensure RadarChartData is properly configured. ```dart RadarChart( RadarChartData( // read about it in the RadarChartData section ), swapAnimationDuration: Duration(milliseconds: 150), // Optional swapAnimationCurve: Curves.linear, // Optional ); ``` -------------------------------- ### Create Flutter Wrapper Plugin Library Source: https://github.com/imanneo/fl_chart/blob/main/example/windows/flutter/CMakeLists.txt Creates a STATIC library target 'flutter_wrapper_plugin' using core and plugin-specific C++ sources. It applies standard build settings, sets visibility to hidden, links against the 'flutter' target, and includes the wrapper's public headers. ```cmake add_library(flutter_wrapper_plugin STATIC ${CPP_WRAPPER_SOURCES_CORE} ${CPP_WRAPPER_SOURCES_PLUGIN} ) apply_standard_settings(flutter_wrapper_plugin) set_target_properties(flutter_wrapper_plugin PROPERTIES POSITION_INDEPENDENT_CODE ON) set_target_properties(flutter_wrapper_plugin PROPERTIES CXX_VISIBILITY_PRESET hidden) target_link_libraries(flutter_wrapper_plugin PUBLIC flutter) target_include_directories(flutter_wrapper_plugin PUBLIC "${WRAPPER_ROOT}/include" ) add_dependencies(flutter_wrapper_plugin flutter_assemble) ``` -------------------------------- ### Check Code Style Source: https://github.com/imanneo/fl_chart/blob/main/CONTRIBUTING.md Run this command to ensure your code adheres to formatting guidelines. It checks for analysis warnings/errors and verifies code formatting. ```bash make checkstyle ``` -------------------------------- ### Solid Color Representation (Now) Source: https://github.com/imanneo/fl_chart/blob/main/repo_files/documentations/migration_guides/0.50.0/MIGRATION_00_50_00.md Demonstrates the current approach for defining a solid color by using the `color` property. ```dart LineChartBarData( color: Colors.red ) ``` -------------------------------- ### Define Executable Target and Source Files Source: https://github.com/imanneo/fl_chart/blob/main/example/windows/runner/CMakeLists.txt Defines the main executable target for the Windows runner and lists all source files required for the build. Ensure any new source files are added here. ```cmake cmake_minimum_required(VERSION 3.14) project(runner LANGUAGES CXX) # Define the application target. To change its name, change BINARY_NAME in the # top-level CMakeLists.txt, not the value here, or `flutter run` will no longer # work. # # Any new source files that you add to the application should be added here. add_executable(${BINARY_NAME} WIN32 "flutter_window.cpp" "main.cpp" "utils.cpp" "win32_window.cpp" "${FLUTTER_MANAGED_DIR}/generated_plugin_registrant.cc" "Runner.rc" "runner.exe.manifest" ) ``` -------------------------------- ### Basic Pie Chart Implementation Source: https://github.com/imanneo/fl_chart/blob/main/repo_files/documentations/pie_chart.md Instantiate a PieChart widget with PieChartData. Optional duration and curve properties can control implicit animations. ```dart PieChart( PieChartData( // read about it in the PieChartData section ), duration: Duration(milliseconds: 150), // Optional curve: Curves.linear, // Optional ); ``` -------------------------------- ### Create Flutter Wrapper App Library Source: https://github.com/imanneo/fl_chart/blob/main/example/windows/flutter/CMakeLists.txt Creates a STATIC library target 'flutter_wrapper_app' using core and application-specific C++ sources. It applies standard build settings, links against the 'flutter' target, and includes the wrapper's public headers. ```cmake add_library(flutter_wrapper_app STATIC ${CPP_WRAPPER_SOURCES_CORE} ${CPP_WRAPPER_SOURCES_APP} ) apply_standard_settings(flutter_wrapper_app) target_link_libraries(flutter_wrapper_app PUBLIC flutter) target_include_directories(flutter_wrapper_app PUBLIC "${WRAPPER_ROOT}/include" ) add_dependencies(flutter_wrapper_app flutter_assemble) ``` -------------------------------- ### Run All Tests Source: https://github.com/imanneo/fl_chart/blob/main/CONTRIBUTING.md Execute all unit tests to ensure code correctness. This command internally runs 'flutter test'. ```bash make runTests ``` -------------------------------- ### Define C++ Wrapper Core Sources Source: https://github.com/imanneo/fl_chart/blob/main/example/windows/flutter/CMakeLists.txt Lists the core C++ source files for the wrapper and prepends the wrapper root directory to each path. These files contain fundamental implementations for the C++ client wrapper. ```cmake list(APPEND CPP_WRAPPER_SOURCES_CORE "core_implementations.cc" "standard_codec.cc" ) list(TRANSFORM CPP_WRAPPER_SOURCES_CORE PREPEND "${WRAPPER_ROOT}/") ``` -------------------------------- ### Basic Gauge Chart Initialization Source: https://github.com/imanneo/fl_chart/blob/main/repo_files/documentations/gauge_chart.md Initialize a basic Gauge Chart with GaugeChartData. Use optional duration and curve properties for animations. ```dart GaugeChart( GaugeChartData( // read about it in the GaugeChartData ring ), duration: Duration(milliseconds: 150), // Optional curve: Curves.linear, // Optional ); ``` -------------------------------- ### Common Bash Commands for FL Chart Source: https://github.com/imanneo/fl_chart/blob/main/CLAUDE.md A collection of make commands for running tests, analysis, formatting, and code generation within the FL Chart project. Use these for development and before pushing changes. ```bash make sure ``` ```bash make runTests ``` ```bash make analyze ``` ```bash make checkFormat ``` ```bash make format ``` ```bash make checkstyle ``` ```bash make codeGen ``` ```bash flutter test test/chart/line_chart/line_chart_painter_test.dart ``` -------------------------------- ### LineTouchTooltipData Configuration Source: https://github.com/imanneo/fl_chart/blob/main/repo_files/documentations/line_chart.md Configuration for the appearance and behavior of tooltips in LineChart. ```APIDOC ## LineTouchTooltipData ### Description Configuration for the appearance and behavior of tooltips in LineChart. ### Properties - **tooltipBorder** (BorderSide) - Border of the tooltip bubble. Default: `BorderSide.none` - **tooltipBorderRadius** (BorderRadius) - Background corner radius of the tooltip bubble. Default: `BorderRadius.circular(4)` - **tooltipPadding** (EdgeInsets) - Padding of the tooltip. Default: `EdgeInsets.symmetric(horizontal: 16, vertical: 8)` - **tooltipMargin** (double) - Margin between the tooltip and the touched spot. Default: `16` - **tooltipHorizontalAlignment** (FLHorizontalAlignment) - Horizontal alignment of tooltip relative to the spot. Default: `FLHorizontalAlignment.center` - **tooltipHorizontalOffset** (double) - Horizontal offset of tooltip. Default: `0` - **maxContentWidth** (double) - Maximum width of the tooltip (if a text row is wider than this, then the text breaks to a new line). Default: `120` - **getTooltipItems** (Function) - A callback that retrieves a list of [LineTooltipItem](#LineTooltipItem) by the given list of [LineBarSpot](#LineBarSpot). Default: `defaultLineTooltipItem` - **fitInsideHorizontally** (boolean) - Forces tooltip to horizontally shift inside the chart's bounding box. Default: `false` - **fitInsideVertically** (boolean) - Forces tooltip to vertically shift inside the chart's bounding box. Default: `false` - **showOnTopOfTheChartBoxArea** (boolean) - Forces the tooltip container to the top of the line. Default: `false` - **getTooltipColor** (Function) - A callback that retrieves the Color for each touched spot separately from the given [LineBarSpot](#LineBarSpot) to set the background color of the tooltip bubble. Default: `Colors.blueGrey.darken(15)` ``` -------------------------------- ### PieChartData Configuration Source: https://github.com/imanneo/fl_chart/blob/main/repo_files/documentations/pie_chart.md Detailed properties for configuring the PieChartData, including sections, spacing, and touch handling. ```APIDOC ## PieChartData Configuration ### Description This section details the properties available within `PieChartData` for customizing the appearance and behavior of the pie chart. ### Method N/A (Data Structure) ### Endpoint N/A (Data Structure) ### Parameters #### PieChartData Properties - **sections** (List<[PieChartSectionData](#PieChartSectionData)>) - List of sections to display on the pie chart. Defaults to an empty list `[]`. - **centerSpaceRadius** (double) - The radius of the free space in the center of the pie chart. Set to `double.infinity` to auto-calculate based on view size. Defaults to `double.nan`. - **centerSpaceColor** (Color) - The color of the free space in the center. Defaults to `Colors.transparent`. - **sectionsSpace** (double) - The space between sections (margin). Does not work on HTML renderer. Defaults to `2`. - **startDegreeOffset** (double) - The degree offset for sections around the pie chart. Should be between 0 and 360. Defaults to `0`. - **pieTouchData** ([PieTouchData](#pietouchdata-read-about-touch-handling)) - Holds touch interactivity details. Defaults to `PieTouchData()`. - **borderData** ([FlBorderData](base_chart.md#FlBorderData)) - Defines the border around the chart. Defaults to `FlBorderData()`. - **titleSunbeamLayout** (bool) - Determines if titles on each section should rotate. Defaults to `false`. ### Request Example N/A (Data Structure Configuration) ### Response N/A (Data Structure Configuration) ### See Also - [PieChartSectionData](#PieChartSectionData) - [PieTouchData](#pietouchdata-read-about-touch-handling) - [FlBorderData](base_chart.md#FlBorderData) ``` -------------------------------- ### ShowingTooltipIndicators Properties Source: https://github.com/imanneo/fl_chart/blob/main/repo_files/documentations/line_chart.md Configuration for which spots should have tooltips displayed. ```APIDOC ## ShowingTooltipIndicators ### Description Determines which spots should trigger the display of tooltips in the chart. ### Properties #### Path Parameters - **showingSpots** (List) - Optional - Specifies the spots for which each tooltip should be shown. ``` -------------------------------- ### Build Configuration Options Source: https://github.com/imanneo/fl_chart/blob/main/example/windows/CMakeLists.txt Defines the available build configurations (Debug, Profile, Release) based on whether the generator is multi-config. It also sets the default build type if not specified. ```cmake # Define build configuration option. get_property(IS_MULTICONFIG GLOBAL PROPERTY GENERATOR_IS_MULTI_CONFIG) if(IS_MULTICONFIG) set(CMAKE_CONFIGURATION_TYPES "Debug;Profile;Release" CACHE STRING "" FORCE) else() if(NOT CMAKE_BUILD_TYPE AND NOT CMAKE_CONFIGURATION_TYPES) set(CMAKE_BUILD_TYPE "Debug" CACHE STRING "Flutter build mode" FORCE) set_property(CACHE CMAKE_BUILD_TYPE PROPERTY STRINGS "Debug" "Profile" "Release") endif() endif() ``` -------------------------------- ### Flutter Tool Backend Command Source: https://github.com/imanneo/fl_chart/blob/main/example/linux/flutter/CMakeLists.txt Configures a custom command to run the Flutter tool backend script for building the Flutter library and headers. ```cmake add_custom_command( OUTPUT ${FLUTTER_LIBRARY} ${FLUTTER_LIBRARY_HEADERS} ${CMAKE_CURRENT_BINARY_DIR}/_phony_ COMMAND ${CMAKE_COMMAND} -E env ${FLUTTER_TOOL_ENVIRONMENT} "${FLUTTER_ROOT}/packages/flutter_tools/bin/tool_backend.sh" ${FLUTTER_TARGET_PLATFORM} ${CMAKE_BUILD_TYPE} VERBATIM ) ``` -------------------------------- ### Link Libraries and Include Directories Source: https://github.com/imanneo/fl_chart/blob/main/example/windows/runner/CMakeLists.txt Specifies the libraries and include directories required for the project. This includes Flutter's core libraries, wrapper, and Windows-specific libraries like dwmapi.lib. ```cmake # Add dependency libraries and include directories. Add any application-specific # dependencies here. target_link_libraries(${BINARY_NAME} PRIVATE flutter flutter_wrapper_app) target_link_libraries(${BINARY_NAME} PRIVATE "dwmapi.lib") target_include_directories(${BINARY_NAME} PRIVATE "${CMAKE_SOURCE_DIR}") ``` -------------------------------- ### Define Flutter Tool Backend Custom Command Source: https://github.com/imanneo/fl_chart/blob/main/example/windows/flutter/CMakeLists.txt Sets up a custom command to execute the Flutter tool backend script. This command is designed to run every time by using a phony output file, ensuring that the Flutter library and associated files are generated. ```cmake set(PHONY_OUTPUT "${CMAKE_CURRENT_BINARY_DIR}/_phony_") set_source_files_properties("${PHONY_OUTPUT}" PROPERTIES SYMBOLIC TRUE) add_custom_command( OUTPUT ${FLUTTER_LIBRARY} ${FLUTTER_LIBRARY_HEADERS} ${CPP_WRAPPER_SOURCES_CORE} ${CPP_WRAPPER_SOURCES_PLUGIN} ${CPP_WRAPPER_SOURCES_APP} ${PHONY_OUTPUT} COMMAND ${CMAKE_COMMAND} -E env ${FLUTTER_TOOL_ENVIRONMENT} "${FLUTTER_ROOT}/packages/flutter_tools/bin/tool_backend.bat" ${FLUTTER_TARGET_PLATFORM} $ VERBATIM ) ``` -------------------------------- ### Pie Chart Usage Source: https://github.com/imanneo/fl_chart/blob/main/repo_files/documentations/pie_chart.md Basic implementation of a Pie Chart using the PieChart widget and PieChartData. ```APIDOC ## Pie Chart Usage ### Description This section demonstrates the basic usage of the `PieChart` widget. It shows how to initialize the chart with `PieChartData` and optional animation properties. ### Method N/A (Widget Implementation) ### Endpoint N/A (Widget Implementation) ### Parameters #### Widget Properties - **duration** (Duration) - Optional - Controls the animation duration when the chart's state changes. - **curve** (Curve) - Optional - Defines the animation curve for state transitions. ### Request Example ```dart PieChart( PieChartData( // ... PieChartData configuration ... ), duration: Duration(milliseconds: 150), // Optional curve: Curves.linear, // Optional ); ``` ### Response N/A (Widget Implementation) ### Notes If a padding widget surrounds the `PieChart`, ensure `PieChartData.centerSpaceRadius` is set to `double.infinity` for correct rendering. ``` -------------------------------- ### Find and Check GTK Dependency Source: https://github.com/imanneo/fl_chart/blob/main/example/linux/CMakeLists.txt Uses PkgConfig to find and check for the GTK 3.0 library, making its imported target available for use. ```cmake # System-level dependencies. find_package(PkgConfig REQUIRED) pkg_check_modules(GTK REQUIRED IMPORTED_TARGET gtk+-3.0) ``` -------------------------------- ### Custom Gauge Markers: Min and Max Lines Source: https://github.com/imanneo/fl_chart/blob/main/repo_files/documentations/gauge_chart.md Demonstrates using GaugeMarker with GaugeMarkerLinePainter to add 'Min' and 'Max' markers at specific values on the gauge. The markers are positioned at the center and styled with different colors and labels. ```dart markers: [ GaugeMarker( value: 0.234, position: GaugeTickPosition.center, painter: GaugeMarkerLinePainter( length: 40, thickness: 4, color: Colors.green, label: 'Min', labelStyle: TextStyle(color: Colors.green, fontWeight: FontWeight.bold), labelSide: GaugeMarkerLabelSide.inward, ), ), GaugeMarker( value: 0.71, position: GaugeTickPosition.center, painter: GaugeMarkerLinePainter( length: 40, thickness: 4, color: Colors.red, label: 'Max', labelStyle: TextStyle(color: Colors.red, fontWeight: FontWeight.bold), labelSide: GaugeMarkerLabelSide.inward, ), ), ], ``` -------------------------------- ### Bar Chart Sample 7: Bar Chart with Tooltip Source: https://github.com/imanneo/fl_chart/blob/main/repo_files/documentations/bar_chart.md Features a bar chart with interactive tooltips. Ensure fl_chart is added to your project. ```dart import 'package:fl_chart/fl_chart.dart'; import 'package:flutter/material.dart'; class BarChartSample7 extends StatefulWidget { const BarChartSample7({super.key}); @override State createState() => _BarChartSample7State(); } class _BarChartSample7State extends State { @override Widget build(BuildContext context) { return AspectRatio( aspectRatio: 1.70, child: Card( elevation: 0, shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(4)), color: const Color(0xff0293ee), child: Padding(padding: const EdgeInsets.all(16), child: _BarChart()), ), ); } } class _BarChart extends StatelessWidget { const _BarChart(); @override Widget build(BuildContext context) { return BarChart( BarChartData( alignment: BarChartAlignment.center, barTouchData: BarTouchData( enabled: true, allowTouchFrameLine: false, handleBuiltInTouches: true, touchTooltipData: BarTouchTooltipData( tooltipBgColor: Colors.blueGrey, getTooltipItem: ( BarChartGroupData group, int groupIndex, BarChartRodData rod, int rodIndex, ) { return BarTooltipItem( rod.toY.round().toString(), const TextStyle(color: Colors.white, fontWeight: FontWeight.bold, fontSize: 14), ); }, ), ), titlesData: FlTitlesData( show: true, bottomTitles: AxisTitles( sideTitles: SideTitles( showTitles: true, reservedSize: 30, getTitlesWidget: (value, meta) { switch (value.toInt()) { case 0: return const Text('Mn', overflow: TextOverflow.ellipsis); case 1: return const Text('Te', overflow: TextOverflow.ellipsis); case 2: return const Text('Wd', overflow: TextOverflow.ellipsis); case 3: return const Text('Th', overflow: TextOverflow.ellipsis); case 4: return const Text('Fr', overflow: TextOverflow.ellipsis); case 5: return const Text('Sa', overflow: TextOverflow.ellipsis); case 6: return const Text('Su', overflow: TextOverflow.ellipsis); default: return const SizedBox(); } }, ), ), leftTitles: AxisTitles( sideTitles: SideTitles(showTitles: false), ), topTitles: AxisTitles( sideTitles: SideTitles(showTitles: false), ), rightTitles: AxisTitles( sideTitles: SideTitles(showTitles: false), ), ), gridData: GridData( show: true, drawVerticalLine: false, getDrawingHorizontalLine: (value) => const FlLine(color: Color(0xff374142), strokeWidth: 1), drawHorizontalLine: true, getDrawingVerticalLine: (value) => const FlLine(color: Color(0xff374142), strokeWidth: 1), drawVerticalLine: true, ), borderData: FlBorderData( show: false, ), backgroundColor: Colors.transparent, titles: null, extraLinesData: [], barGroups: [ BarChartGroupData( x: 0, barRods: [ BarChartRodData(toY: 8, width: 16, color: Colors.white.withOpacity(0.6), borderRadius: BorderRadius.zero) ], ), BarChartGroupData( x: 1, barRods: [ BarChartRodData(toY: 10, width: 16, color: Colors.white.withOpacity(0.6), borderRadius: BorderRadius.zero) ], ), BarChartGroupData( x: 2, barRods: [ BarChartRodData(toY: 14, width: 16, color: Colors.white.withOpacity(0.6), borderRadius: BorderRadius.zero) ], ), BarChartGroupData( x: 3, barRods: [ BarChartRodData(toY: 13, width: 16, color: Colors.white.withOpacity(0.6), borderRadius: BorderRadius.zero) ], ), BarChartGroupData( x: 4, barRods: [ BarChartRodData(toY: 11, width: 16, color: Colors.white.withOpacity(0.6), borderRadius: BorderRadius.zero) ], ), BarChartGroupData( x: 5, barRods: [ BarChartRodData(toY: 12, width: 16, color: Colors.white.withOpacity(0.6), borderRadius: BorderRadius.zero) ], ), BarChartGroupData( x: 6, barRods: [ BarChartRodData(toY: 10, width: 16, color: Colors.white.withOpacity(0.6), borderRadius: BorderRadius.zero) ], ), ], ), ); } } ``` -------------------------------- ### LineTooltipItem Configuration Source: https://github.com/imanneo/fl_chart/blob/main/repo_files/documentations/line_chart.md Configuration for individual items within a LineChart tooltip. ```APIDOC ## LineTooltipItem ### Description Configuration for individual items within a LineChart tooltip. ### Properties - **text** (String) - Text string of each row in the tooltip bubble. Default: `null` - **textStyle** (TextStyle) - TextStyle of the showing text row. Default: `null` - **textAlign** (TextAlign) - TextAlign of the showing text row. Default: `TextAlign.center` - **textDirection** (TextDirection) - TextDirection of the showing text row. Default: `TextDirection.ltr` - **children** (List) - Pass additional InlineSpan children for a more advance tooltip. Default: `null` ``` -------------------------------- ### Unicode and Standard Compilation Settings Source: https://github.com/imanneo/fl_chart/blob/main/example/windows/CMakeLists.txt Enables Unicode support and applies standard compilation features and options, including C++17 standard, warning levels, and exception handling. ```cmake # Use Unicode for all projects. add_definitions(-DUNICODE -D_UNICODE) # Compilation settings that should be applied to most targets. # # Be cautious about adding new options here, as plugins use this function by # default. In most cases, you should add new options to specific targets instead # of modifying this function. function(APPLY_STANDARD_SETTINGS TARGET) target_compile_features(${TARGET} PUBLIC cxx_std_17) target_compile_options(${TARGET} PRIVATE /W4 /WX /wd"4100") target_compile_options(${TARGET} PRIVATE /EHsc) target_compile_definitions(${TARGET} PRIVATE "_HAS_EXCEPTIONS=0") target_compile_definitions(${TARGET} PRIVATE "$<$:_DEBUG>") endfunction() ``` -------------------------------- ### LineTouchData Configuration Source: https://github.com/imanneo/fl_chart/blob/main/repo_files/documentations/line_chart.md Configuration for touch interactions on LineChart. ```APIDOC ## LineTouchData ### Description Configuration for touch interactions on LineChart, including tooltips and indicators. ### Properties - **enabled** (boolean) - Determines whether to enable or disable touch behaviors. Default: `true` - **mouseCursorResolver** (Function) - You can change the mouse cursor based on the provided [FlTouchEvent](https://github.com/imaNNeo/fl_chart/blob/main/repo_files/documentations/base_chart.md#fltouchevent) and [LineTouchResponse](#LineTouchResponse). Default: `MouseCursor.defer` - **touchTooltipData** (LineTouchTooltipData) - Determines how to show the tooltip on top of touched spots (appearance of the showing tooltip bubble). Default: `LineTouchTooltipData` - **getTouchedSpotIndicator** (Function) - A callback that retrieves a list of [TouchedSpotIndicatorData](#TouchedSpotIndicatorData) by the given list of [LineBarSpot](#LineBarSpot) for showing the indicators on touched spots. Default: `defaultTouchedIndicators` - **touchSpotThreshold** (double) - The threshold of the touch accuracy. Default: `10` - **distanceCalculator** (Function) - A function to calculate the distance between a spot and a touch event. Default: `_xDistance` - **handleBuiltInTouches** (boolean) - Set this to true if you want the built-in touch handling (show a tooltip bubble and an indicator on touched spots). Default: `true` - **getTouchLineStart** (Function) - Controls where the line starts, default is bottom of the chart. Default: `defaultGetTouchLineStart` - **getTouchLineEnd** (Function) - Controls where the line ends, default is the touch point. Default: `defaultGetTouchLineEnd` - **touchCallback** (Function) - Listen to this callback to retrieve touch/pointer events and responses, it gives you a [FlTouchEvent](https://github.com/imaNNeo/fl_chart/blob/main/repo_files/documentations/base_chart.md#fltouchevent) and [LineTouchResponse](#LineTouchResponse). Default: `null` - **longPressDuration** (Duration) - Allows you to customize the duration of the longPress gesture. If null, the duration of the longPressGesture is [kLongPressTimeout](https://api.flutter.dev/flutter/gestures/kLongPressTimeout-constant.html). Default: `null` ```