kmp-charts is a Kotlin/Compose Multiplatform library that offers many different types of charts to display data.
Add the dependency in your common module's commonMain sourceSet
:
implementation('io.github.tweener:kmp-charts:$kmp_charts_version')
Note
For now, there is only one chart available: DonutChart
. More charts will be added later on.
A DonutChart
requires a list of Segments, with the first segment starting from the given startAngleFromOrigin
in degrees.
Each segment is defined by an angle, its color and an optional progress option.
See .degrees
to easily use float angles in degrees.
val green = Color(0xFF04C700)
val orange = Color(0xFFFF8850)
val red = Color(0xFFFF3434)
val darkRed = Color(0xFFA40000)
val yellow = Color(0xFFFFF534)
val darkYellow = Color(0xFF746F0E)
val blue = Color(0xFF3437FF)
DonutChart(
segments = listOf(
Segment(angle = 40f.degrees, progress = 0.33f, baseColor = green),
Segment(angle = 20f.degrees, progress = 0.7f, baseColor = yellow, backgroundColor = darkYellow),
Segment(angle = 90f.degrees, progress = 0.66f, baseColor = green),
Segment(angle = 60f.degrees, progress = 0.7f, baseColor = red, backgroundColor = darkRed),
Segment(angle = 50f.degrees, progress = 0.8f, baseColor = orange),
Segment(angle = 100f.degrees, progress = 1f, baseColor = blue),
),
startAngleFromOrigin = 270f.degrees,
sizes = DonutChartDefault.chartSizes(strokeWidth = 12.dp, selectedStrokeWidth = 22.dp),
animationDurationMillis = 800,
)
This code gives the following output:
I'd love your input and welcome any contributions! Please feel free to submit a pull request.
kmp-charts is licensed under the Apache-2.0.