{"id":13550788,"url":"https://github.com/rows/tiny_charts","last_synced_at":"2025-10-23T05:15:18.781Z","repository":{"id":52241079,"uuid":"478746708","full_name":"rows/tiny_charts","owner":"rows","description":"Sparkline charts for fast data visualization on Flutter apps","archived":false,"fork":false,"pushed_at":"2022-04-08T11:53:03.000Z","size":33,"stargazers_count":21,"open_issues_count":0,"forks_count":4,"subscribers_count":0,"default_branch":"main","last_synced_at":"2024-11-03T20:36:07.240Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"Dart","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"bsd-3-clause","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/rows.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2022-04-06T22:28:28.000Z","updated_at":"2024-07-03T15:40:33.000Z","dependencies_parsed_at":"2022-08-21T08:50:09.541Z","dependency_job_id":null,"html_url":"https://github.com/rows/tiny_charts","commit_stats":null,"previous_names":[],"tags_count":1,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rows%2Ftiny_charts","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rows%2Ftiny_charts/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rows%2Ftiny_charts/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rows%2Ftiny_charts/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/rows","download_url":"https://codeload.github.com/rows/tiny_charts/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":246916735,"owners_count":20854511,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-08-01T12:01:37.583Z","updated_at":"2025-10-23T05:15:13.461Z","avatar_url":"https://github.com/rows.png","language":"Dart","readme":"\u003cp align=\"center\"\u003e\n  \u003ca href=\"https://rows.com\"\u003e\n  \u003cbr /\u003e\n  \u003cimg src=\"https://rows.com/media/logo.svg\" alt=\"Rows\" width=\"150\"/\u003e\n  \u003cbr /\u003e\n\n  \u003c/a\u003e\n\u003c/p\u003e\n\n\u003cp align=\"center\"\u003e\n\u003csub\u003e\u003cstrong\u003eSpreadsheet with superpowers ✨!\u003c/strong\u003e\u003c/sub\u003e\n\u003cbr /\u003e\n\u003cbr /\u003e\n\u003c/p\u003e\n\n\u003cp align=\"center\"\u003e\n  \u003ca title=\"Pub\" href=\"https://pub.dev/packages/tiny_charts\" \u003e\u003cimg src=\"https://img.shields.io/pub/v/tiny_charts.svg?style=popout\" /\u003e\u003c/a\u003e\n  \u003ca title=\"Rows lint\" href=\"https://pub.dev/packages/rows_lint\" \u003e\u003cimg src=\"https://img.shields.io/badge/Styled%20by-Rows-754F6C?style=popout\" /\u003e\u003c/a\u003e\n\u003c/p\u003e\n\n\n---\n\n\n# Tiny charts 🤏\nSparkline charts for fast data visualization on Flutter apps\n\n\n## Installation\n\n```\nflutter pub add tiny_charts\n```\n\n## Usage\n\n## 📈 Line charts\n\n### From offsets\n\n![1](https://user-images.githubusercontent.com/6718144/148391931-3fdc57b8-eb66-4b0e-8cf3-d7fa39c20596.png)\n\n```dart\nvoid build(BuildContext context) {\n  return TinyLineChart(\n    width: 100,\n    height: 28,\n    dataPoints: const [\n      Offset(0, 2),\n      Offset(1, 11),\n      Offset(2, 17),\n      Offset(2.5, 0),\n      Offset(3, 10),\n      Offset(4, 24),\n    ],\n  );\n}\n```\n\n### From vectors\n\nUsing vector_math's Vector2 class.\n\n![2](https://user-images.githubusercontent.com/6718144/148391933-237c1b27-4594-400c-befc-68692610cba6.png)\n\n```dart\nimport 'package:vector_math/vector_math.dart';\n\nvoid build(BuildContext context) {\n  return TinyLineChart.fromDataVectors(\n    width: 100,\n    height: 28,\n    dataPoints: [\n      Vector2(0, 14),\n      Vector2(1, 13.2),\n      Vector2(2, 2),\n      Vector2(3, 13),\n      Vector2(4, 10),\n      Vector2(5, 4),\n    ],\n  );\n}\n```\n\n### With options\n\nPassing custom options\n\n![3](https://user-images.githubusercontent.com/6718144/148391934-e6af0c29-6bf7-418d-ac2d-0fa22913bd37.png)\n\n```dart\nvoid build(BuildContext context) {\n  return TinyLineChart(\n    width: 100,\n    height: 28,\n    dataPoints: const [\n      Offset(0, 2),\n      Offset(1, 11),\n      Offset(2, 17),\n      Offset(2.5, 0),\n      Offset(3, 10),\n      Offset(4, 24),\n    ],\n    options: const TinyLineChartOptions(\n      color: Color(0xFFC93B8C),\n      lineWidth: 3,\n      yMinLimit: -2,\n      yMaxLimit: 27,\n    ),\n  );\n}\n```\n\n## Bar charts\n\n### Single\n\n![1](https://user-images.githubusercontent.com/6718144/148391966-c5b92660-a833-4e8f-8adc-d37c5e23b6db.png)\n\n```dart\nvoid build(BuildContext context) {\n  return TinyBarChart.single(\n    value: 68.12,\n    max: 100,\n    color: const Color(0xFF236536),\n    width: 120,\n    height: 28,\n  );\n}\n```\n\n### Stacked\n\n![2](https://user-images.githubusercontent.com/6718144/148391970-342d4260-2ea9-4a15-a4f1-09fad61775da.png)\n\n```dart\nvoid build(BuildContext context) {\n  return TinyBarChart.stacked(\n    data: const \u003cdouble\u003e[24, 12, 4],\n    width: 120,\n    height: 28,\n  );\n}\n```\n\n### From data vectors\n\n![3](https://user-images.githubusercontent.com/6718144/148391975-6a410b0c-6c7b-48f7-b69c-17e176a0d9d2.png)\n\n```dart\nvoid build(BuildContext context) {\n  return TinyBarChart.stackedFromDataVectors(\n    dataPoints: \u003cVector2\u003e[\n      Vector2(1, 20),\n      Vector2(2, 12),\n      Vector2(0, 12),\n      Vector2(4, 24),\n    ],\n  );\n}\n```\n\n### With options\n\n![4](https://user-images.githubusercontent.com/6718144/148391976-797c8687-9f70-4ac0-9669-eea00cf6a76e.png)\n\n```dart\nvoid build(BuildContext context) {\n  return TinyBarChart.stacked(\n    data: const \u003cdouble\u003e[24, 12, 4],\n    options: const TinyBarChartOptions(\n      colors: [\n        Color(0xFFFF0000),\n        Color(0xBEEE0260),\n        Color(0x97FF74AD),\n      ],\n    ),\n    width: 120,\n    height: 28,\n  );\n}\n```\n\n## 📊 Column charts\n\n### From values\n\n![1](https://user-images.githubusercontent.com/6718144/148391994-d849b453-90ba-433d-98f9-ebd2cf480271.png)\n\n```dart\nvoid build(BuildContext context) {\n  return TinyColumnChart(\n    data: const [20, 22, 14, 12, 19, 28, 1, 11],\n    width: 120,\n    height: 28,\n  );\n}\n```\n\n### From vectors\n\n![2](https://user-images.githubusercontent.com/6718144/148391999-7e8fa2be-6479-4512-9a79-09da88a50156.png)\n\n```dart\nvoid build(BuildContext context) {\n  return TinyColumnChart.fromDataVectors(\n    dataPoints: [\n      Vector2(0, 18),\n      Vector2(6, 22),\n      Vector2(2, 12),\n      Vector2(3, 14),\n      Vector2(5, 34),\n      Vector2(4, 5),\n      Vector2(1, 24),\n    ],\n    width: 120,\n    height: 28,\n  );\n}\n```\n\n### With negative values\n\n![3](https://user-images.githubusercontent.com/6718144/148392000-0d1249c0-f969-41f4-8389-049eb38bc171.png)\n\n```dart\nvoid build(BuildContext context) {\n  return TinyColumnChart(\n    data: const [20, -22, 14, -12, -19, 28, 1, 11],\n    width: 120,\n    height: 28,\n  );\n}\n```\n\n## With options\n\n* With axis\n\n![4](https://user-images.githubusercontent.com/6718144/148392002-172a1327-d476-4d6d-a16a-03f4ac96bd62.png)\n\n```dart\nvoid build(BuildContext context) {\n  return TinyColumnChart(\n    data: const [20, -22, 14, -12, -19, 28, 5, 11],\n    width: 120,\n    height: 28,\n    options: const TinyColumnChartOptions(\n      positiveColor: Color(0xFF27A083),\n      negativeColor: Color(0xFFE92F3C),\n      showAxis: true,\n    ),\n  );\n}\n```\n\n* Custom colors\n\n![5](https://user-images.githubusercontent.com/6718144/148392004-d5d35bf1-4c86-4602-8309-b62c1062906f.png)\n\n```dart\nvoid build(BuildContext context) {\n  return TinyColumnChart(\n    data: const [18, 22, 28, -12, 32, 12, 9, 14, -34, -25, 24],\n    width: 120,\n    height: 28,\n    options: const TinyColumnChartOptions(\n      positiveColor: Color(0xFF0023C6),\n      negativeColor: Color(0xFFBA2500),\n      showAxis: true,\n      axisColor: Color(0xFF00FF00),\n      lowestColor: Color(0xFFFF4A1A),\n      highestColor: Color(0xFF3083FF),\n      firstColor: Color(0xFFFFE500),\n      lastColor: Color(0xFF8000FF),\n    ),\n  );\n}\n```\n","funding_links":[],"categories":["Dart"],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frows%2Ftiny_charts","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Frows%2Ftiny_charts","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frows%2Ftiny_charts/lists"}