multi_charts 0.2.0

  • Readme
  • Changelog
  • Example
  • Installing
  • 87

Build Status pub package

multi_charts #

It is a library that provides different types of charts to plot data points. Currently it supports only Radar Chart, but will support more types in the coming future.

Radar Chart #

A chart which plots the values in the form of a spider web or radar. It takes the @required values parameter which provides the data points (minimum 3 values are required) and @required maxValue which defines the scale of the graph. E.g. The chart contains five levels, if maxValue=10, then each level will have the value 2.

The other parameters are optional which define different behaviours for the chart like:

  • labels - which will be shown in the graph, if not provided, will default to the value of data points. If provided, it's length should be same as that of values

  • size - which defines the canvas area defaults to Size.infinite and is constrained by the parent widget.

  • fillColor - defines the background color of the plotted graph, if not provided, defaults to Colors.black26.

  • strokeColor - defines the color of the chart outlines, defaults to Colors.black87.

  • labelColor - defines the color of the chart labels, defaults to Colors.black.

  • maxHeight and maxWidth - defines the maximum width and height of the chart when no parent constraints are applied, otherwise ignored.

  • textScaleFactor - defines the factor by which the label's textSize should increase, if not provided defaults to 0.04

  • labelWidth - defines the maximum width of the labels, if not provided, defaults to internally calculated values based on the size of the chart.

  • maxLinesForLabels - defines the maximum lines for the label's text, if not provided, defaults to the hundredth part of the container height of the parent container. E.g.if height of the parent is 200, the maxLinesForLabels = 2

  • animate - defines the animation toggle, if true, the chart will animate, else not. Defaults to true.

  • animationDuration - defines the duration (in milliseconds) of the animation for the graph. If not provided, defaults to 1500 milliseconds.

  • curve - defines the animation's progress in a non-linear fashion.

  • chartRadiusFactor - defines the factor by which the chart radius increases with respect to width or height (whatever is minimum). If not provided, defaults to 0.8 (80%).

Screenshots #

Radar Chart Red Radar Chart Blue

Pie Chart #

A chart type which plots the values in the form of a pie with different slices representing different values. It takes the @required values parameter which provides the data data to plot the graph.

The other parameters are optional which define different behaviors for the chart like:

  • labels - which will be shown in the graph, if not provided, will default to the value of data points. If provided, it's length should be same as that of values

  • size which defines the canvas area defaults to Size.infinite and is constrained by the parent widget.

  • sliceFillColors defines the background color of each slice of the graph, if not provided, random colors will be generated.

  • maxHeight and maxWidth defines the maximum width and height of the chart when no parent constraints are applied, otherwise ignored.

  • labelColor defines the color of the chart values, defaults to Colors.black87.

  • legendTextColor defines the color of the chart legend text, defaults to Colors.black.

  • legendPosition defines the position of the chart legend in the layout. It can either be

LegendPosition.Left, LegendPosition.Top, LegendPosition.Right or LegendPosition.Bottom. The default position is LegendPosition.Right.

  • legendIconSize defines the size of the legend icons. The default size value is 10.0.

  • legendTextSize defines the the text size of the legend labels. The default text size is 16.0.

  • legendItemPadding defines the padding around and in between the legend row items. The default padding is 8.0.

  • legendIconShape defines the shape of the legend icons. It can either be LegendIconShape.Circle or LegendIconShape.Square. The default shape is LegendIconShape.Square.

  • textScaleFactor defines the factor by which the label's textSize increases with respect to the average of width and height of the enclosing parent widget, if not provided defaults to 0.04.

  • animate defines the animation toggle, if true, the chart will animate, else not. Defaults to true.

  • animationDuration defines the duration (in milliseconds) of the animation for the graph. If not provided, defaults to 1500 milliseconds.

  • curve defines the animation's progress in a non-linear fashion.

  • separateFocusedValue defines whether we want to highlight focused value (of type: SeparatedValue.Max or SeparatedValue.Min) as a slice separated from the chart. By default, it is set to false.

  • separatedValueType defines which value slice to show as separated. It can be either SeparatedValue.Max or SeparatedValue.Min. The default value is SeparatedValue.Max.

  • startAngle defines the start angle (in degrees) of the chart's radial position. The default value is 180.

  • showLegend defines whether to show the chart legend or not. By default, it is set to true.

