modern_charts 0.1.13

  • Installing
  • Versions
  • 38

A package for creating simple yet modern looking charts.

Five chart types

  • Bar

  • Gauge

  • Line

  • Pie

  • Radar

Canvas + DOM

modern_charts combines Canvas and DOM to achieve the best performance and experience.

  • Canvas is used to render chart contents (axes, grids, and series)
  • DOM is used to create legends and tooltips


Data are passed to a chart via a DataTable object. By using DataTable, you can flexibly modify the data even after the chart has been rendered.


Animations are supported for different types of data modifications:

  • New data table
  • Changes to data table values
  • Insertion and removal of rows (categories)
  • Insertion and removal of columns (series)
  • Series visibility toggle


Charts automatically resize when the browser is resized.


  • Shows tooltips on hover/tap
  • The visibility of a series is toggled when you click the corresponding legend item


Each chart type has its own class, so your final production code only contains the code of the chart types you use.


Please read the wiki for instructions on how to use these beautiful charts.


  • base: charts no longer resize automatically on window resize
  • base: fixed a bug that happens when Chart.resize and Chart.update is called while the width or height of the chart is zero
  • RadarChart: fixed a bug where the tooltip is still shown when all series are hidden


  • LineChart: fix a bug causing data labels not to be displayed even when enabled


  • LineChart: add series:markers:enabled option
  • RadarChart: add series:markers:enabled option


  • All: change the default background color of legend to transparent
  • BarChart: change bar group hover effect
  • BarChart: change tooltip offset
  • BarChart: change the positions of x-axis tick marks based on whether x-axis labels are skipped or not
  • BarChart, LineChart: hide x-axis tick marks whose corresponding labels are hidden
  • BarChart, LineChart: axis label baselines are adjusted with respect to font size
  • BarChart, LineChart: fix a bug in the calculation of hovered entity group


  • GaugeChart: fix a bug that causes the tooltip not to show when hovering the top left quadrant
  • LineChart: adjust the position of x-axis labels so they span the whole x-axis


  • BarChart: add xAxis:labels:maxRotation and xAxis:labels:minRotation
  • LineChart: add xAxis:labels:maxRotation and xAxis:labels:minRotation


  • Fix tooltip label formatter and value formatter
  • Update


  • Fix #10
  • Fix broken links in
  • Enable strong mode
  • Perform code cleanup
  • Improve performance
  • animation:easing now accepts a function
  • Add DataRow.toList
  • Rename degree to rad2deg and radian to deg2rad in utils.dart
  • PieChart: Add series:counterclockwise and series:startAngle options
  • PieChart: Pie labels, if enabled, are now displayed during animations
  • PieChart: Fix tooltip position when pieHole > 0


  • Change the semantics of yAxis:minValue and yAxis:maxValue
  • Add tooltip:labelFormatter and legend:labelFormatter


  • Add a 500ms delay before resizing all charts
  • Correct gauge center and outer radius


  • Fix #7
  • Fix #8
  • Add yAxis:minInterval setting to BarChart, LineChart, and RadarChart
  • Perform code cleanup


  • Fix #5
  • Fix #6
  • Format code using dartfmt


  • Fixed the legend-position-none bug


  • Initial version

Use this package as a library

1. Depend on it

Add this to your package's pubspec.yaml file:

  modern_charts: ^0.1.13

2. Install it

You can install packages from the command line:

with pub:

$ pub get

Alternatively, your editor might support pub get. Check the docs for your editor to learn more.

3. Import it

Now in your Dart code, you can use:

import 'package:modern_charts/modern_charts.dart';
Version Uploaded Documentation Archive
0.1.13 Jul 9, 2018 Go to the documentation of modern_charts 0.1.13 Download modern_charts 0.1.13 archive
0.1.12 Sep 11, 2017 Go to the documentation of modern_charts 0.1.12 Download modern_charts 0.1.12 archive
0.1.11 Aug 24, 2017 Go to the documentation of modern_charts 0.1.11 Download modern_charts 0.1.11 archive
0.1.10 Aug 21, 2017 Go to the documentation of modern_charts 0.1.10 Download modern_charts 0.1.10 archive
0.1.9 Aug 20, 2017 Go to the documentation of modern_charts 0.1.9 Download modern_charts 0.1.9 archive
0.1.8 Aug 10, 2017 Go to the documentation of modern_charts 0.1.8 Download modern_charts 0.1.8 archive
0.1.7 Jun 9, 2017 Go to the documentation of modern_charts 0.1.7 Download modern_charts 0.1.7 archive
0.1.6 Jun 8, 2017 Go to the documentation of modern_charts 0.1.6 Download modern_charts 0.1.6 archive
0.1.5 Jun 6, 2017 Go to the documentation of modern_charts 0.1.5 Download modern_charts 0.1.5 archive
0.1.4 Jun 6, 2017 Go to the documentation of modern_charts 0.1.4 Download modern_charts 0.1.4 archive

