Add rounded corners on the bar chart #1066 #1917

Neral · 2016-12-05T06:50:57Z

Added ability to draw rounded corners on each bar.

By default rounded corners is disabled and to enable it isDrawRoundedBarEnabled should be used.
Also using barRoundingCorners could be decided which corners should be rounded (reference).

Feature: #1066

liuxuan30 · 2016-12-06T02:08:36Z

Great! Looks like my investigation and someone finally did it :) A corner case would be, if the bar is very thin, the rounded bar looks like a thin oval.. That's what I am not satisfied with the CG API

arronhunt · 2016-12-10T00:44:41Z

This is great, would be awesome if we could get these for candlestick charts as well :)

vinodha88 · 2017-01-03T23:23:21Z

Any idea when the rounded corner feature will be merged ? I am using cocoapods (pod 'Charts') in my app and wanted to check this patch .

liuxuan30 · 2017-01-04T01:39:17Z

No ETA, as @danielgindi is quite busy recently.
Besides, such feature needs to be considered for Android, so it usually take a very long time.

For those want to try out, you should use source code instead of carthage, pod. More flexible.

acegreen · 2017-02-17T17:21:17Z

@Neral Awesome work! Building on top of your work, I made cornerRadius a user input or default to half the barRect as you had it https://github.com/omsignal/Charts

acegreen · 2017-02-21T13:56:46Z

Noticed that we need to consider when the bar is stacked, currently it rounds all entries

acegreen · 2017-02-22T17:52:59Z

@Neral Also I noticed if the axisMinimum is not set to 0, the bottom corners don't show

gsolanki1509 · 2017-03-28T12:53:43Z

i couldn't find "isDrawRoundedBarEnabled" property for Bar chart.

I'm using Swift 3.0. Please let me know

liuxuan30 · 2017-03-29T02:16:20Z

this has not been merged yet. and why @gsolanki1509 you are reviewers...

liuxuan30 · 2017-04-10T01:55:47Z

Source/Charts/Renderers/BarChartRenderer.swift

-                context.stroke(barRect)
+                let cornerRadius = CGSize(width: barRect.width / 2.0, height: barRect.width / 2.0)
+                #if os(OSX)
+                    let bezierPath = NSBezierPath(roundedRect: barRect, xRadius: cornerRadius.width, yRadius: cornerRadius.height)


Just FYI, I came across API like CGPathCreateWithRoundedRect() and CGPathAddRoundedRect(), looks like we can replace the UIBezierPath APIs?

dominik-hadl · 2017-06-12T09:30:47Z

Source/Charts/Renderers/BarChartRenderer.swift

-                context.setStrokeColor(borderColor.cgColor)
-                context.setLineWidth(borderWidth)
-                context.stroke(barRect)
+                let cornerRadius = CGSize(width: barRect.width / 2.0, height: barRect.width / 2.0)


It would be nice if this was a property instead, so that we can specify a custom corner radius.

Kit-OS · 2017-09-08T11:59:15Z

It would be great that someone could merge this feature soon :)

vivianegon00 · 2017-09-11T18:57:11Z

is the rounded bars option coming soon? Like on the Apple's activity tracker app?

liuxuan30 · 2017-09-13T02:11:44Z

@vivianegon00 I think it's different. It's just bars with rounded corner.

vivianegon00 · 2017-09-13T20:38:05Z

@liuxuan30 that's exactly what I need, bars with rounded corners... this option is not available now

kacperios · 2017-10-17T13:24:36Z

any chance this will be merged soon ?

weet1 · 2017-11-13T15:44:47Z

@liuxuan30 a lot of people need need this function, is there any hope that it will merge? :)

liuxuan30 · 2017-11-15T02:34:45Z

I have said long time ago here, though it looks nice, but when bar becomes thinner, it will looks like oval instead of rounded bars, so it's kind of flaws. I'm not sure if there are any better solutions, so this is postponed. you guys are ok with thin bars?

juangz · 2017-12-11T12:56:50Z

This would be awesome to have!!! Needing this asap!!

jjatie · 2018-01-22T02:03:53Z

@liuxuan30 Looks like this is a heavily desired feature, and the author has abandoned the PR. Shall I reimplement this? I think the thin bar issue is fine. If a consumer doesn't like it they can turn off rounded corners.

