How to make series follow up?

[Paget96]

I want to represent a battery history graph where both charging and discharging (ups and downs) will be shown. I want to use two separate series for these two.

Is there anything as a follow up, like a connect two series one after another so I can have different colors on one line?

Or I need to improvise?

[AAChartModel]

Do you have a design draft? Can you post it?

[Paget96]

Do you have a design draft? Can you post it?

Yes, want to make something like this

Example 1:
I do have 4 data sets in this order charging, discharging, charging, discharging, every set to have a different color and to make a follow up. By follow up I mean that at the end of first dataset, first line, the next line go after it.

Example 2:
I have 4 lists of 50 entries, when first one finish at index of 49, let's start next list at index of 50 and so on. So all 4 datasets will be at one. :)

[AAChartModel]

Configure AAChartModel instanse:

  fun customAreasplineChartWithColorfulGradientColorZones() :AAChartModel {
        val redStopsArr: Array<Any> = arrayOf(
            arrayOf(0.0, "#FF0000"),//颜色字符串设置支持十六进制类型和 rgba 类型
            arrayOf(1.0, AAColor.Clear)
        )

        val greenStopsArr: Array<Any> = arrayOf(
            arrayOf(0.0, "#00FF00"),//颜色字符串设置支持十六进制类型和 rgba 类型
            arrayOf(1.0, AAColor.Clear)
        )

        val blueStopsArr: Array<Any> = arrayOf(
            arrayOf(0.0, "#0000FF"),//颜色字符串设置支持十六进制类型和 rgba 类型
            arrayOf(1.0, AAColor.Clear)
        )

        val redGradientColorDic = AAGradientColor.linearGradient(
            AALinearGradientDirection.ToBottom,
            redStopsArr
        )

        val greenGradientColorDic = AAGradientColor.linearGradient(
            AALinearGradientDirection.ToBottom,
            greenStopsArr
        )

        val blueGradientColorDic = AAGradientColor.linearGradient(
            AALinearGradientDirection.ToBottom,
            blueStopsArr
        )

        val singleSpecialData = AADataElement()
            .marker(AAMarker()
                .radius(10f)//曲线连接点半径，默认是4
                .symbol(AAChartSymbolType.Circle.value)//曲线点类型："circle", "square", "diamond", "triangle","triangle-down"，默认是"circle"
                .fillColor(AAColor.White)//点的填充色(用来设置折线连接点的填充色)
                .lineWidth(5f)//外沿线的宽度(用来设置折线连接点的轮廓描边的宽度)
                //外沿线的颜色(用来设置折线连接点的轮廓描边的颜色, 当值为空字符串时，默认取数据点或数据列的颜色)
                .lineColor("#1E90FF")//道奇蓝
            )
            .y(85.3f)


        return AAChartModel()
            .chartType(AAChartType.Areaspline)
            .backgroundColor(AAColor.Black)
            .categories(arrayOf("Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"))
            .title("Colorful Gradient Color Zones")
            .subtitle("custom areaspline chart with colorful gradient color zones")
            .dataLabelsEnabled(false)
            .legendEnabled(false)
            .markerRadius(0f)
            .yAxisGridLineWidth(0f)
            .yAxisTitle("")
            .series(arrayOf(
                AASeriesElement()
                    .name("空气湿度")
                    .lineWidth(6f)
                    .zoneAxis("x")
                    .zones(arrayOf(
                        AAZonesElement()
                            .value(2)
                            .color(AAColor.Red)
                            .fillColor(redGradientColorDic),
                        AAZonesElement()
                            .value(5)
                            .color(AAColor.Green)
                            .fillColor(greenGradientColorDic),
                        AAZonesElement()
                            .color(AAColor.Blue)
                            .fillColor(blueGradientColorDic),
                    ))
                    .data(arrayOf(56.5, 33.3, 85.3, 23.9, 29.6, 34.5, 28.2, 26.5, 15.2, 56.5, 33.3, singleSpecialData))
            ))


    }

Final chart

[Paget96]

How can I set the categories (bottom values) to be max 6, since for X I'm using timestamps then converted to the time only. Chart is getting updated each second so the categories needed to be updated as well :)
I'm going from MPAndroidChart so searching for the best alternative, it's not updated for quite long