search

PhilJay / MPAndroidChart

A powerful 🚀 Android chart view / graph view library, supporting line- bar- pie- radar- bubble- and candlestick charts as well as scaling, panning and animations.
Other
37.62k stars 9.02k forks source link

Fill line chart with gradient based on line gradient #3977

Open Smedzlatko opened 6 years ago

Smedzlatko commented 6 years ago

I have a question about coloring the charts with gradients. I have not found this particular issue I am facing in the documentation (I hope I did not overlook it) so perhaps you could tell me if this one is even possible with MPChart.

I have a use case where I want to color a line chart's line with gradient based on some value range. This is the easy part and I have LineGradient as follows:

val gradient = LinearGradient(
                0f, 600f, 0f, 0f,
                ContextCompat.getColor(context, R.color.colorBlueDark),
                ContextCompat.getColor(context, R.color.colorPinkDark),
                Shader.TileMode.CLAMP)

val paint = chart.renderer.paintRender
paint.setShader(gradient)

But I would like to fill the area below the chart as well with the color based on the color of the line above. An example of the desired output looks as follows:

graph

I know I could use a static gradient like this:

dataSet.fillDrawable = ContextCompat.getDrawable(context, R.drawable.gradient)
dataSet.setDrawFilled(true)

but I would like to have a dynamic color fill based on the actual data values. Is something like this possible to do? Thank you very much for the clarification.

almic commented 6 years ago

Very good idea. Yeah, this probably isn't implemented yet. I don't remember seeing anything like this.

DipaliShah commented 5 years ago

I've implemented this feature Here with one more dataset type for line i.e. GRADIENT_CUBIC_BEZIER and created respective methods for same.

agiro8747 commented 4 years ago

Hello, I'm trying to color my line chart with a single gradient that gets its values calculated based on Y values. I however don't seem to be able to calculate the proper start and end of the gradient. Asked a stackoverflow question too but unfortunately haven't got an answer. Could you help me out?

DipaliShah commented 4 years ago

@agiro8747 Try using the type GRADIENT_CUBIC_BEZIER with my forked library and post your queries there for any trouble you face.

agiro8747 commented 4 years ago

@DipaliShah sorry I write here, I found no "issues" tab on your github page. I have imported your fork by implementation 'com.github.DipaliShah:MPAndroidChart:v3.1.0-alpha' that I found on jitpack but found no LineDataSet.Mode.GRADIENT_CUBIC_BEZIER in the sources. am I missing something?

branyt commented 4 years ago

@DipaliShah sorry I write here, I found no "issues" tab on your github page. I have imported your fork by implementation 'com.github.DipaliShah:MPAndroidChart:v3.1.0-alpha' that I found on jitpack but found no LineDataSet.Mode.GRADIENT_CUBIC_BEZIER in the sources. am I missing something?

branyt commented 4 years ago

@Smedzlatko Did you succeed

Dipak26 commented 2 years ago

@agiro8747 Try using the type GRADIENT_CUBIC_BEZIER with my forked library and post your queries there for any trouble you face.

@DipaliShah I want to set gradient in Linear mode or how I use straight line path with GRADIENT_CUBIC_BIZER.