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

Add shadow to line chart's tooltip #1768

Open
wants to merge 4 commits into
base: main
Choose a base branch
from

Conversation

Sosssen
Copy link

@Sosssen Sosssen commented Nov 5, 2024

hi:)

this PR resolves #1767

i've added 3 params to LineTouchTooltipData for tooltip shadow:

  • shadowColor - color of the shadow
  • shadowBlur - sigma value of mask filter blur (how much will shadow be blurred)
  • shadowOffset - offset of the shadow (related to tooltip)

please check the image below to see example of changes:)

image

and the code code of LineTouchTooltipData from example image:

LineTouchData get lineTouchData => LineTouchData(
        touchTooltipData: LineTouchTooltipData(
          getTooltipColor: (touchedSpot) => Colors.black,
          shadowColor: Colors.white.withOpacity(0.25),
          shadowBlur: 4,
          shadowOffset: const Offset(0, 4),
        ),
      );

@seniorb
Copy link

seniorb commented Nov 18, 2024

Would be great if this could be added to the barchart tooltip as well!

@imaNNeo
Copy link
Owner

imaNNeo commented Nov 20, 2024

Hi, thanks for your details description.
We already have a shadow feature in our line chart, that works like a simple shadow property (that uses the Shadow class from flutter).

Can you please use the same naming and method of drawing shadow, this way we keep the consistency in the project.

Look at the below code:

/// Drops a shadow behind the bar line.
final Shadow shadow;

if (!barData.show || barData.shadow.color.opacity == 0.0) {
return;
}
if (barPath.computeMetrics().isEmpty) {
return;
}
_barPaint
..strokeCap = barData.isStrokeCapRound ? StrokeCap.round : StrokeCap.butt
..strokeJoin =
barData.isStrokeJoinRound ? StrokeJoin.round : StrokeJoin.miter
..color = barData.shadow.color
..shader = null
..strokeWidth = barData.barWidth
..color = barData.shadow.color
..maskFilter = MaskFilter.blur(
BlurStyle.normal,
Utils().convertRadiusToSigma(barData.shadow.blurRadius),
);
barPath = barPath.toDashedPath(barData.dashArray);
barPath = barPath.shift(barData.shadow.offset);
canvasWrapper.drawPath(
barPath,
_barPaint,
);

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.

Add shadow to line chart's tooltip
3 participants