Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

RadarChart tick and graph point scale do not match #1078

Closed
ateich opened this issue Jul 1, 2022 · 1 comment · Fixed by #1293
Closed

RadarChart tick and graph point scale do not match #1078

ateich opened this issue Jul 1, 2022 · 1 comment · Fixed by #1293
Labels
enhancement New feature or request Radar Chart

Comments

@ateich
Copy link
Contributor

ateich commented Jul 1, 2022

Describe the bug
RadarChart tick and graph point scale do not match

If a point has a value of 15 and a tick line has a value of 15, I would expect the point to fall on the line. This is not always the case

The values in tick titles do not always match with the values of the points on the graph because

  • points are drawn assuming the graph center = 0
  • tick title values assume that the graph center = (minValue - ((maxValue - minValue) / tickCount))

To Reproduce

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

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return const MaterialApp(
      home: Scaffold(
        body: Center(
          child: UsageRadarChart(),
        ),
      ),
    );
  }
}

class UsageRadarChart extends StatelessWidget {
  const UsageRadarChart({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return SizedBox(
      width: 300,
      height: 300,
      child:
        RadarChart(
          RadarChartData(
            tickCount: 2,
            dataSets: [
              RadarDataSet(
                dataEntries: [
                  const RadarEntry(value: 15),
                  const RadarEntry(value: 20),
                  const RadarEntry(value: 20),
                ]
              )
            ],
          ),
        ),
    );
  }
}

Screenshots

Expected Actual
Points: [15, 20, 20] Points: [15, 20, 20]
Screen Shot 2022-07-01 at 7 22 54 PM Screen Shot 2022-07-01 at 7 22 30 PM

Versions

  • which version of the Flutter are you using?
Flutter 3.0.0 • channel stable • https://github.com/flutter/flutter.git
Framework • revision ee4e09cce0 (8 weeks ago) • 2022-05-09 16:45:18 -0700
Engine • revision d1b9a6938a
Tools • Dart 2.17.0 • DevTools 2.12.2
  • which version of the FlChart are you using?
    • 0.55.0 but I've been able to reproduce it as far back as 0.45.0 (I didn't try any further back)
ateich added a commit to ateich/fl_chart that referenced this issue Jul 6, 2022
Fixes an issue where RadarChart tick and graph point scale do not match.

If a point has a value of 15 and a tick line has a value of 15, I would expect the point to fall on the line. This was not always the case.

The values in tick titles did not always match with the values of the points on the graph because
- points were drawn assuming the graph center = 0
- tick title values assumed that the graph center = (minValue - ((maxValue - minValue) / tickCount))

This commit resolves this issue by changing the scaling factor applied to points when they are drawn so that they match the scale of the tick lines.

New unit tests have been added and existing tests that used the incorrect scaling have been updated.

Resolves imaNNeo#1078
ateich added a commit to ateich/fl_chart that referenced this issue Jul 6, 2022
Fixes an issue where RadarChart tick and graph point scale do not match.

If a point has a value of 15 and a tick line has a value of 15, I would expect the point to fall on the line. This was not always the case.

The values in tick titles did not always match with the values of the points on the graph because
- points were drawn assuming the graph center = 0
- tick title values assumed that the graph center = (minValue - ((maxValue - minValue) / tickCount))

This commit resolves this issue by changing the scaling factor applied to points when they are drawn so that they match the scale of the tick lines.

New unit tests have been added and existing tests that used the incorrect scaling have been updated.

Resolves imaNNeo#1078
@imaNNeo imaNNeo added enhancement New feature or request Radar Chart labels Jan 30, 2023
@imaNNeo
Copy link
Owner

imaNNeo commented Apr 15, 2023

Fixed in 0.62.0.
Please check it out!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request Radar Chart
Projects
None yet
2 participants