I am unable to change the pie chart position (I would like it to be more left in respect to the legend so that the legend does not overlay the pie chart). Basically I would like to shift it towards the left to allow the legend to display.
I tried modifying the following properties (but with no apparent effect on the pie graph position):
// pieChartGraph is a CPTPieChart object
pieChartGraph.graph.position = CGPointMake(-100, 0);
// I also tried:
pieChart.position = CGPointMake(-100, 0);
// and also playing with:
pieChart.anchorPoint
Here is what I get and also my code (by the way, the title does not show either):
pieChartGraph = [[CPTXYGraph alloc] initWithFrame:self.pieChartgraphHostView.bounds];
self.pieChartgraphHostView.hostedGraph = pieChartGraph;
pieChartGraph.plotAreaFrame.masksToBorder = NO;
pieChartGraph.axisSet = nil;
pieChart.title = #"title"; // <-- BTW, the title does not show either
// 2 - Create chart
pieChart = [[CPTPieChart alloc] init];
pieChart.dataSource = self;
pieChart.delegate = self;
pieChart.pieRadius = self.pieChartgraphHostView.bounds.size.width;
pieChartGraph.delegate = self;
pieChart.identifier = pieChartGraph.title;
pieChart.startAngle = CPTFloat(M_PI_4);
pieChart.sliceDirection = CPTPieDirectionClockwise;
pieChart.borderLineStyle = [CPTLineStyle lineStyle];
// 3 - Create gradient
CPTGradient *overlayGradient = [[CPTGradient alloc] init];
overlayGradient.gradientType = CPTGradientTypeRadial;
overlayGradient = [overlayGradient addColorStop:[[CPTColor blackColor] colorWithAlphaComponent:0.0] atPosition:0.9];
overlayGradient = [overlayGradient addColorStop:[[CPTColor blackColor] colorWithAlphaComponent:0.4] atPosition:1.0];
pieChart.overlayFill = [CPTFill fillWithGradient:overlayGradient];
// 4 - Add chart to graph
pieChart.pieRadius = pieChart.pieRadius / 2.3;
[pieChartGraph addPlot:pieChart];
self.dataForChart = [#[#(self.displayedLastDataPoint.percentageUnder), #(self.displayedLastDataPoint.percentageOver), #(self.displayedLastDataPoint.percentageClean), #(self.displayedLastDataPoint.percentageRemaining)] mutableCopy];
// Add legend
CPTLegend *theLegend = [CPTLegend legendWithGraph:pieChartGraph];
theLegend.numberOfColumns = 1;
theLegend.fill = [CPTFill fillWithColor:[CPTColor whiteColor]];
theLegend.borderLineStyle = [CPTLineStyle lineStyle];
theLegend.entryFill = [CPTFill fillWithColor:[CPTColor lightGrayColor]];
theLegend.entryBorderLineStyle = [CPTLineStyle lineStyle];
theLegend.entryCornerRadius = CPTFloat(3.0);
theLegend.entryPaddingLeft = CPTFloat(3.0);
theLegend.entryPaddingTop = CPTFloat(3.0);
theLegend.entryPaddingRight = CPTFloat(3.0);
theLegend.entryPaddingBottom = CPTFloat(3.0);
theLegend.cornerRadius = 5.0;
theLegend.delegate = self;
pieChartGraph.legend = theLegend;
pieChartGraph.legendAnchor = CPTRectAnchorRight;
CGFloat legendPadding = +(self.view.bounds.size.width / 16);
pieChartGraph.legendDisplacement = CGPointMake(legendPadding, 0.0);
pieChartGraph.graph.position = CGPointMake(-30, 0);
Set the centerAnchor to position the pie chart within the graph. It is a CGPoint. Both coordinates range between 0 and 1, similar to the anchorPoint of a CALayer.
Related
The graph on the left is the one from the CorePlot gallery demo, the one on the right is the one I created with the code below. I think I am missing something in order to make it look like an actual circular pie:
-(void)configureChart {
// 1 - Get reference to graph
pieChartGraph = [[CPTXYGraph alloc] initWithFrame:self.pieChartgraphHostView.bounds];
self.pieChartgraphHostView.hostedGraph = pieChartGraph;
// 2 - Create chart
pieChart = [[CPTPieChart alloc] init];
pieChart.dataSource = self;
pieChart.delegate = self;
// pieChart.pieRadius = (self.pieChartgraphHostView.bounds.size.height * 0.7) / 2;
pieChart.pieRadius = (self.pieChartgraphHostView.bounds.size.height * 0.7) / 2;
pieChart.identifier = pieChartGraph.title;
pieChart.startAngle = CPTFloat(M_PI_4);
pieChart.sliceDirection = CPTPieDirectionClockwise;
pieChart.borderLineStyle = [CPTLineStyle lineStyle];
// 3 - Create gradient
CPTGradient *overlayGradient = [[CPTGradient alloc] init];
overlayGradient.gradientType = CPTGradientTypeRadial;
overlayGradient = [overlayGradient addColorStop:[[CPTColor blackColor] colorWithAlphaComponent:0.0] atPosition:0.9];
overlayGradient = [overlayGradient addColorStop:[[CPTColor blackColor] colorWithAlphaComponent:0.4] atPosition:1.0];
pieChart.overlayFill = [CPTFill fillWithGradient:overlayGradient];
// 4 - Add chart to graph
[pieChartGraph addPlot:pieChart];
pieChart.dataSource = self;
self.dataForChart = [#[#20.0, #30.0, #60.0] mutableCopy];
//self.dataForChart = [#[#20.0, #30.0, #60.0]mutableCopy];
}
I tried to copy the code from the demo gallery (class called CorePlot from the CorePlot example project here).
What am I doing wrong? Why is my graph a square and not a circle?
Try edit the radius of the chart. That is what makes it a circle. To obtain a circle from a square view you usualy do something like:
squareView.radius = view.frame.size.width/2;
You can try this on you pieChart:
pieChart.pieRadius = pieChart.frame.size.width/2;
And by the way you are setting 2 times the pieChart dataSource
I am trying display some data on a chart using CorePlot. The y axis title and the labels get displayed without an issue, however the title of the x axis and the tick labels does not get displayed even with the automatic labeling policy. Please help me.
CPTMutableLineStyle *whiteLineStyle = [CPTMutableLineStyle lineStyle];
whiteLineStyle.lineColor = [CPTColor whiteColor];
whiteLineStyle.lineWidth = 1.0;
CPTXYGraph *newGraph = [[CPTXYGraph alloc] initWithFrame:self.view.bounds];
newGraph.paddingRight = 50;
newGraph.paddingLeft = 50;
newGraph.paddingTop = 10;
newGraph.paddingBottom = 40;
newGraph.plotAreaFrame.paddingBottom = 40;
newGraph.plotAreaFrame.masksToBorder = NO;
newGraph.plotAreaFrame.borderLineStyle = nil;
self.graphHost.hostedGraph = newGraph;
CPTTheme *theme = [CPTTheme themeNamed:kCPTSlateTheme];
[newGraph applyTheme:theme];
CPTXYAxisSet *xyAxisSet= (CPTXYAxisSet *)newGraph.axisSet;
CPTXYAxis *xAxis = xyAxisSet.xAxis;
CPTXYAxis *yAxis = xyAxisSet.yAxis;
xAxis.title = #"Date / Time";
yAxis.title = #"Trading Range";
[xAxis setLabelingPolicy:CPTAxisLabelingPolicyNone];
xAxis.majorTickLocations = [self majorTickLocations];
[xAxis setAxisLabels:[NSSet setWithArray:[self getXAxisTitleArray]]];
xAxis.majorTickLineStyle = whiteLineStyle;
[yAxis setLabelingPolicy:CPTAxisLabelingPolicyAutomatic];
CPTTradingRangePlot *ohlcPlot = [[CPTTradingRangePlot alloc] initWithFrame:newGraph.bounds];
ohlcPlot.labelOffset = 10.0;
ohlcPlot.stickLength = 10.0;
ohlcPlot.dataSource = self;
ohlcPlot.plotStyle = CPTTradingRangePlotStyleCandleStick;
ohlcPlot.lineStyle = whiteLineStyle;
CPTMutableTextStyle *whiteTextStyle = [CPTMutableTextStyle textStyle];
whiteTextStyle.color = [CPTColor whiteColor];
whiteTextStyle.fontSize = 10.0;
ohlcPlot.labelTextStyle = whiteTextStyle;
CPTXYPlotSpace *plotSpace = (CPTXYPlotSpace *) newGraph.defaultPlotSpace;
[newGraph addPlot:ohlcPlot toPlotSpace:plotSpace];
The following code solved my problem:
xAxis.axisConstraints = [CPTConstraints constraintWithLowerOffset:0.0];
I have a data array with values:
[1,2,4,5,7..]
and after set auto labeling policy, it will auto draw data at each point.
but there will be gap between 2 and 4, 5 and 7.
my question is how to remove this gap between each data and have a normal behavior when pinch or scale the graph, also the position of data "4" with show 4 at x axis, data "2" will show 2 at x axis.
Another problem I met is that, when I drag with in the graph, the axis segment sometimes will disappear or total axis will disappear.
(I cannot upload image, there is a copy of that in
https://github.com/core-plot/core-plot/issues/113
Thanks in advance.
here is my graph setup code:
_graph = [[CPTXYGraph alloc] initWithFrame:CGRectZero];
CPTTheme * theme = [CPTTheme themeNamed:kCPTPlainWhiteTheme];
[_graph applyTheme:theme];
[_graph setCornerRadius:0.0f];
//
_graphHost = [[CPTGraphHostingView alloc] initWithFrame:CGRectMake(0, 0, hostView.width, hostView.height)];
[_graphHost setBackgroundColor:[UIColor whiteColor]];
_dynamicPrice = [[UILabel alloc] initWithFrame:CGRectMake(10, _graphHost.height/2, 35, 10) font:[UIFont systemFontOfSize:8.0] color:[UIColor blueColor] text:#"test"];
[_dynamicPrice setBackgroundColor:[UIColor grayColor]];
[_dynamicPrice setTextAlignment:NSTextAlignmentCenter];
_dynamicPrice.layer.transform = CATransform3DMakeRotation(M_PI, 1, 0, 0);
_graphHost.hostedGraph = _graph;
[_graphHost addSubview:_dynamicPrice];
[hostView addSubview:_graphHost];
CPTMutableLineStyle *borderLineStyle = [CPTMutableLineStyle lineStyle];
borderLineStyle.lineColor = [CPTColor whiteColor];
borderLineStyle.lineWidth = 0.1f;
_graph.plotAreaFrame.borderLineStyle = nil;
_graph.plotAreaFrame.paddingTop += 10.0;
_graph.plotAreaFrame.paddingRight += 10.0;
_graph.plotAreaFrame.paddingBottom += 10.0;
_graph.plotAreaFrame.paddingLeft += 25.0;
_graph.plotAreaFrame.masksToBorder = NO;
_graph.plotAreaFrame.plotArea.delegate = self;
//
CPTMutableLineStyle *majorGridLineStyle = [CPTMutableLineStyle lineStyle];
majorGridLineStyle.lineWidth = 0.3f;
majorGridLineStyle.lineColor = [[CPTColor colorWithGenericGray:0.2] colorWithAlphaComponent:0.75];
//
CPTMutableLineStyle *minorGridLineStyle = [CPTMutableLineStyle lineStyle];
minorGridLineStyle.lineWidth = 0.1f;
minorGridLineStyle.lineColor = [[CPTColor lightGrayColor] colorWithAlphaComponent:0.1];
UIFont *labelFont = [UIFont systemFontOfSize:8.0f];
CPTTextStyle *labelStyle = [CPTTextStyle textStyleWithAttributes:#{NSFontAttributeName:labelFont, NSForegroundColorAttributeName:[UIColor blueColor]}];
// NSBackgroundColorAttributeName:[UIColor grayColor]
// Axes
CPTXYAxisSet *xyAxisSet = (id)_graph.axisSet;
CPTXYAxis *x = xyAxisSet.xAxis;
x.labelingPolicy = CPTAxisLabelingPolicyAutomatic;
x.majorIntervalLength = CPTDecimalFromDouble(60*3);
x.minorTicksPerInterval = 0;
x.majorGridLineStyle = majorGridLineStyle;
x.minorGridLineStyle = minorGridLineStyle;
x.axisConstraints = [CPTConstraints constraintWithRelativeOffset:0.0];
x.labelTextStyle = labelStyle;
//x.minorTickLabelTextStyle = labelStyle;
[self setXLabelDateFormater:_currentKLineType];
CPTXYAxis *y = xyAxisSet.yAxis;
y.labelingPolicy = CPTAxisLabelingPolicyAutomatic;
y.orthogonalCoordinateDecimal = CPTDecimalFromDouble(20);
y.majorIntervalLength = CPTDecimalFromDouble(20);
y.minorTicksPerInterval = 0;
y.majorGridLineStyle = majorGridLineStyle;
y.minorGridLineStyle = minorGridLineStyle;
y.axisConstraints = [CPTConstraints constraintWithLowerOffset:0.0];
y.labelOffset = 0.0;
y.labelTextStyle = labelStyle;
y.labelFormatter = yFormater;
// OHLC plot
CPTMutableLineStyle *redLineStyle = [CPTMutableLineStyle lineStyle];
redLineStyle.lineColor = [CPTColor redColor];
redLineStyle.lineWidth = 1.0f;
CPTMutableLineStyle *greenLineStyle = [CPTMutableLineStyle lineStyle];
greenLineStyle.lineColor = [CPTColor greenColor];
greenLineStyle.lineWidth = 1.0f;
CPTTradingRangePlot *kLineChart= [[CPTTradingRangePlot alloc] initWithFrame:_graph.bounds];
kLineChart.identifier = PLOT_KLINE;
kLineChart.lineStyle = redLineStyle;
CPTMutableTextStyle *whiteTextStyle = [CPTMutableTextStyle textStyle];
whiteTextStyle.color = [CPTColor whiteColor];
whiteTextStyle.fontSize = 12.0;
kLineChart.labelOffset = 0.0;
kLineChart.barCornerRadius = 0.0;
kLineChart.barWidth = 15.0;
kLineChart.increaseFill = [CPTFill fillWithColor:[CPTColor redColor]];
kLineChart.decreaseFill = [CPTFill fillWithColor:[CPTColor greenColor]];
kLineChart.increaseLineStyle = redLineStyle;
kLineChart.decreaseLineStyle = greenLineStyle;
kLineChart.dataSource = self;
kLineChart.delegate = self;
kLineChart.plotStyle = CPTTradingRangePlotStyleCandleStick;
[_graph addPlot:kLineChart];
CPTXYPlotSpace *plotSpace = (CPTXYPlotSpace *)_graph.defaultPlotSpace;
plotSpace.xRange = [CPTPlotRange plotRangeWithLocation:CPTDecimalFromDouble(-0.5) length:CPTDecimalFromDouble(oneDay * _kLineDataItems.count)];
plotSpace.yRange = [CPTPlotRange plotRangeWithLocation:CPTDecimalFromInteger(0) length:CPTDecimalFromInteger(4)];
plotSpace.allowsUserInteraction = YES;
plotSpace.delegate = self;
[plotSpace scaleToFitPlots:[_graph allPlots]];
when I pinch or scale the graph, I will set the plot range dynamic according to the postion shown in current view port.
What I need is a sooth change when scale or pinch, and fixed major grid position.
How can I implement that effect?
The bars for a trading range plot are drawn at the x-value provided by the datasource. If you want a bar at x=3, make sure the datasource provides one. Remember that the x-value is independent of the data index.
I am using this to show legend titles:
-(NSString *)legendTitleForPieChart:(CPTPieChart *)pieChart recordIndex:(NSUInteger)index {
NSLog(#"titles: %#", list[index]);
return list[index];
}
I can see console output:
titles: Entertaiment
titles: Entertaiment
titles: Entertaiment
titles: Entertaiment
.
.
.
But on the iPhone I'm seeing this:
Why is this happening and how can I fix it?
(CorePlot_1.5.1 Xcode 5.1 iOS 7.1)
Edit:
My configureLegend method look like this. I add legend to scrollView
-(void)configureLegend {
// 1 - Get graph instance
graph = self.hostView.hostedGraph;
// 2 - Create legend
CPTLegend *theLegend = [CPTLegend legendWithGraph:graph];
// 2 - Set up text style
CPTMutableTextStyle *textStyle = [CPTMutableTextStyle textStyle];
textStyle.color = [CPTColor blackColor];
textStyle.fontName = #"Helvetica-Thin";
textStyle.fontSize = 15.0f;
[[graph legend] setTextStyle:(CPTTextStyle *)textStyle];
theLegend.numberOfColumns = 2;
theLegend.fill = [CPTFill fillWithColor:[CPTColor whiteColor]];
theLegend.borderLineStyle = nil;
theLegend.cornerRadius = 5.0;
theLegend.hidden = NO;
// 4 - Add legend to graph
graph.legend = theLegend;
graph.legendAnchor = CPTRectAnchorBottom;
CGFloat legendPadding = 1.0;
graph.legendDisplacement = CGPointMake(legendPadding, 0.0);
scrollView = [[UIScrollView alloc] initWithFrame:CGRectMake(-5, 0, _secondView.frame.size.width, _secondView.frame.size.height + 20)];
scrollView.clipsToBounds = YES;
scrollView.userInteractionEnabled = YES;
scrollView.contentSize = CGSizeMake(_secondView.frame.size.width + 100, _secondView.frame.size.height + 400); //(scrollView.contentSize.width, 1000)
for (UIView *subView in self.secondView.subviews)
{
[subView removeFromSuperview];
}
[scrollView.layer addSublayer:self.hostView.hostedGraph.legend];
[self.secondView addSubview:scrollView];
scrollView.showsVerticalScrollIndicator = YES;
scrollView.showsHorizontalScrollIndicator = NO;
}
Since you add manually the legend view, you have this "reversed view issue".
Indeed, they draw the plots on a "reversed view", and they do the reverse. If I remember well, they do this because of the coordinates (x,y) to make it more understandable, since (x=0,y=0) should be at the left corner up, which is not how you usually do your graph.
So the solution, is to reverse it:
[[yourTitleView layer] setTransform:CATransform3DMakeRotation(M_PI, 1, 0, 0)];
CPTXYGraph *graph = [[CPTXYGraph alloc]initWithFrame:self.hostingView.frame];
graph.borderColor = [CPTColor whiteColor].cgColor;
graph.paddingTop = 0.0f;
graph.paddingRight = 0.0f;
graph.paddingLeft = 0.0f;
graph.paddingBottom = 0.0f;
self.hostingView.hostedGraph = graph;
graph.axisSet = nil;
//Apply for theme to graph
self.graphTheme = [CPTTheme themeNamed:kCPTPlainWhiteTheme];
[graph applyTheme:self.graphTheme];
[graph release];
CPTPieChart *pieChart = [[CPTPieChart alloc]init];
pieChart.identifier = #"OverView";
pieChart.dataSource = self;
pieChart.sliceDirection = CPTPieDirectionClockwise;
pieChart.pieRadius = ((self.hostingView.frame.size.height / 2) - 5);
pieChart.startAngle = M_PI;
CPTGraph *tempGraph = self.hostingView.hostedGraph;
[tempGraph addPlot:pieChart];
[pieChart release];
For this code i am getting black colored border ,i thought that is due to graph axisSet but i don't how to remove.
If what you're talking about is the border box that appears around the entire graph, I would say use this code after the statement [graph applyTheme:self.graphTheme];:
graph.plotAreaFrame.borderLineStyle = nil;
This removes the border completely from the graph area.