Skip to content

feat: Add stroke support for LineChartBarData#2076

Open
patilrahu wants to merge 1 commit intoimaNNeo:mainfrom
patilrahu:feature/line-border
Open

feat: Add stroke support for LineChartBarData#2076
patilrahu wants to merge 1 commit intoimaNNeo:mainfrom
patilrahu:feature/line-border

Conversation

@patilrahu
Copy link
Copy Markdown

Description

This PR adds optional stroke
Simulator Screenshot - iPhone 16e - 2026-03-22 at 15 22 34
support for LineChartBarData.

Changes

  • Added strokeColor and strokeWidth properties
  • Implemented border rendering behind the main line in the painter
  • Maintains backward compatibility (default = no border)
  • Updated example to demonstrate usage

This feature improves line visibility, especially when multiple lines overlap or when used on complex backgrounds.

Closes Outline the graph line #517

- Add optional stroke color & width support for LineChartBarData
@codecov
Copy link
Copy Markdown

codecov Bot commented Apr 10, 2026

Codecov Report

❌ Patch coverage is 10.00000% with 9 lines in your changes missing coverage. Please review.
✅ Project coverage is 92.79%. Comparing base (9f74754) to head (5a40aaf).

Files with missing lines Patch % Lines
lib/src/chart/line_chart/line_chart_painter.dart 10.00% 9 Missing ⚠️
Additional details and impacted files
@@            Coverage Diff             @@
##             main    #2076      +/-   ##
==========================================
- Coverage   93.00%   92.79%   -0.22%     
==========================================
  Files          50       50              
  Lines        3917     3927      +10     
==========================================
+ Hits         3643     3644       +1     
- Misses        274      283       +9     
Flag Coverage Δ
flutter 92.79% <10.00%> (-0.22%) ⬇️

Flags with carried forward coverage won't be shown. Click here to find out more.

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.


/// Optional border color for the line.
/// Useful for improving visibility when lines overlap.
final Color? strokeColor;
Copy link
Copy Markdown
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can we use the BorderSide class instead of defining strokeColor and strokeWidth here?
Because all other chart types in fl_chart use BorderSide for borders (e.g., BarChartRodData.borderSide, PieChartSectionData.borderSide).

Let's keep the API consistent:

final BorderSide borderSide; // default: BorderSide.none

..strokeJoin =
barData.isStrokeJoinRound ? StrokeJoin.round : StrokeJoin.miter;

canvasWrapper.canvas.drawPath(barPath, borderPaint);
Copy link
Copy Markdown
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This line bypasses the canvas wrapper. All drawing must go through canvasWrapper.drawPath(...)

So please use .drawPath() directly on the canvasWrapper

);
drawBarShadow(canvasWrapper, barPath, barData);
if (barData.strokeColor != null && barData.strokeWidth > 0) {
final borderPaint = Paint()
Copy link
Copy Markdown
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

There's a performance issue with creating the Paint() object in every frame.
Please create the Paint instance once (in the constructor, just like other Paint() objects) and reuse it here.

@imaNNeo
Copy link
Copy Markdown
Owner

imaNNeo commented Apr 10, 2026

And there are two things to mention:

  1. We have a dash pattern feature in our line chart, so I guess the stroke should work for that case as well. (stroke around each dash section)
  2. Please add some test cases and update your branch.

Thanks!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants