GithubHelp home page GithubHelp logo

fay-hu / flutter_radar_chart Goto Github PK

View Code? Open in Web Editor NEW

This project forked from danpanaite/flutter_radar_chart

0.0 1.0 0.0 1.02 MB

Basic radar chart for Flutter

License: MIT License

Java 2.28% Objective-C 4.96% Dart 78.26% Shell 2.91% Kotlin 2.58% Swift 2.53% HTML 6.47%

flutter_radar_chart's Introduction

flutter_radar_chart

Animated radar chart for Flutter inspired by The Python Graph Gallery (https://python-graph-gallery.com/radar-chart/).

Follow the instructions on pub to install this package.

Example

screenshot

Usage

Basic usage of radar chart requires three pieces of data:

  • ticks - Defines the numerical axis for the chart. Each tick generates an outline. Currently, each feature is plotted using the numerical range define by the ticks.
  • features - Defines the numerical variables for each individual in the chart. There is no limit to the number of features.
  • data - List of data points used to construct each individual in the chart. The number of data points must match the number of features. There is no limit to the number of individuals in the chart; however, multiple entities might cause the graph to become unreadable.
RadarChart.light(
    ticks: ticks,
    features: features,
    data: data,
),

A full example (as seen in the screenshots) can be found in example/lib/main.dart

Customizability

Most of the customizability of the graph is a work in progress, but here's some of the features of the chart:

  • Animations! Trying to add some life to the chart. Animation is currently triggered whenever the widget is updated (didUpdateWidget). Animations are currently enabled by default.
  • Number of features: As shown in the example, the radar chart will adjust to the number of given variables. More work is needed to ensure the chart doesn't explode when given invalid data.
  • Reverse axis: Reverses the axis range so that the min value starts at the graph outline.
  • Dark mode: Simple factory that showcases the color customizability of the chart.

screenshot

Future Work Ideas

There's a few more areas of work that I'd love to get around to building. I will eventually move these items over to issues for better tracking.

  • Option for round corners
  • Animations on render
  • Integration testing
  • Responsive design
  • Legends

Acknowledgements

flutter_radar_chart's People

Contributors

danpanaite avatar jasonspick avatar

Watchers

James Cloos avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.