oscarm
oscarm

Reputation: 2650

core plot custom Theme?

I'm using Core-Plot for a trend chart in an iPhone app and haven't found how to customize the background. I can create a theme using the built-in themes, like kCPPlainWhiteTheme, but how can I change them? or create a new one?

What i basically need to do is make the background transparent.

EDIT / UPDATE

I jus tested this code but it doesn't seem to work:

    //CPTheme *theme = [CPTheme themeNamed:kCPPlainWhiteTheme];
    CPTheme *theme = [[CPTheme alloc]init];
    chartTrend5 = (CPXYGraph *)[theme newGraph];    
    chartView.hostedGraph = chartTrend5;
    chartTrend5.paddingLeft = 0.0;
    chartTrend5.paddingTop = 0.0;
    chartTrend5.paddingRight = 0.0;
    chartTrend5.paddingBottom = 0.0;
    chartTrend5.fill = nil;
    chartTrend5.borderLineStyle = nil;
    chartView.hostedGraph.fill = nil;

    chartTrend5PlotSpace = (CPXYPlotSpace *)chartTrend5.defaultPlotSpace;
    chartTrend5PlotSpace.xRange = [CPPlotRange plotRangeWithLocation:CPDecimalFromFloat(0)
                                                              length:CPDecimalFromFloat(5)];

    // range is 0-125, but since the frame heights is 90, 
    // we need to convert the points to this adjusted scale. The factor is 0.72 => (90/125)
    chartTrend5PlotSpace.yRange = [CPPlotRange plotRangeWithLocation:CPDecimalFromFloat(0)
                                                              length:CPDecimalFromFloat(90)];



    CPXYAxisSet *axisSet = (CPXYAxisSet *)chartTrend5.axisSet;

    CPXYAxis *x = axisSet.xAxis;
    x.majorIntervalLength =  CPDecimalFromFloat(100);
    //x.constantCoordinateValue = CPDecimalFromFloat(2);
    x.minorTicksPerInterval = 2;
    x.borderWidth = 0;
    x.labelExclusionRanges = [NSArray arrayWithObjects:
                              [CPPlotRange plotRangeWithLocation:CPDecimalFromFloat(-1) 
                                                          length:CPDecimalFromFloat(800)], 
                              nil];;

    CPXYAxis *y = axisSet.yAxis;
    y.majorIntervalLength = CPDecimalFromFloat(100);
    y.minorTicksPerInterval = 1;
    //y.constantCoordinateValue = length:CPDecimalFromFloat(2);
    y.labelExclusionRanges = [NSArray arrayWithObjects:
                              [CPPlotRange plotRangeWithLocation:CPDecimalFromFloat(-26) 
                                                          length:CPDecimalFromFloat(100)], 
                              nil];





    CPScatterPlot *dataSourceLinePlot = [[[CPScatterPlot alloc] init] autorelease];
    dataSourceLinePlot.identifier = @"TrendChart";
    dataSourceLinePlot.dataLineStyle.lineWidth = 2.f;
    dataSourceLinePlot.dataLineStyle.lineColor = [CPColor colorWithComponentRed:(16/255.f) 
                                                                          green:(101/255.f) 
                                                                           blue:(122/255.f) 
                                                                          alpha:1];
    dataSourceLinePlot.dataSource = self;
    [chartTrend5 addPlot:dataSourceLinePlot];
    chartTrend5.fill = nil;
    // Put an area gradient under the plot above

    CPColor *areaColor = [CPColor colorWithComponentRed:(212/255.f) 
                                                  green:(233/255.f)
                                                   blue:(216/255.f)
                                                  alpha:1];

    CPGradient *areaGradient = [CPGradient gradientWithBeginningColor:areaColor 
                                                          endingColor:areaColor];
    areaGradient.angle = -90.0f;
    CPFill *areaGradientFill = [CPFill fillWithGradient:areaGradient];
    dataSourceLinePlot.areaFill = areaGradientFill;
    dataSourceLinePlot.areaBaseValue = CPDecimalFromString(@"5.25");

here I set the the fill property of CPXYGraph *chartTrend5 and *CPXYPlotSpace *chartTrend5PlotSpace to nil.

Upvotes: 10

Views: 7330

Answers (4)

Brad Larson
Brad Larson

Reputation: 170317

In addition to what Eric suggests, you can also try setting the fill to a clear color. For example, I've used this in the past to provide a transparent background to graphs:

CPTTheme *theme = [CPTTheme themeNamed:kCPPlainWhiteTheme];
graph = (CPTXYGraph *)[theme newGraph];

graph.fill = [CPTFill fillWithColor:[CPTColor clearColor]];
graph.plotAreaFrame.fill = [CPTFill fillWithColor:[CPTColor clearColor]];

Upvotes: 24

wasmitschmidt
wasmitschmidt

Reputation: 1

I used the .fill and .plot.AreaFrame.fill properties :

plot = [[CPTXYGraph alloc] initWithFrame:CGRectZero];
CPTTheme *theme = [CPTTheme themeNamed:kCPTSlateTheme];
[plot applyTheme:theme];
self.graph.collapsesLayers = NO;
self.graph.hostedGraph = plot;

plot.paddingLeft = 1.0;
plot.paddingTop = 1.0;
plot.paddingRight = 1.0;
plot.paddingBottom = 1.0;
plot.fill = [CPTFill fillWithColor:[CPTColor clearColor]];
plot.plotAreaFrame.fill = [CPTFill fillWithColor:[CPTColor clearColor]];

This works for me.

Upvotes: 0

Jean
Jean

Reputation: 2625

I tried this & it works for me:

// Here 'hostingView' is your CPTGraphHostingView to
// which you add your graph
UIImageView *backgroundImage = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"background.png"]];
[hostingView addSubview:backgorundImage];
[hostingView sendSubviewToBack:backgroundImage];

Upvotes: 1

Eric Skroch
Eric Skroch

Reputation: 27381

Themes are just a convenient way to set a lot of the style properties at once. You can set any of them individually to customize the look. Any time you want an area to be transparent, you can set its fill to nil. Same with line styles--set them to nil to prevent a line from being drawn.

There are two "background" areas that you might be concerned with. The graph has a fill as does the plot area. The plot area is the region where the plots are drawn. Set the fill property on both of these to nil to make the background transparent.

Upvotes: 6

Related Questions