All 14 versions...

Describes how popular the package is relative to other packages. [more]
Code health derived from static analysis. [more]
Reflects how tidy and up-to-date the package is. [more]
Weighted score of the above. [more]
Learn more about scoring.

We analyzed this package on Oct 10, 2018, and provided a score, details, and suggestions below. Analysis was completed with status completed using:

  • Dart: 2.0.0
  • pana: 0.12.4


Detected platforms: unsure

Low code quality prevents platform classification.

Health issues and suggestions

Fix lib/src/animation.dart. (-94.37 points)

Analysis of lib/src/animation.dart failed with 10 errors, including:

line 86 col 22: Undefined name 'PI'.

line 90 col 18: Undefined name 'PI'.

line 94 col 24: Undefined name 'PI'.

line 141 col 18: Undefined name 'PI'.

line 144 col 52: Undefined name 'PI'.

Fix lib/src/base.dart. (-89.99 points)

Analysis of lib/src/base.dart failed with 8 errors, including:

line 109 col 18: Const variables must be initialized with a constant value.

line 109 col 18: Undefined name 'PI'.

line 112 col 15: Const variables must be initialized with a constant value.

line 112 col 15: Undefined name 'PI'.

line 998 col 58: The getter 'NEGATIVE_INFINITY' isn't defined for the class 'double'.

Fix lib/src/radar.dart. (-89.99 points)

Analysis of lib/src/radar.dart failed with 8 errors, including:

line 175 col 25: The getter 'MAX_FINITE' isn't defined for the class 'double'.

line 176 col 25: The getter 'MAX_FINITE' isn't defined for the class 'double'.

line 177 col 26: The getter 'MAX_FINITE' isn't defined for the class 'double'.

line 178 col 26: The getter 'MAX_FINITE' isn't defined for the class 'double'.

line 188 col 16: Couldn't infer type parameter 'T'.\n\nTried to infer 'dynamic' for 'T' which doesn't work:\n Type parameter 'T' declared to extend 'num'.\nThe type 'dynamic' was inferred from:\n Parameter 'a' declared as 'T'\n but argument is 'dynamic'.\n Parameter 'b' declared as 'T'\n but argument is 'double'.\n\nConsider passing explicit type argument(s) to the generic.\n\n

Fix additional 3 files with analysis or formatting issues. (-101.27 points)

Additional issues in the following files:

  • lib/src/utils.dart (5 errors)
  • lib/src/pie.dart (1 error)
  • lib/src/gauge.dart (Run dartfmt to format lib/src/gauge.dart.)

Maintenance issues and suggestions

Fix platform conflicts. (-20 points)

Low code quality prevents platform classification.

Use constrained dependencies. (-20 points)

The pubspec.yaml contains 1 dependency without version constraints. Specify version ranges for the following dependencies: intl.

Use analysis_options.yaml. (-10 points)

Rename old .analysis_options file to analysis_options.yaml.

Read more about the setup of analysis-options.yaml.

Documentation URL does not exists. (-10 points)

We were unable to access at the time of the analysis.

Add SDK constraint in pubspec.yaml. (-5 points)

For information about setting SDK constraint, please see

The description is too short. (-20 points)

Add more detail about the package, what it does and what is its target use case. Try to write at least 60 characters.

Maintain an example.

None of the files in your example/ directory matches a known example patterns. Common file name patterns include: main.dart, example.dart or you could also use modern_charts.dart.


Package Constraint Resolved Available
Direct dependencies
intl any 0.15.7
Transitive dependencies
path 1.6.2
Dev dependencies
browser any