Same color for Line chart's line and point label

7 posts, 1 answers
  1. Viresh
    Viresh avatar
    5 posts
    Member since:
    Feb 2015

    Posted 03 Mar 2015 Link to this post

    How can i configure a line series to have the same color for the line and the data point label?
  2. Adrian
    Admin
    Adrian avatar
    167 posts

    Posted 04 Mar 2015 Link to this post

    Hello Viresh,

    Thank you for contacting us.

    To use same color for the line series and its point label's text you should get the TKChartPaletteItem  for the line series after you add it to the chart and then set the textColor property of TKChartPointLabelStyle. Please consider the following code snippet:
    [_chart addSeries:lineSeries];
         
    TKChartPaletteItem *item = [_chart paletteItemForSeries:lineSeries atIndex:lineSeries.index];
    lineSeries.style.pointLabelStyle.textColor = [item.stroke color];

    I hope this helps. I will be glad to assist you if you have further questions.

    Regards,
    Adrian
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
  3. DevCraft banner
  4. Viresh
    Viresh avatar
    5 posts
    Member since:
    Feb 2015

    Posted 12 Mar 2015 in reply to Adrian Link to this post

    Its not working, I always get lineSeries.index as 0 even if I have multiple line serieses.
  5. Answer
    Adrian
    Admin
    Adrian avatar
    167 posts

    Posted 13 Mar 2015 Link to this post

    Hello Viresh,

    I wasn't able to reproduce an issue where the index of  line series is always 0 after the series is added to the chart. May be there is something specific in your project. It would be great if you can send us a sample code where the issue can be reproduced so we can investigate it further. The code snippet below demonstrates how you can create 3 line series that have same color for the line and the point labels text color:
    TKChartPaletteItem *item = nil;
    TKChartLineSeries *line = [[TKChartLineSeries alloc] initWithItems:dataPoints];
    [_chart addSeries:line];
    item = [_chart paletteItemForSeries:line atIndex:line.index];
    line.style.pointLabelStyle.textColor = item.stroke.color;
    line.style.pointLabelStyle.textHidden = NO;
         
    TKChartLineSeries *line1 = [[TKChartLineSeries alloc] initWithItems:dataPoints1];
    [_chart addSeries:line1];
    item = [_chart paletteItemForSeries:line1 atIndex:line1.index];
    line1.style.pointLabelStyle.textColor = item.stroke.color;
    line1.style.pointLabelStyle.textHidden = NO;
         
    TKChartLineSeries *line2 = [[TKChartLineSeries alloc] initWithItems:dataPoints2];
    [_chart addSeries:line2];
    item = [_chart paletteItemForSeries:line2 atIndex:line2.index];
    line2.style.pointLabelStyle.textColor = item.stroke.color;
    line2.style.pointLabelStyle.textHidden = NO;

    Another option to achieve the same is to adopt TKChartDelegate protocol and implements its chart:labelForDataPoint:inSeries:atIndex: method and return point label with the desired text color. Please consider the code snippet:
    - (TKChartPointLabel *)chart:(TKChart *)chart labelForDataPoint:(id<TKChartData>)dataPoint inSeries:(TKChartSeries *)series atIndex:(NSUInteger)dataIndex
    {
        TKChartPaletteItem *item = [chart paletteItemForSeries:series atIndex:series.index];
        TKChartPointLabelStyle *style = series.style.pointLabelStyle;
        style.textColor = item.stroke.color;
        TKChartPointLabel *pointLabel = [[TKChartPointLabel alloc] initWithPoint:dataPoint style:style text:[NSString stringWithFormat:@"%@", dataPoint.dataYValue]];
        return pointLabel;
    }

    I hope this helps. Should you have further questions do not hesitate to contact us.

    Regards,
    Adrian
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
  6. Viresh
    Viresh avatar
    5 posts
    Member since:
    Feb 2015

    Posted 16 Mar 2015 in reply to Adrian Link to this post

    It is still not working, what i want is the point label fill color to the same color as of line. But I think problem is when I am selecting a line then only i will show the point label for that selected line, and after selecting a line , line color becomes black which is causing point label fill color also to be turned black. How can i retain the same color for the line even after selecting it and how can i have this color for line's point label fill color as well.

    Here is my code:

    self.chartView.selectionMode=TKChartSelectionModeSingle;
            NSMutableSet *temp=[[NSMutableSet alloc] init];
            NSMutableArray *dataPointsCollection=[NSMutableArray array];
            NSMutableArray *allSeries=[[NSMutableArray alloc]init];
            for(int i=0;i<self.dashBoardDataPoints.count;i++)
            {
                NSMutableArray *dataPoints=[NSMutableArray array];
                //For multiple lines in a chart. 'DashboardData' is my custom class holding line's data for respective category
                DashboardData *data=self.dashBoardDataPoints[i];
                for(int j=0;j<self.dataCategories.count;j++)
                {
                    TKChartDataPoint *dataPoint = [[TKChartDataPoint alloc] initWithX:self.dataCategories[j] Y:data.datapointCount[j]];
                    [dataPoints addObject:dataPoint];
                    [temp addObject:data.datapointCount[j]];
                }
                [dataPointsCollection addObject:dataPoints];
                TKChartLineSeries* series = [[TKChartLineSeries alloc] initWithItems:dataPoints];
                series.selectionMode = TKChartSeriesSelectionModeSeries;
                series.style.pointShape = [TKPredefinedShape shapeWithType:TKShapeTypeCircle andSize:CGSizeMake(8, 8)];
                
                series.style.pointLabelStyle.layoutMode = TKChartPointLabelLayoutModeManual;
                series.style.pointLabelStyle.labelOffset = UIOffsetMake(0, -15);
                series.style.pointLabelStyle.insets = UIEdgeInsetsMake(-1, -5, -1, -5);
                series.style.pointLabelStyle.font = [UIFont fontWithName:@"Verdana" size:10];
                series.style.pointLabelStyle.textAlignment = NSTextAlignmentCenter;
                series.title=data.Name;
                [allSeries addObject:series];
                TKChartPaletteItem *item = [self.chartView paletteItemForSeries:series atIndex:series.index];
                //I want the point label fill color to be the line color
                series.style.pointLabelStyle.fill = [TKSolidFill solidFillWithColor:item.stroke.color];
                series.style.pointLabelStyle.textColor = [UIColor whiteColor];
            }

  7. Viresh
    Viresh avatar
    5 posts
    Member since:
    Feb 2015

    Posted 17 Mar 2015 in reply to Viresh Link to this post

    figured out the problem, its working now. Thanks :-)
  8. Jack
    Admin
    Jack avatar
    2335 posts

    Posted 18 Mar 2015 Link to this post

    Hi Viresh,

    Thank you for this update. We are glad to hear that the issue is solved now. Please, do not hesitate to contact us if you need further assistance. 

    Regards,
    Jack
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
Back to Top
DevCraft banner