Koala Plot is a Compose Multiplatform based charting and plotting library allowing you to build great looking interactive charts for Android, desktop, ios, and web using a single API and code base.

Try out the web version of the samples for a quick look at the possibilities when using Koala Plot. Note that this uses the alpha Kotlin wasm Compose web-canvas capability, and you'll need a browser supporting the wasm garbage collection feature. For more information see https://kotl.in/wasm_help.

This project is in a pre-release experimental/alpha state. We encourage you to give it a try, make suggestions for improvement, and even contribute! It is expected that the API surface and functionality will change as we gain experience using the library in applications.

Most elements of a plot are Composables and can therefore be easily customized. This includes things like colors, fonts, borders, shapes, user interaction, etc. Web support is provided by the Compose-web Canvas support currently in alpha.

• Pie and donut chart
  • Composable slices, with default implementation that can react to hovering
  • Optional Composable labels and Composable connectors with provided linear and bezier implementations
  • Composable content for donut chart centers
  • Customizable first-draw animation
• Line graphs
  • Linear or Log y-axis
  • Numeric or category x-axis
  • Composable axis titles and value labels
  • Optional Composable symbols for data points
  • Optional Composable symbols at each data point with default implementations
  • Zoom and pan one or both axes (except for mobile platforms within js and wasmJs)
  • Optional shaded areas (area chart)
• Stacked area graphs
  • Plots multiple lines with shaded areas between them and accumulated values
  • Similar feature set as the Line chart
• Vertical bar graph
  • Linear or Log y-axis
  • Numeric or category x-axis
  • Composable vertical bars with a provided default implementation
  • Support for clustered and stacked bars
  • Support for negative values and bars that don't start at 0
  • Customizable first-draw animation
  • Zoom and pan one or both axes (except for mobile platforms within js and wasmJs)
• Bullet Graph
  • Individual or multiple vertically aligned bullet graphs
• Radar/Polar/Spider plots
  • Lines, areas, symbols, or a combination
  • Configurable origin position and angle orientation (clockwise/counter-clockwise)
• Chart layout
  • Combines an optional Composable title, plot, and legend with any of 4 positions
• Legends
  • Single column
  • Flow-layout

1. Add the mavenCentral and compose repositories to your project's build.gradle.kts

repositories {
    mavenCentral()
    maven("https://maven.pkg.jetbrains.space/public/p/compose/dev")
}

2. Include Koala Plot core as a dependency in your project's build.gradle.kts

dependencies {
    implementation("io.github.koalaplot:koalaplot-core:0.7.0")
}

You can also see a complete example of a build.gradle.kts in the samples.

3. Start coding

BulletGraphs {
    bullet(FloatLinearAxisModel(0f..300f)) {
        label {
            Column(
                horizontalAlignment = Alignment.End,
                modifier = Modifier.padding(end = KoalaPlotTheme.sizes.gap)
            ) {
                Text("Revenue 2005 YTD", textAlign = TextAlign.End)
                Text("(US $ in thousands)", textAlign = TextAlign.End, style = MaterialTheme.typography.labelSmall)
            }
        }
        axis { labels { Text("${it.toInt()}") } }
        comparativeMeasure(260f)
        featuredMeasureBar(275f)
        ranges(0f, 200f, 250f, 300f)
    }
}

• Latest build
• Release 0.7.0

Also see the sample repository for code examples.

Contributions are welcome. Further details can be found in the Contributing Guidelines