Feat: Stacked Bar Chart (#42)

* Implemented StackedBarChart
hi-manshu · Sep 21, 2022 · a3a9886 · a3a9886
1 parent 16274e2
commit a3a9886
Show file tree

Hide file tree

Showing 14 changed files with 324 additions and 46 deletions.
diff --git a/Readme.md b/Readme.md
@@ -27,6 +27,7 @@ You can find the detail implementation of the following:
 
 - [BarChart](docs/BarChart.md)
 - [CandleStickChart](docs/CandleStickChart.md)
+- [StackedBarChart](docs/StackedBarChart.md)
 - [CombinedBarChart](docs/CombinedBarChart.md)
 - [HorizontalBarChart](docs/HorizontalBarChart.md)
 - [GroupedBarChart](docs/GroupedBarChart.md)

diff --git a/app/src/main/java/com/himanshoe/charty/MainActivity.kt b/app/src/main/java/com/himanshoe/charty/MainActivity.kt
@@ -44,6 +44,8 @@ class MainActivity : ComponentActivity() {
                 navigator.navigate("combinedBar")
             }, onCandleChartClicked = {
                 navigator.navigate("candleChart")
+            }, onStackedBarClicked = {
+                navigator.navigate("stackedBar")
             }
             )
         }
@@ -63,11 +65,13 @@ fun MainApp(
     onGroupHorizontalClicked: () -> Unit,
     onCandleChartClicked: () -> Unit,
     onGroupBarClicked: () -> Unit,
+    onStackedBarClicked: () -> Unit,
 ) {
 
     val list: List<Pair<String, () -> Unit>> =
         listOf(
             "Bar Chart" to onBarChartClicked,
+            "Stack Bar Chart" to onStackedBarClicked,
             "Candle Chart" to onCandleChartClicked,
             "Combined Bar Chart" to onCombinedBarChartClicked,
             "Circle Chart" to onCircleChartClicked,

diff --git a/app/src/main/java/com/himanshoe/charty/Navigator.kt b/app/src/main/java/com/himanshoe/charty/Navigator.kt
@@ -15,6 +15,7 @@ import com.himanshoe.charty.ui.HorizontalBarChartDemo
 import com.himanshoe.charty.ui.LineChartDemo
 import com.himanshoe.charty.ui.PieChartDemo
 import com.himanshoe.charty.ui.PointChartDemo
+import com.himanshoe.charty.ui.StackedBarChartDemo
 
 @Composable
 fun RegisterNavigation(
@@ -30,6 +31,7 @@ fun RegisterNavigation(
     onGroupBarClicked: () -> Unit,
     onCombinedBarChartClicked: () -> Unit,
     onCandleChartClicked: () -> Unit,
+    onStackedBarClicked: () -> Unit,
 ) {
     NavHost(navController = navigator, startDestination = "main") {
         composable("barchart") { BarChartDemo() }
@@ -45,13 +47,15 @@ fun RegisterNavigation(
                 onPieChartClicked = onPieChartClicked,
                 onGroupHorizontalClicked = onGroupHorizontalClicked,
                 onCombinedBarChartClicked = onCombinedBarChartClicked,
-                onCandleChartClicked = onCandleChartClicked
+                onCandleChartClicked = onCandleChartClicked,
+                onStackedBarClicked = onStackedBarClicked
             )
         }
         composable("horizontalBarChartDemo") { HorizontalBarChartDemo() }
         composable("circlechart") { CircleChartDemo() }
         composable("linechart") { LineChartDemo() }
         composable("curvelinechart") { CurveLineChartDemo() }
+        composable("stackedBar") { StackedBarChartDemo() }
         composable("pointchart") { PointChartDemo() }
         composable("piechart") { PieChartDemo() }
         composable("grouphorizontalbar") { GroupedHorizontalBarChartDemo() }

diff --git a/app/src/main/java/com/himanshoe/charty/ui/BarChart.kt b/app/src/main/java/com/himanshoe/charty/ui/BarChart.kt
@@ -31,22 +31,7 @@ fun BarChartDemo() {
                 barData = listOf(
                     BarData(10F, 35F),
                     BarData(20F, 25F),
-                    BarData(10F, 50F),
-                    BarData(60F, 10F),
-                    BarData(10F, 15F),
-                    BarData(10F, 15F),
-                    BarData(10F, 15F),
-                    BarData(10F, 15F),
-                    BarData(10F, 15F),
-                    BarData(10F, 15F),
-                    BarData(10F, 15F),
-                    BarData(10F, 15F),
-                    BarData(10F, 15F),
-                    BarData(10F, 15F),
-                    BarData(10F, 15F),
-                    BarData(10F, 15F),
-                    BarData(50F, 100F),
-                    BarData(20F, 25F),
+
                 )
             )
         }

diff --git a/app/src/main/java/com/himanshoe/charty/ui/StackBarChartDemo.kt b/app/src/main/java/com/himanshoe/charty/ui/StackBarChartDemo.kt
@@ -0,0 +1,79 @@
+package com.himanshoe.charty.ui
+
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.height
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.lazy.LazyColumn
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.unit.dp
+import com.himanshoe.charty.bar.StackedBarChart
+import com.himanshoe.charty.bar.model.StackedBarData
+
+private val stackedBarData = listOf(
+    StackedBarData(1F, listOf(40F, 50F, 10F)),
+    StackedBarData(2F, listOf(30F, 40F, 5F)),
+    StackedBarData(3F, listOf(90F, 40F, 71F)),
+    StackedBarData(4F, listOf(13F, 2F, 8F)),
+    StackedBarData(5F, listOf(30F, 40F, 20F)),
+    StackedBarData(6F, listOf(30F, 40F, 20F)),
+    StackedBarData(7F, listOf(40F, 50F, 10F)),
+    StackedBarData(8F, listOf(30F, 40F, 5F)),
+    StackedBarData(9F, listOf(90F, 40F, 71F)),
+    StackedBarData(10F, listOf(13F, 2F, 8F)),
+    StackedBarData(11F, listOf(30F, 40F, 20F)),
+    StackedBarData(1F, listOf(40F, 50F, 10F)),
+    StackedBarData(2F, listOf(30F, 40F, 5F)),
+    StackedBarData(3F, listOf(90F, 40F, 71F)),
+    StackedBarData(4F, listOf(13F, 2F, 8F)),
+    StackedBarData(5F, listOf(30F, 40F, 20F)),
+    StackedBarData(6F, listOf(30F, 40F, 20F)),
+    StackedBarData(7F, listOf(40F, 50F, 10F)),
+    StackedBarData(8F, listOf(30F, 40F, 5F)),
+    StackedBarData(9F, listOf(90F, 40F, 71F)),
+    StackedBarData(10F, listOf(13F, 2F, 8F)),
+    StackedBarData(11F, listOf(30F, 40F, 20F)),
+)
+
+@Composable
+fun StackedBarChartDemo() {
+    LazyColumn(
+        Modifier
+            .fillMaxSize()
+    ) {
+        item {
+            StackedBarChart(
+                modifier = Modifier
+                    .fillMaxWidth()
+                    .height(220.dp)
+                    .padding(32.dp),
+                stackBarData = stackedBarData,
+                colors = pcolors
+            )
+        }
+        item {
+            StackedBarChart(
+                modifier = Modifier
+                    .fillMaxWidth()
+                    .height(220.dp)
+                    .padding(32.dp),
+                stackBarData = stackedBarData.takeLast(3),
+                onBarClick = {
+                },
+                colors = pcolors
+
+            )
+        }
+        item {
+            StackedBarChart(
+                modifier = Modifier
+                    .fillMaxWidth()
+                    .height(220.dp)
+                    .padding(32.dp),
+                colors = pcolors,
+                stackBarData = stackedBarData.takeLast(22)
+            )
+        }
+    }
+}
diff --git a/charty/src/main/java/com/himanshoe/charty/bar/BarChart.kt b/charty/src/main/java/com/himanshoe/charty/bar/BarChart.kt
@@ -34,7 +34,7 @@ fun BarChart(
     color: Color,
     onBarClick: (BarData) -> Unit,
     modifier: Modifier = Modifier,
-    barDimens: ChartDimens = ChartDimensDefaults.chartDimesDefaults(),
+    chartDimens: ChartDimens = ChartDimensDefaults.chartDimesDefaults(),
     axisConfig: AxisConfig = AxisConfigDefaults.axisConfigDefaults(),
     barConfig: BarConfig = BarConfigDefaults.barConfigDimesDefaults()
 ) {
@@ -43,7 +43,7 @@ fun BarChart(
         colors = listOf(color, color),
         onBarClick = onBarClick,
         modifier = modifier,
-        barDimens = barDimens,
+        chartDimens = chartDimens,
         axisConfig = axisConfig,
         barConfig = barConfig
     )
@@ -55,7 +55,7 @@ fun BarChart(
     colors: List<Color>,
     onBarClick: (BarData) -> Unit,
     modifier: Modifier = Modifier,
-    barDimens: ChartDimens = ChartDimensDefaults.chartDimesDefaults(),
+    chartDimens: ChartDimens = ChartDimensDefaults.chartDimesDefaults(),
     axisConfig: AxisConfig = AxisConfigDefaults.axisConfigDefaults(),
     barConfig: BarConfig = BarConfigDefaults.barConfigDimesDefaults()
 ) {
@@ -75,7 +75,7 @@ fun BarChart(
                     yAxis(axisConfig, maxYValue)
                 }
             }
-            .padding(horizontal = barDimens.padding)
+            .padding(horizontal = chartDimens.padding)
             .pointerInput(Unit) {
                 detectTapGestures(onPress = { offset ->
                     clickedBar.value = offset
@@ -86,8 +86,8 @@ fun BarChart(
         val yScalableFactor = size.height.div(maxYValue)
 
         barData.forEachIndexed { index, data ->
-            val topLeft = getTopLeft(index, barWidth, size, data, yScalableFactor)
-            val topRight = getTopRight(index, barWidth, size, data, yScalableFactor)
+            val topLeft = getTopLeft(index, barWidth.value, size, data.yValue, yScalableFactor)
+            val topRight = getTopRight(index, barWidth.value, size, data.yValue, yScalableFactor)
             val barHeight = data.yValue.times(yScalableFactor)
 
             if (clickedBar.value.x in (topLeft.x..topRight.x)) {
@@ -101,7 +101,7 @@ fun BarChart(
             )
             // draw label
             if (axisConfig.showXLabels) {
-                drawBarLabel(data, barWidth.value, barHeight, topLeft, barData.count())
+                drawBarLabel(data.xValue, barWidth.value, barHeight, topLeft, barData.count())
             }
         }
     }

diff --git a/charty/src/main/java/com/himanshoe/charty/bar/GroupedBarChart.kt b/charty/src/main/java/com/himanshoe/charty/bar/GroupedBarChart.kt
@@ -69,8 +69,8 @@ fun GroupedBarChart(
 
         groupedBarData.flatMap { it.barData }
             .forEachIndexed { index, data ->
-                val topLeft = getTopLeft(index, barWidth, size, data, yScalableFactor)
-                val topRight = getTopRight(index, barWidth, size, data, yScalableFactor)
+                val topLeft = getTopLeft(index, barWidth.value, size, data.yValue, yScalableFactor)
+                val topRight = getTopRight(index, barWidth.value, size, data.yValue, yScalableFactor)
                 val barHeight = data.yValue.times(yScalableFactor)
 
                 if (clickedBar.value.x in (topLeft.x..topRight.x)) {
@@ -84,7 +84,7 @@ fun GroupedBarChart(
                 )
                 // draw label
                 if (axisConfig.showXLabels) {
-                    drawBarLabel(data, barWidth.value, barHeight, topLeft, groupedBarData.count())
+                    drawBarLabel(data.xValue, barWidth.value, barHeight, topLeft, groupedBarData.count())
                 }
             }
     }