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

Create line and bar chart components for the demo #645

Merged
merged 4 commits into from
Jul 25, 2024

Conversation

MGaetan89
Copy link
Member

@MGaetan89 MGaetan89 commented Jul 19, 2024

Pull request

Description

This PR introduces two new composables in pillarbox-demo-shared: LineChart and BarChart. As their names suggest, they are meant to display simple line- and bar-charts.

Usage

The most basic usage for each component looks like this:

LineChart(
    data = listOf(12f, 4.5, 8.2f, 24.3f, 1.9f),
	modifier = Modifier.size(400.dp), // Modifier is not mandatory, but `Canvas` requires a size to be set
)

BarChart(
    data = listOf(12f, 4.5, 8.2f, 24.3f, 1.9f),
	modifier = Modifier.size(400.dp), // Modifier is not mandatory, but `Canvas` requires a size to be set
)

Each component provides a set of options to customize how it is displayed (color, stroke width, spacing, ...).

Screenshot

Screenshot 2024-07-19 at 15 48 16

Changes made

  • Introduce a LineChart component.
  • Introduce a BarChart component.
  • Add previews for each component.
  • Add interactive previews for each component.

Checklist

  • Your branch has been rebased onto the main branch.
  • APIs have been properly documented (if relevant).
  • The documentation has been updated (if relevant).
  • New unit tests have been written (if relevant).
  • The demo has been updated (if relevant).
  • All pull request status checks pass.

@MGaetan89 MGaetan89 added this to the QoS milestone Jul 19, 2024
@MGaetan89 MGaetan89 linked an issue Jul 19, 2024 that may be closed by this pull request
Copy link

github-actions bot commented Jul 19, 2024

Code Coverage

Overall Project 53.5% 🟢

There is no coverage information present for the Files changed

@StaehliJ
Copy link
Contributor

The charts doesn't work in a container that has a fixed size ? For example

Column(modifier = Modifier.fillMaxWidth(0.5f)){
    LineChart(...)
}

@MGaetan89
Copy link
Member Author

The charts doesn't work in a container that has a fixed size ? For example

Column(modifier = Modifier.fillMaxWidth(0.5f)){
    LineChart(...)
}

LineChart and BarChart use Canvas internally, which doesn't have a size by default. So the Modifier of each chart should be used to set one (using something like .size(), .height()/.width(), .filleMaxWidth(), ...).

@MGaetan89 MGaetan89 force-pushed the 643-create-a-chart-components-for-metrics-ui branch from 71877c4 to 0896a6e Compare July 23, 2024 13:04
@MGaetan89 MGaetan89 merged commit 68bf7d1 into qos Jul 25, 2024
10 checks passed
@MGaetan89 MGaetan89 deleted the 643-create-a-chart-components-for-metrics-ui branch July 25, 2024 15:44
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
Status: ✅ Done
Development

Successfully merging this pull request may close these issues.

Create a chart components for metrics UI
2 participants