In iPhone App i am using core Plot vertical bar chart.
How to Remove shadow effect in Vertical Bars?
Here as shown in figure bars are displaying with shadow
Here is the code:
CPBarPlot *barPlot = [CPBarPlot tubularBarPlotWithColor:[CPColor colorWithComponentRed:111 green:129 blue:113 alpha:1.0] horizontalBars:NO];
barPlot.shadowColor=NO;
How can I remove this shadow effect?
Please Help and Suggest.
Thanks
Haven't tested this, but my guess is that what you see is not a shadow but a gradient fill generated by the use of "tubularBarPlotWithColor". The shadow is probably something outside the bar borders.
Instead, try creating the bar plot with:
CPBarPlot *barPlot = [[CPBarPlot alloc] init];
Then use:
barPlot.fill = [CPFill fillWithColor:myCPColor];
Or if you actually want a gradient fill:
fillGradient = [CPGradient gradientWithBeginningColor:myCPColorBegin endingColor:myCPColorEnd];
barPlot.fill = [CPFill fillWithGradient:fillGradient];
Hope this helps!
Claes
I faced the white colored plots isssue
yourPlot.fill = [CPTFill fillWithColor:[CPTColor colorWithComponentRed:80.0f / 255.0f green:186.0f / 255.0f blue:224.0f / 255.0f alpha:1.0f]];
this gives me the desired color..
Related
![enter image description here][1]
Can anybody tell how to draw dark blue masked area on coreplot graph from y-axis 4 to 10 and through out the x-axis like i showed in the figure.
Core Plot calls that a "background limit band". There are examples in several of the example apps, including the Plot Gallery.
CPTPlotRange *range = [CPTPlotRange plotRangeWithLocation:CPTDecimalFromDouble(4.0)
length:CPTDecimalFromDouble(6.0)];
CPTFill *bandFill = [CPTFill fillWithColor:[CPTColor blueColor]];
[yAxis addBackgroundLimitBand:[CPTLimitBand limitBandWithRange:range
fill:bandFill]];
How can I get an image behind my labels within my graph. I succeeded with putting an image in front of the graph with:
CPTPlotSpaceAnnotation *imageAnnotation;
CGRect imageRect = CGRectMake(0, 0 , 480, 320);
CPTBorderedLayer * ImageLayer = [[CPTBorderedLayer alloc] initWithFrame:imageRect];
ImageLayer.fill = [CPTFill fillWithImage:[CPTImage imageWithCGImage:[[UIImage imageNamed:#"Overlay_3_digits.png"] CGImage]]];
imageAnnotation = [[CPTPlotSpaceAnnotation alloc] initWithPlotSpace:plotSpace anchorPlotPoint:nil];
imageAnnotation.contentLayer = ImageLayer;
[graph addAnnotation:imageAnnotation];
[graph addSublayer:ImageLayer];
[newImagelLayer release];
[imageAnnotation release];
adding the image with [graph insertSubLayer:ImageLayer below:y]; didn't worked, this also puts the image in front of the graphs and axislabels. Hope someone can help me out.
EDIT:
I added a screenshot from the simulator. The three black rectangles needs to be in front of my plots and behind my labels. The labels will be readible more easily.
I also editted the hierarchy of layers from my graph by putting the axislabels at the first index:
NSArray *chartLayers = [[NSArray alloc] initWithObjects:[NSNumber numberWithInt:CPTGraphLayerTypeAxisLabels],
[NSNumber numberWithInt:CPTGraphLayerTypePlots],
[NSNumber numberWithInt:CPTGraphLayerTypeMajorGridLines],
[NSNumber numberWithInt:CPTGraphLayerTypeMinorGridLines],
[NSNumber numberWithInt:CPTGraphLayerTypeAxisLines],
[NSNumber numberWithInt:CPTGraphLayerTypeAxisTitles],
nil];
graph.topDownLayerOrder = chartLayers;
I also found a better way of putting my image inside the graph. I did this by means of a new hostlayer:
CPTAnnotationHostLayer *newHostLayer = [[CPTAnnotationHostLayer alloc]
initWithFrame:CGRectMake(0, 0, 480, 220)];
UIImage * annotationBG = [UIImage imageNamed:#"Overlay_3_digits.png"];
newHostLayer.backgroundColor = [UIColor colorWithPatternImage:annotationBG].CGColor;
Any ideas how I can put the three black triangle image at the back of my labels and in front of the plots?
The -addAnnotation: method takes care of updating the layer tree; you should remove your call to -addSublayer:.
Do you want the image to completely fill the background behind the graph? If so, just set the fill on the graph instead of making an annotation.
graph.fill = [CPTFill fillWithImage:[CPTImage imageWithCGImage:[[UIImage imageNamed:#"Overlay_3_digits.png"] CGImage]]];
To put the box behind each label, you can use custom labels. Build a CPTBorderedLayer the same way you did for the annotation. Add a CPTTextLayer with the label text as a sublayer of the bordered layer. Make the bordered layer the contentLayer of the custom label. This should remove the need to change the topDownLayerOrder, too.
I am plotting graph using core plot. I am trying to plot my graph on plot area, but it contains white background. But I want to plot graph with my own background. This is my code.
// setting frame of graph
CGRect frame = [self.hostingView bounds];
self.graph = [[[CPTXYGraph alloc] initWithFrame:frame] autorelease];
// Add some padding to the graph, with more at the bottom for axis labels.
self.graph.plotAreaFrame.paddingTop = 10.0f;
self.graph.plotAreaFrame.paddingRight = 10.0f;
self.graph.plotAreaFrame.paddingBottom = 25.0f;
self.graph.plotAreaFrame.paddingLeft = 30.0f;
// set background color of plot area by fill property and CPTColor
self.graph.plotAreaFrame.plotArea.fill=[(CPTFill *)[CPTFill alloc] initWithColor: [CPTColor colorWithComponentRed:0.8 green:0.8 blue:0.8 alpha:1.0]];
// add graph to hosting view by hostedGraph property of hostingView
self.hostingView.hostedGraph = self.graph;
In above code I tried to change color but I want to draw horizontal dotted lines for each ticks on y axis.
Set the majorGridLineStyle and/or minorGridLineStyle on the y-axis to draw horizontal lines at the major and minor tick locations, respectively.
Use the dashPattern and patternPhase properties of the line style to make a dotted line. See Apple's Quartz 2D docs for details on how those properties work.
This is my code which i have used for above....
// create an object of CPTMutableLineStyle and set property of it.
CPTMutableLineStyle *dottedStyle=[CPTMutableLineStyle lineStyle];
dottedStyle.dashPattern=[NSArray arrayWithObjects:[NSDecimalNumber numberWithInt:1,[NSDecimalNumber numberWithInt:2],nil];
dottedStyle.patternPhase=0.0f;
// set the majorGridLinestyleProperty by this line as.
axisSet.yAxis.majorGridLineStyle=dottedStyle;
So I am trying to create an animated bar graph using apple core animation. The bar is just basically a rectangular figure, which have a value of 0-100%. When it first appears I wanted it to show an animation going from 0 to x %. How can I draw a rectangular form like this?
UPDATE:
Most probably I will have a bar as an image, so I need to animate this image to a certain height...
If your requirements are really that simple, you could create a view, set its background color and adjust (or animate) its frame.width (or height) as needed.
Of course there are more elaborate ways to do this, but no need to over-engineer for a simple problem.
This should do exactly what you want:
- (UIImageView*)createNewBarWithValue:(float)percent atLocation:(CGPoint)location
{
UIImageView *newBar = [[[UIImageView alloc] initWithFrame:CGRectMake(location.x, location.y, 50, 200)] autorelease];
newBar.image = [UIImage imageNamed:#"bar.png"];
CABasicAnimation *scaleToValue = [CABasicAnimation animationWithKeyPath:#"transform.scale.y"];
scaleToValue.toValue = [NSNumber numberWithFloat:percent];
scaleToValue.fromValue = [NSNumber numberWithFloat:0];
scaleToValue.duration = 1.0f;
scaleToValue.delegate = self;
newBar.layer.anchorPoint = CGPointMake(0.5, 1);
[newBar.layer addAnimation:scaleToValue forKey:#"scaleUp"];
CGAffineTransform scaleTo = CGAffineTransformMakeScale( 1.0f, percent );
newBar.transform = scaleTo;
return newBar;
}
I am customizing my UITableView and I figured out how to set the selected color of each cell. In my cellForRowAtIndexPath method, I have the following code:
UIView *bgColorView = [[UIView alloc] init];
[bgColorView setBackgroundColor:[UIColor orangeColor]];
[cell setSelectedBackgroundView:bgColorView];
[bgColorView release];
But it is a solid orange. I want to make it more slick looking, and have it be a slight gradient from light orange to darker orange. How can I do this?
You'd use Core Graphics (a.k.a. Quartz) to draw a gradient in your view's -drawRect: method:
CGContextRef ctx = UIGraphicsGetCurrentContext();
CGFloat colors[8] = {1.0, 0.75, 0.30, 0.5, 0.7, 0.2, 1.0, 0.8};
CGColorSpaceRef space = CGColorSpaceCreateDeviceRGB();
CGGradientRef gradient = CGGradientCreateWithColorComponents(space, colors, NULL, 2);
CGContextDrawLinearGradient(ctx, gradient, top, bottom, NULL);
You can limit the area that the gradient fills by creating a path in the current context (ctx) and the clipping to it using CGContextClip(ctx);. top and bottom are CGPoints that define the beginning and end of the gradient.
You will have to override the view's drawRect method to draw the gradient. It can be kind of a PIA, but you can also check out this open source component which may work:
http://cocoacontrols.com/platforms/ios/controls/gradient-view
#Caleb's answer is right on; I do this for a variety of things.
What no one has mentioned is that the view for which you need to implement drawRect: is a custom UITableViewCell.
simple google search will find your answer ....
http://bluesplat-tech.blogspot.com/2009/03/gradient-shading-uiview.html
If you want a complex or subtle gradient, you can set a background image that is partial alpha and set the cell background color to change appearance.