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

fix(metric): fix rendering artifact #2218

Closed
wants to merge 2 commits into from

Conversation

nickofthyme
Copy link
Collaborator

@nickofthyme nickofthyme commented Oct 25, 2023

Summary

Fixes minor rendering artifact in Chrome introduced in #2184

image

Details

With the changes from #2184 we introduced support for transparent colors. This change would have overlapping colors on the trend line metric causing blended colors. To prevent this we split the top and bottom half of the sparkline in two so the shapes rendered independently directly on the metric background.

Doing this caused a slight white sliver to be rendered between the two halves for colors with hight constant to the background, even with strokeWidth set to 0.

To fix this we render a thin line along the spark line to fill this render defect without making the line too thick where a transparent color overlap would create a noticeable line.

Screen Recording 2023-10-25 at 12 47 53 PM

Checklist

  • The proper chart type label has been added (e.g. :xy, :partition)
  • The code has been checked for cross-browser compatibility (Chrome, Firefox, Safari, Edge)
  • Visual changes have been tested with light and dark themes

@nickofthyme nickofthyme added the :metric Related to Metric chart label Oct 25, 2023
@nickofthyme
Copy link
Collaborator Author

buildkite update screenshots

@nickofthyme
Copy link
Collaborator Author

Closing this in favor of #2255

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
:metric Related to Metric chart
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant