Pfuster12 / LiveChart

Android library to draw beautiful and rich line charts.
https://pfuster12.github.io/LiveChart/livechart/index.html
MIT License
132 stars 18 forks source link

Visual bugs and data misrepresentation due to smoothing [BUG] #37

Open EdwardvanRaak opened 3 years ago

EdwardvanRaak commented 3 years ago

Describe the bug Great lib, love the simple designs.

It's however possible with certain datasets and configurations to get some quite strange looking graphs.

As an example take (over-exaggerated) dataset:

Dataset(
     mutableListOf(
         DataPoint(0f, 0f),
         DataPoint(1f, 3.7f),
         DataPoint(2f, 3.6f),
         DataPoint(3f, 3.5f),
         DataPoint(4f, 0f),
         DataPoint(5f, 3.2f),
         DataPoint(6f, 0f),
         DataPoint(7f, 3.3f),
         DataPoint(8f, 0f)
     )
)

With XML

    <com.yabu.livechart.view.LiveChart
        android:id="@+id/dimensions_live_chart"
        android:layout_width="match_parent"
        android:layout_height="120dp"
        android:layout_marginStart="36dp"
        android:layout_marginTop="8dp"
        android:layout_marginEnd="36dp"
        android:layout_marginBottom="32dp"
        app:layout_constraintBottom_toBottomOf="..."
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="..." />

And code

        holder.dimensionsLiveChart.setDataset(it)
                .drawSmoothPath()
                .drawFill(false)
                .drawHorizontalGuidelines(steps = 3)
                .drawBaselineConditionalColor()
                .setBaselineManually(3f)
                .setOnTouchCallbackListener(object : LiveChart.OnTouchCallback {
                    @SuppressLint("SetTextI18n")
                    override fun onTouchCallback(point: DataPoint) {
                        //ommited
                    }

                    override fun onTouchFinished() {
                        //omitted
                    }
                })
                .drawDataset()
        }

This results in:

Screenshot from 2021-01-20 14-18-44

The bugs I discovered:

MilanMalovic commented 3 years ago

Hey, try to add this line in your xml that hold that view:

android:clipChildren="false"

EdwardvanRaak commented 3 years ago

@MilanMalovic Yeah that worked for the clipping issue. I now see that it was included in the XML in the README as well, but totally missed it so thanks for that!

The other issues are less visible on large datasets and I can smooth out the original data points myself anyway, so for now I'm good!

baraaaljabban commented 3 years ago

I'm still having Issue with chart been clipped I tried out to add android:clipChildren="false" but nothing changed photo_2021-02-15_12-03-11 can you please suggest me anything I can try to solve it. thanks in advance!

MilanMalovic commented 3 years ago

Hi @baraaaljabban, try to add android:clipChildren="false" to other views above or below LiveChart view. Hope it helps

Pfuster12 commented 3 years ago

Awesome charts!

I am not surprised if there is some issues with the smooth lines 🤕, especially with the fill. I'll raise two bugs for smoothing lines returning incorrect data points and for smooth fill inconsistencies.

Pfuster12 commented 3 years ago

@EdwardvanRaak You are right the drawSmoothPath() feature creates a new Path and it reads data points from the new path. Will have to figure out a way to maintain fidelity with the original dataset but display and follow the smooth path in the touch overlay.

baraaaljabban commented 3 years ago

@MilanMalovic yep this fixed it temporary thanks s I think there still some work to do because it dose not seems to be 100% ok as you guys munitioned up there in the comments

baraaaljabban commented 3 years ago

@Pfuster12 thank you! and thanks to you my friend for what you have done and for this repo! I'll be waiting for the next update! thank you guys!