[英]iOS-Charts - Make a bar chart and field remaning with other color
I am trying to make a chart exactly as the guide lines of the designer but i am difficulty's in 3 of the things. 我正在尝试制作与设计人员指南完全相同的图表,但我在这三件事上遇到了困难。
This is the guide lines: 这是指导方针:
And this is what i have done: 这就是我所做的:
As you can see it was supposed that the red bar had between self and the target a blue bar. 如您所见,假定红色条在自身和目标之间有一个蓝色条。 Already try to create a second bar to see if stays behind but that did not work.
已经尝试创建第二个栏,以查看是否仍在后面,但这不起作用。 This is what I tryed
这就是我尝试过的
BarChartDataSet *set2 = [[BarChartDataSet alloc] initWithYVals:yVals label:@""];
And then filed with blue bars with heigh of target. 然后提起蓝色标靶。 But din't work so i have remove that.
但是没有用,所以我已经删除了。
Other problem is the left axis labels it starts in zero, and did find way to work around. 另一个问题是左轴标签从零开始,并且确实找到了解决方法。
The third and last problem is that the T for target stays over the line when the expected was to be after the line. 第三个也是最后一个问题是,当预期值位于行之后时,目标的T会保持在行上方。
This is the code that used to obtain the chart: 这是用于获取图表的代码:
/*
* Method to render the graphic of a given KPI
*
* @param chartView BarChartView object type
* @param array NSMutableArray with array of dictionaries
* @param target double with target value
* @param granularity NSString ("Monthly", "weekly" or "daily")
*
* @return id BarCartView
*/
- (id)graphicRenderIn:(BarChartView*)chartView
withData:(NSMutableArray*)array
target:(double) target
andGranularity:(NSString*)granularity{
_chartView = chartView;
[_chartView setUserInteractionEnabled:NO];
// chartView setup
_chartView.delegate = self;
_chartView.descriptionText = @"";
_chartView.noDataTextDescription = @"You need to provide data for the chart.";
_chartView.maxVisibleValueCount = 60;
_chartView.pinchZoomEnabled = NO;
_chartView.drawBarShadowEnabled = NO;
_chartView.drawGridBackgroundEnabled = NO;
_chartView.backgroundColor = [UIColor green_title];
// Ox axis setup
ChartXAxis *xAxis = _chartView.xAxis;
xAxis.labelPosition = XAxisLabelPositionBottom;
xAxis.spaceBetweenLabels = 0.0;
xAxis.drawGridLinesEnabled = NO;
xAxis.axisLineColor = [UIColor turqoise];
xAxis.labelTextColor = [UIColor white_100];
xAxis.labelFont = [UIFont Caption1];
_chartView.leftAxis.drawGridLinesEnabled = NO;
_chartView.rightAxis.drawGridLinesEnabled = NO;
_chartView.rightAxis.enabled = NO;
_chartView.legend.enabled = NO;
// Oy axis setup
ChartYAxis *leftAxis = _chartView.leftAxis;
leftAxis.labelFont = [UIFont Caption1];
leftAxis.labelTextColor = [UIColor white_100];
leftAxis.labelCount = 3;
leftAxis.labelPosition = YAxisLabelPositionInsideChart;
leftAxis.spaceTop = 0.15;
leftAxis.axisLineColor = [UIColor turqoise];
// define TARGET line in graphic
[leftAxis removeAllLimitLines];
[self updateTargetLine:target];
[leftAxis addLimitLine:_line];
// set data values
[self setDataCount:array target:target andGranularity:granularity];
[_chartView animateWithYAxisDuration:2.5];
return self;
}
/*
* Method to setup the horizontal target line
*
* @param target double with target value
*
* @return void
*/
- (void) updateTargetLine:(double) target
{
// single target line
if (_line == nil)
{
ChartLimitLine *targetLine = [[ChartLimitLine alloc] initWithLimit:target label:@""];
_line = targetLine;
}
// target line setup
if (target != 0 )
{
_line.label = @"T";
}
_line.lineWidth = 0.8;
_line.lineColor = [UIColor app_blue];
_line.labelPosition = ChartLimitLabelPositionRight;
_line.valueFont = [UIFont systemFontOfSize:10.0];
}
/*
* Method to setup data for the BarChart graphic
*
* @param array NSMutableArray with array of dictionaries
* @param target double with target value
* @param granularity NSString ("Monthly", "weekly" or "daily")
*
* @return void
*/
- (void)setDataCount:(NSMutableArray*)array target:(double)target andGranularity:(NSString *)granularity
{
NSInteger arraySize = [array count];
NSMutableArray *arrayOy = [[NSMutableArray alloc] initWithCapacity:0];
NSMutableArray *arrayOx = [[NSMutableArray alloc] initWithCapacity:0];
// get array of values(arrayOy) and keys(arrayOx) from
for (NSDictionary *elem in array) {
[arrayOy addObject: [elem objectForKey:@"value" ]];
[arrayOx addObject:[elem objectForKey:@"date"]];
}
NSMutableArray *yVals = [[NSMutableArray alloc] init];
NSMutableArray *arrColor = [[NSMutableArray alloc] init];
for(int i = 0; i < arraySize; i++)
{
double val = [[arrayOy objectAtIndex:i]doubleValue];
[yVals addObject:[[BarChartDataEntry alloc] initWithValue:val xIndex:i+1]];
if (val < target ) {
[arrColor addObject:[UIColor red_bar]];
}else{
[arrColor addObject:[UIColor green_bar]];
}
}
// Ox label values depends on granularity
NSMutableArray *xVals = [[NSMutableArray alloc] init];
[xVals addObject:@""]; // empty value to creat padding from the end
for (int i = 0; i < arraySize; i++)
{
// Formatting Ox axis labels concerning data and granularity
NSDate* date = [NSDate dateWithTimeIntervalSince1970:[[arrayOx objectAtIndex:i] doubleValue]];
NSDateFormatter *formatter = [[NSDateFormatter alloc] init];
if ([granularity isEqualToString:@"dayly"] ) {
[formatter setDateFormat:@"HH:mm"];
}else{
[formatter setDateFormat:@"dd/MM"];
}
[xVals addObject:[formatter stringFromDate:date]];
}
[xVals addObject:@""]; // empty value to creat padding from the end
BarChartDataSet *set1 = [[BarChartDataSet alloc] initWithYVals:yVals label:@""];
[set1 setColors:(arrColor)];
[set1 setBarSpace: 0.90]; // creat a space between of each bar 90%
set1.drawValuesEnabled = NO;
NSMutableArray *dataSets = [[NSMutableArray alloc] init];
[dataSets addObject:set1];
BarChartData *data = [[BarChartData alloc] initWithXVals:xVals dataSets:dataSets];
_chartView.data = data;
}
What's your ios-charts version? 您的ios图表版本是什么? I guess the blue bar is there when you highlight the red bar?
我猜当您突出显示红色条时,蓝色条在那里? It should be solved if it is only can be seen when you highlight it in latest version.
如果仅当您在最新版本中突出显示它时,才能解决该问题。
For Q2, each yAxis has a property called startAtZeroEnabled
. 对于Q2,每个yAxis都有一个名为
startAtZeroEnabled
的属性。 Do whatever you like. 做任何你喜欢的事。
For Q3, in latest code, the limit line label has more position options. 对于第三季度,在最新代码中,限制线标签具有更多位置选项。 Another way is you can try write your own position in yAxis renderer's renderLimitLine function
另一种方法是您可以尝试在yAxis渲染器的renderLimitLine函数中编写自己的位置
This is what i used for the chart. 这就是我用于图表的内容。 Your answer helped me a lot!
您的回答对我很有帮助!
func setChart(dataPoints: [String], values: [Double]) {
barChartView.noDataText = "You need to provide data for the chart"
var dataEntries: [BarChartDataEntry] = []
for i in 0..<dataPoints.count {
let dataEntry = BarChartDataEntry(value: values[i], xIndex: i)
dataEntries.append(dataEntry)
}
let chartDataSet = BarChartDataSet(yVals: dataEntries, label: "")
let chartData = BarChartData(xVals: months, dataSet: chartDataSet)
barChartView.data = chartData
barChartView.descriptionText = ""
chartDataSet.colors = [UIColor(red: 1, green: 1, blue: 1, alpha: 1)]
barChartView.xAxis.drawGridLinesEnabled = false
barChartView.xAxis.drawLabelsEnabled = false
barChartView.xAxis.labelWidth = 3
barChartView.xAxis.axisLineWidth = 1
barChartView.xAxis.labelTextColor = UIColor.whiteColor()
barChartView.xAxis.axisLineColor = UIColor.whiteColor()
barChartView.xAxis.labelPosition = .Bottom
barChartView.rightAxis.enabled = false
//barChartView.xAxis.labelTextColor = UIColor.whiteColor()
barChartView.drawBarShadowEnabled = false
barChartView.leftAxis.drawGridLinesEnabled = false
barChartView.leftAxis.enabled = true
barChartView.leftAxis.axisLineColor = UIColor.whiteColor()
barChartView.leftAxis.labelTextColor = UIColor.whiteColor()
barChartView.leftAxis.labelCount = 4
barChartView.leftAxis.axisLineWidth = 1
barChartView.legend.enabled = false
//barChartView.borderLineWidth
}
this is what i got: https://www.dropbox.com/s/uskvwcbq3mlaf9o/Screen%20Shot%202016-04-25%20at%2017.14.36.png?dl=0 这就是我得到的: https : //www.dropbox.com/s/uskvwcbq3mlaf9o/Screen%20Shot%202016-04-25%20at%2017.14.36.png?dl=0
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.