Create a MarkerView when user clicks on Chart

Question

I have searched and searched for how to display the MarkerView when the user clicks on a bar in a bar chart using Charts (was iOS-charts) for Swift.

The documentation states the library is capable of "Highlighting values (with customizable popup-views)" using MarkerViews, but I don't know how to show one.

I want a little tool tip to display, like the image below, when the user clicks on a bar in the bar chart.

Tool tip on bar graph:

I have the chartValueSelected function ready which fires when a bar is selected.

Answer 1

So you are using Charts right?

Did you check BallonMarker.swift?

/ChartsDemo/Classes/Components/BallonMarker.swift

Swift

let marker:BalloonMarker = BalloonMarker(color: UIColor.redColor(), font: UIFont(name: "Helvetica", size: 12)!, insets: UIEdgeInsets(top: 7.0, left: 7.0, bottom: 7.0, right: 7.0))
marker.minimumSize = CGSizeMake(75.0, 35.0)
chartView.marker = marker

Swift 3 Update

let marker:BalloonMarker = BalloonMarker(color: UIColor.black, font: UIFont(name: "Helvetica", size: 12)!, textColor: UIColor.white, insets: UIEdgeInsets(top: 7.0, left: 7.0, bottom: 7.0, right: 7.0))
marker.minimumSize = CGSize(width: 75.0, height: 35.0)
chartView.marker = marker

Objective-C

BalloonMarker *marker = [[BalloonMarker alloc] initWithColor:[UIColor colorWithRed:14.0/255.0 alpha:1.0] font:[UIFont systemFontOfSize:12.0] insets: UIEdgeInsetsMake(7.0, 7.0, 7.0, 7.0)];
marker.minimumSize = CGSizeMake(75.f, 35.f);
_chartView.marker = marker;

Answer 2

Swift chart library with Objective C code will be something like this.. I am here just showing some code snippets.

1. ChartViewController.m

   -(void)initializeChart {
   
       //chart specifications will go here 
       ...
       ...
   
       //set balloon marker to the chart
       BalloonMarker *marker = [[BalloonMarker alloc]
                        initWithColor: kColorBrown1
                        font: [UIFont systemFontOfSize:12.0]
                        textColor: UIColor.whiteColor
                        insets: UIEdgeInsetsMake(8.0, 8.0, 20.0, 8.0)];
       marker.chartView = chartView;
       marker.minimumSize = CGSizeMake(80.f, 40.f);
       chartView.marker = marker;
   }
   

2. BalloonMarker.swift

   import Charts
   
   ...
   
   ...
   
   //This method will be called when ever user clicks on a chart to refresh the marker text. You need to specify the value here.
   
   open override func refreshContent(entry: ChartDataEntry, highlight: Highlight)
   
   {  
       setLabel(entry.y!)        
   }
   

Answer 3

Even after adding the BalloonMarker to the chart if the markers are not displayed make sure that the markers are enabled on the chart view

chartView.drawMarkers = true

highlighting is enabled on the chart data set. This is should be done after you assign the chart data set.

chartView.data?.highlightEnabled = true