liuxuan30 · 2018-01-23T02:24:27Z

@jjatie if thin bar is acceptable, then we can move forward. But I am still struggling with it, as when the bars become a little bit more, it will look more like an oval, which is not ideal.

We could first write a solid and flexible code base for this, and if we have better solutions, we can easily switch them. Don't be limited at my raw implementation about UIBezierPath(roundedRect: barRect, byRoundingCorners: dataSet.barRoundingCorners, cornerRadii: cornerRadius), maybe we could take a look at CGPathCreateWithRoundedRect() and CGPathAddRoundedRect()
and other possible solution.

diegopetrucci · 2018-02-01T13:41:16Z

Source/Charts/Charts/BarChartView.swift

@@ -180,4 +194,7 @@ open class BarChartView: BarLineChartViewBase, BarChartDataProvider

    /// - returns: `true` if drawing shadows (maxvalue) for each bar is enabled, `false` ifnot
    open var isDrawBarShadowEnabled: Bool { return drawBarShadowEnabled }
+
+    /// - returns: `true` if drawing rounded bars is enabled, `false` ifnot


ifnot typo

Source/Charts/Charts/CombinedChartView.swift

mikestalker · 2018-02-19T15:32:48Z

One year in review? Really?

liuxuan30 · 2018-02-20T01:43:59Z

@mikestalker it's open source and you have all the code you need. Either you could merge yourself or wait. At least you didn't pay me/us to do this, and we all have a job to do.

Besides I have said the implementation I found is not satisfying. You can contribute a better one rather than complain.

ravipxm · 2018-04-06T05:47:45Z

@liuxuan30 any ETA on this?

renatamakuch · 2018-05-08T10:12:10Z

+1

acegreen · 2018-09-07T11:58:58Z

@danielgindi @liuxuan30 almost 2 years in review?

mikestalker · 2018-09-07T12:15:46Z