Screenshots #

Radar Chart Red Radar Chart Blue

[0.0.1] - 01/09/2019. #

  • Initial release - Supports Radar Chart with lots of customizations.

[0.0.2] - 01/09/2019 #

  • Fixed screenshots

[0.1.0] - 21/09/2019 #

  • Added labelColor parameter to give the desired color to labels, default value is Colors.black.
  • Added a check for values (Minimum 3 values are required for plotting Radar Chart), else it will throw ArgumentError.
  • Added a check for length of values and labels, both should be same.

[0.1.1] - 13/11/2019 #

  • Added chartRadiusFactor parameter to set the scaling of the chart with respect to width or height (whatever is minimum) of the parent widget, default value is 0.8 (80%).
  • Fixed exception handling for null labels.

[0.2.0] - 24/12/2019 #

  • Added support for Pie Chart with lots of customizations.
  • Changes in Readme file

example/lib/main.dart

import 'package:flutter/material.dart';
import 'package:multi_charts/multi_charts.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Radar Chart Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: Scaffold(
        appBar: AppBar(
          title: Text("Radar Chart Example"),
        ),
        body: Column(children: [
          Container(
            width: 450,
            height: 450,
            //Radar Chart
            child: RadarChart(
              values: [1, 2, 4, 7, 9, 0, 6],
              labels: [
                "Label1",
                "Label2",
                "Label3",
                "Label4",
                "Label5",
                "Label6",
                "Label7",
              ],
              maxValue: 10,
              fillColor: Colors.blue,
              chartRadiusFactor: 0.7,
            ),
          ),
          //Pie Chart
          PieChart(
            values: [15, 10, 30, 25, 20],
            labels: ["Label1", "Label2", "Label3", "Label4", "Label5"],
            sliceFillColors: [
              Colors.blueAccent,
              Colors.greenAccent,
              Colors.pink,
              Colors.orange,
              Colors.red,
            ],
            animationDuration: Duration(milliseconds: 1500),
            legendPosition: LegendPosition.Right,
          ),
        ]),
      ),
    );
  }
}

Use this package as a library

1. Depend on it

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


dependencies:
  multi_charts: ^0.2.0

2. Install it

You can install packages from the command line:

with Flutter:


$ flutter pub get

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

3. Import it

Now in your Dart code, you can use:


import 'package:multi_charts/multi_charts.dart';
  
Popularity:
Describes how popular the package is relative to other packages. [more]
73
Health:
Code health derived from static analysis. [more]
100
Maintenance:
Reflects how tidy and up-to-date the package is. [more]
100
Overall:
Weighted score of the above. [more]
87
Learn more about scoring.

We analyzed this package on Jul 2, 2020, and provided a score, details, and suggestions below. Analysis was completed with status completed using:

  • Dart: 2.8.4
  • pana: 0.13.13
  • Flutter: 1.17.5

Analysis suggestions

Package not compatible with SDK dart

because of import path [multi_charts] that is in a package requiring null.

Health suggestions

Format lib/src/pie_chart/utils/legend_icon_shape.dart.

Run flutter format to format lib/src/pie_chart/utils/legend_icon_shape.dart.

Dependencies

Package Constraint Resolved Available
Direct dependencies
Dart SDK >=2.1.0 <3.0.0
flutter 0.0.0
Transitive dependencies
collection 1.14.12 1.14.13
meta 1.1.8
sky_engine 0.0.99
typed_data 1.1.6 1.2.0
vector_math 2.0.8
Dev dependencies
flutter_test