Bar column chart with different colors


#1

Hi,

I have a bar column chart that use to display values correctly before updating the Shinobi framework. Without changing code, it seems broken.

For each bar, it needs to display up to 3 colors depending on the value of the dataPoint. Colors change according to constant tresholds on the y Axis. The bottom of *each* bar should be green.

I used to achieve this by setting the color area below baseline to green (see code snippet below). Now that property does not seem to work.

    SChartColumnSeries *lineSeries = [[SChartColumnSeriesalloc] init];
lineSeries.baseline = @0;
lineSeries.style.lineWidth = @0;
 lineSeries.style.showAreaWithGradient = NO;
lineSeries.style.showArea = YES;
lineSeries.style.lineColor = [UIColor clearColor];
lineSeries.stackIndex = @1;

Any clues?


#2

Hi Leblanc,

We aren’t currently aware of any issues with our baseline. Which version of ShinobiCharts have you updated from, and which version of ShinobiCharts have you updated to?

However, if you’re trying to display three colours I wouldn’t expect the approach you are currently using to work anyway (as the baseline would only get you two colours). Have you thought about using three stacked series with the same stack index, one coloured green, etc.

You could then create the illusion of these three stacked series actually being an individual column series, but with different colours as they pass through different thresholds.

Thanks,
Jan


#3

I’ve upgratded from 2.5.6 to 2.6.1 ![](file:///Volumes/francois-olivierleblanc/Downloads/photo.PNG).

I am doing the trick you are describing for the red part of the column. I thought It’d be easier to only have 2 series, with one (the yellow) having the baseline color (green). 

For the color area below baseline property to work, the baseline needs to be set. Is there another property to manage? In my chart, I can see the green color if there’s no ‘yellow’ value…

![](file:///Volumes/francois-olivierleblanc/Downloads/photo.PNG)


#4

Hi Leblanc,

I suspect it would be just as simpe to use three series to acheive this effect, and it would probably be more consistent from the perspective of someone reading your code. Could you provide a few screen shots of what you’re seeing and what you used to see?

Jan


#5

Here’s a screen shot of what I have. I don’t have one with what I should have, though. But as you can see, the last 3 bars on the right have a small green zone (the bars labeled S, D and L). All 7 bars should have this green zone at the bottom of their bars.

I’ll try with three series later today and I’ll come back with more details.