Add cornerRadius to vertical highlighter line and draw circle only on highlight

[rameswarprasad]

@liuxuan30 I want to add a cornerRadius to the highlighter and draw only a circle wherever the highlighter intersects with the data point on a Line Chart.

Following your conversation on #2391 I wrote the below code but unable to get it working. Can you please give me a direction on how to do that, which classes to override and which objects to map the derived classes to.

I'm not completely sure of LineChartRenderer is the right class to be overridden or ChartHighlighter.
Can you please help.

class CustomLineChartRenderer: LineChartRenderer {
    override func drawHighlightLines(context: CGContext, point: CGPoint, set: ILineScatterCandleRadarChartDataSet) {
        guard let
            viewPortHandler = self.viewPortHandler
            else { return }
        
        // draw vertical highlight lines
        if set.isVerticalHighlightIndicatorEnabled
        {
            // Size of rounded rectangle
            let rectWidth = set.highlightLineWidth
            let rectHeight = CGFloat(abs(viewPortHandler.contentBottom - viewPortHandler.contentTop))

            // Find center of actual frame to set rectangle in middle
            let xf:CGFloat = rectWidth  / 2
            let yf:CGFloat = rectHeight / 2
            
            let rectCornerRadius: CGFloat = 3
            let rect = CGRect(x: xf, y: yf, width: rectWidth, height: rectHeight)
            let clipPath: CGPath = UIBezierPath(roundedRect: rect, cornerRadius: rectCornerRadius).cgPath

            context.beginPath()
//            context.move(to: CGPoint(x: point.x, y: viewPortHandler.contentTop))
//            context.addLine(to: CGPoint(x: point.x, y: viewPortHandler.contentBottom))
            context.addPath(clipPath)
            context.strokePath()
        }
        
        // draw horizontal highlight lines
        if set.isHorizontalHighlightIndicatorEnabled
        {
            context.beginPath()
            context.move(to: CGPoint(x: viewPortHandler.contentLeft, y: point.y))
            context.addLine(to: CGPoint(x: viewPortHandler.contentRight, y: point.y))
            context.strokePath()
        }
    }
}

[liuxuan30]

I don't know what's "Add cornerRadius to vertical highlighter ", it's just a thin line, I don't think cornerRadius would work. use CGLineCap.round maybe.

take a look at open override func drawHighlighted() and draw a circle in it. draw circles can refer drawCircles() in line chart renderer

[rameswarprasad]

Worked like charm.
So yeah the vertical highlighter is a thin line but I was talking about when the highlighter line width is 5 or more. Used CGLineCap.round to make the edges round, just had to adjust the top & bottom Y values otherwise it was going beyond the chart view and hence was not visible.

You guys are awesome. Is there any way I can contribute to this library. I read the wiki on the android repo.

[liuxuan30]

ofc, just fix any issue you found or what feature/enhancements you think worthy adding in. the review may take longer, as we don't have enough people on this, so it kinds of slow in terms of adding new features, especially syncing between iOS and android. but for bugfix or swift related, it can be faster as we are able to merge without involving feature reviews.

[YuriiHerasymchuk]

Thanks, I followed everything and It worked
But I need to extend highlight on "01 JUL" as well. When I draw a line longer, superview just cut it. I probably need to change value of "Clip to bound", but I'm not sure where I can do it