Having multiple colour bands with an area that changes dynamically over time

[dddppp]

Hello,

I have found this chart library for iOS and I really like it. It has slick animations and seem to be polished and modern. I am trying to use it for a test project and wanted to ask you if it is possible to create a graph that has 4 (or more) colour bands that have an area that changes dynamically over time (based on some dynamic property - not x or y value).

I attach a quick sketch. Image the x axis being the time and y axis being the values (from 0-100). The area of the 4 bands will change depending on some parameter that will change over time.

For example at time 0 the black area upper limit may be 30, the white area may go from 30 to 50, the green area from 50 to 70 and the orange area from 70 to 100. At time 0+x these limits may change.

Importantly the area should be coloured only until the current time (E.g. until x = 50) like in the current example and then as time progresses the area should change according to the x,y value (please see attached files).

Is this possible with this library?

[liuxuan30]

I am guessing the line chart could help you, it has filling features to render as the color band. But maybe you need to override some methods to achieve the visual effects you want.

[danielgindi]

To me it looks like a stacked bar chart...

[dddppp]

Hello, I have been trying this approach using a bar chart and is the best approximation possible. Ideally I need to find a way to make the bar wider and remove the white border from it so it looks more uniform.. any idea on how I can do it?

[danielgindi]

Well you can adjust the bar spacing, and the bar width.
Also if you really want several coloured lines, you could just use multiple datasets in a LineChart

[dddppp]

Hello, the issue I got is that I need a line to show some data and the 3 changing bars to show where the data fits. So the line has a neutral colour and can have at time x a value y, which at time x corresponds to colour green but then at time x+n it could correspond to colour red even if y is the same. Thanks for replying.

[liuxuan30]

You need the line to swtich stroke color between the dots? like -red-green-yellow-? It still sounds you need to override the chart renderer to get what you want.

[liuxuan30]

Closing - feel free to reopen it for more questions.