@acegreen , @liuxuan30 already answered (=

@mikestalker it's open source and you have all the code you need. Either you could merge yourself or wait. At least you didn't pay me/us to do this, and we all have a job to do. Besides I have said the implementation I found is not satisfying. You can contribute a better one rather than complain.

liuxuan30 · 2018-09-19T07:10:09Z

Until a better solution emerge. As I said long time ago, this solution is not perfect (more bars, the oval become sharp). I don't think this is worth merging yet. I keep this open is some people could live with the defect. Use at your own risk

jjatie · 2019-03-09T17:23:33Z

#3754

Add rounded corners on the bar chart

ba56599

Fix rounded corners on the chart bar for macOS

2922a34

liuxuan30 added the ★★ label Feb 20, 2017

acegreen mentioned this pull request Feb 21, 2017

Rounding the corners of bars #1066

Open

gsolanki1509 approved these changes Mar 28, 2017

View reviewed changes

liuxuan30 requested a review from danielgindi April 10, 2017 01:56

liuxuan30 reviewed Apr 10, 2017

View reviewed changes

jacobminer added a commit to jacobminer/Charts that referenced this pull request Apr 21, 2017

Adding code from ChartsOrg#1917

ef02cd5

dominik-hadl reviewed Jun 12, 2017

View reviewed changes

ashokvadivelu approved these changes Jul 7, 2017

View reviewed changes

mrimadali approved these changes Aug 13, 2017

View reviewed changes

Kit-OS approved these changes Sep 8, 2017

View reviewed changes

mrimadali approved these changes Sep 18, 2017

View reviewed changes

liuxuan30 mentioned this pull request Oct 27, 2017

Barchart with rounded bar style #2912

Closed

liuxuan30 mentioned this pull request Nov 6, 2017

Adding corner radius on top of Bar #2924

Closed

tyforcode mentioned this pull request Dec 20, 2017

Border radius support wuxudong/react-native-charts-wrapper#110

Closed

jjatie self-assigned this Jan 18, 2018

jjatie added this to the Future milestone Jan 23, 2018

jjatie added a work in progress and removed ★★ labels Jan 23, 2018

diegopetrucci reviewed Feb 1, 2018

View reviewed changes

Source/Charts/Charts/CombinedChartView.swift Show resolved Hide resolved

liuxuan30 mentioned this pull request Jun 22, 2018

Add flag to render Bar chart with rounded Bars #3504

Closed

1 task

ghost mentioned this pull request Feb 25, 2019

[Stats Refresh] Round the bars in the Charts wordpress-mobile/WordPress-iOS#11144

Closed

jjatie closed this Mar 9, 2019

ChartsOrg locked and limited conversation to collaborators Mar 9, 2019

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Add rounded corners on the bar chart #1066 #1917

Add rounded corners on the bar chart #1066 #1917

Neral commented Dec 5, 2016

liuxuan30 commented Dec 6, 2016 •

edited

Loading

arronhunt commented Dec 10, 2016

vinodha88 commented Jan 3, 2017

liuxuan30 commented Jan 4, 2017

acegreen commented Feb 17, 2017 •

edited

Loading

acegreen commented Feb 21, 2017

acegreen commented Feb 22, 2017

gsolanki1509 commented Mar 28, 2017

liuxuan30 commented Mar 29, 2017 •

edited

Loading

liuxuan30 Apr 10, 2017

dominik-hadl Jun 12, 2017

Kit-OS commented Sep 8, 2017

vivianegon00 commented Sep 11, 2017

liuxuan30 commented Sep 13, 2017

vivianegon00 commented Sep 13, 2017

kacperios commented Oct 17, 2017 •

edited

Loading

weet1 commented Nov 13, 2017

liuxuan30 commented Nov 15, 2017 •

edited

Loading

juangz commented Dec 11, 2017

jjatie commented Jan 22, 2018

liuxuan30 commented Jan 23, 2018 •

edited

Loading

diegopetrucci Feb 1, 2018

mikestalker commented Feb 19, 2018

liuxuan30 commented Feb 20, 2018 •

edited

Loading

ravipxm commented Apr 6, 2018

renatamakuch commented May 8, 2018

acegreen commented Sep 7, 2018

mikestalker commented Sep 7, 2018

liuxuan30 commented Sep 19, 2018

jjatie commented Mar 9, 2019

Add rounded corners on the bar chart #1066 #1917

Add rounded corners on the bar chart #1066 #1917

Conversation

Neral commented Dec 5, 2016

liuxuan30 commented Dec 6, 2016 • edited Loading

arronhunt commented Dec 10, 2016

vinodha88 commented Jan 3, 2017

liuxuan30 commented Jan 4, 2017

acegreen commented Feb 17, 2017 • edited Loading

acegreen commented Feb 21, 2017

acegreen commented Feb 22, 2017

gsolanki1509 commented Mar 28, 2017

liuxuan30 commented Mar 29, 2017 • edited Loading

liuxuan30 Apr 10, 2017

Choose a reason for hiding this comment

dominik-hadl Jun 12, 2017

Choose a reason for hiding this comment

Kit-OS commented Sep 8, 2017

vivianegon00 commented Sep 11, 2017

liuxuan30 commented Sep 13, 2017

vivianegon00 commented Sep 13, 2017

kacperios commented Oct 17, 2017 • edited Loading

weet1 commented Nov 13, 2017

liuxuan30 commented Nov 15, 2017 • edited Loading

juangz commented Dec 11, 2017

jjatie commented Jan 22, 2018

liuxuan30 commented Jan 23, 2018 • edited Loading

diegopetrucci Feb 1, 2018

Choose a reason for hiding this comment

mikestalker commented Feb 19, 2018

liuxuan30 commented Feb 20, 2018 • edited Loading

ravipxm commented Apr 6, 2018

renatamakuch commented May 8, 2018

acegreen commented Sep 7, 2018

mikestalker commented Sep 7, 2018

liuxuan30 commented Sep 19, 2018

jjatie commented Mar 9, 2019

liuxuan30 commented Dec 6, 2016 •

edited

Loading

acegreen commented Feb 17, 2017 •

edited

Loading

liuxuan30 commented Mar 29, 2017 •

edited

Loading

kacperios commented Oct 17, 2017 •

edited

Loading

liuxuan30 commented Nov 15, 2017 •

edited

Loading

liuxuan30 commented Jan 23, 2018 •

edited

Loading

liuxuan30 commented Feb 20, 2018 •

edited

Loading