iPhone : How to change gradient color for negative values in Core Plot?

Question

How to change area gradient color for negative values in Gradient Scatter Plot in Core-Plot in iPhone?

I want gradient colors as below:

• For positive values to be Green

• For negative values to be Red.

How should I do that?

Yelena

You'll likely need to normalize your values. From what I can see, CPGradient only accepts CGFloat 0 - 1. So if your values range from -1024 to +1024, you'll need to add an offset and divide by the total range. That'll give you a number from 0-1. I can't answer for certain, b/c I've never worked with CorePlot. – Alec

@Stephen Furlani: Thanks for the input. I am not clear about wat u said. Can you please explain it in bit of detail – Yelena

You know, either ahead of time, or by looking at your data set, that all values n are such that j ≤ n ≤ k. Then, you can get the gradient value as (n - j) / (k - j), which will be in the range [0-1]. This linearly interpolates between j and k. – Bradford

Answer 1

Just implement the following method of the CPBarPlotDataSource is OK:

- (CPFill *)barFillForBarPlot:(CPBarPlot *)barPlot recordIndex:(NSUInteger)index
{
    if (barPlot.identifier == @"profit") {
        id item = [self.profits objectAtIndex:index];
        double profit = [[item objectForKey:@"profit"] doubleValue];

        if (profit < 0.0) {
            return [CPFill fillWithGradient:[CPGradient gradientWithBeginningColor:[CPColor redColor] endingColor:[CPColor blackColor]]];
        }
    }

    return nil;
}

Hope to help:)

Lenna

I am unsure why this answer has been marked as accepted as question is about a scatter plot. When I implement -barFillForBarPlot:recordIndex: when using a scatter plot, the method is never called. How did this fix the issue? – Descendent

Answer 2

Well, I don't know if it's too pretty, but I suppose you could do two separate plots with the same dataSource, let's say positivePlot and negativePlot.

CPScatterPlot *positivePlot = [[[CPScatterPlot alloc] init] autorelease];
positivePlot.identifier = @"PositivePlot";
positivePlot.dataSource = self;
[graph addPlot:positivePlot];

CPScatterPlot *negativevePlot = [[[CPScatterPlot alloc] init] autorelease];
negativevePlot.identifier = @"NegativePlot";
negativePlot.dataSource = self;
[graph addPlot:negativePlot];

Now, if you configure your plotSpaces properly, you can separate positive and negative values and configure each plot properly, including area gradient:

CPXYPlotSpace *positivePlotSpace = [graph newPlotSpace];
positivePlotSpace.xRange = [CPPlotRange plotRangeWithLocation:CPDecimalFromFloat(0)
                                             length:CPDecimalFromFloat(100)];
positivePlotSpace.yRange = [CPPlotRange plotRangeWithLocation:CPDecimalFromFloat(0)
                                             length:CPDecimalFromFloat(100)];

CPXYPlotSpace *negativevePlotSpace = [graph newPlotSpace];
negativePlotSpace.xRange = [CPPlotRange plotRangeWithLocation:CPDecimalFromFloat(-100)
                                             length:CPDecimalFromFloat(100)];
negativePlotSpace.yRange = [CPPlotRange plotRangeWithLocation:CPDecimalFromFloat(0)
                                             length:CPDecimalFromFloat(100)];


// Plots configuration


//POSITIVE VALUES
positivePlot.plotSpace = positivePlotSpace;

// Green for positive
CPColor *areaColor = [CPColor colorWithComponentRed:0.0 
                                            green:1.0
                                             blue:0.0
                                            alpha:1.0];
CPGradient *areaGradient = [CPGradient gradientWithBeginningColor:areaColor 
                                                    endingColor:[CPColor clearColor]];
areaGradient.angle = -90.0f;
CPFill *areaGradientFill = [CPFill fillWithGradient:areaGradient];
positivePlot.areaFill = areaGradientFill;


//NEGATIVE VALUES
negativePlot.plotSpace = negativePlotSpace;

// Red for negative
areaColor = [CPColor colorWithComponentRed:1.0 
                                     green:0.0
                                      blue:0.0
                                     alpha:1.0];
areaGradient = [CPGradient gradientWithBeginningColor:areaColor 
                                          endingColor:[CPColor clearColor]];
areaGradient.angle = -90.0f;
areaGradientFill = [CPFill fillWithGradient:areaGradient];
negativePlot.areaFill = areaGradientFill;

NOTE: This is off the top of my head, as I dont have Core-Plot docs here, or a working configuration to test this in, so the syntax or something might be off, but I think the general concept should work.

Cheers

Waterfall