Rounded Bars
kevincobain2000 opened this issue · comments
Is there a way to make the bars more rounded?
Like below:
Sorry, it is not supported.
@kevincobain2000 Maybe you can try charts-rs, web demo: https://charts.npmtrend.com/
Thanks, yes I have looked at the rust implementation. Wanted something in Go and our base project is written in Go.
It'd be nice if it could be supported tho. Any thoughts on supporting this in future?
github.com/wcharczuk/go-chart only supports these draw functions, I think drawing rounded rect is difficult.
// MoveTo moves the cursor to a given point.
MoveTo(x, y int)
// LineTo both starts a shape and draws a line to a given point
// from the previous point.
LineTo(x, y int)
// QuadCurveTo draws a quad curve.
// cx and cy represent the bezier "control points".
QuadCurveTo(cx, cy, x, y int)
// ArcTo draws an arc with a given center (cx,cy)
// a given set of radii (rx,ry), a startAngle and delta (in radians).
ArcTo(cx, cy int, rx, ry, startAngle, delta float64)
@vicanso I had a while ago made a fork of your project to address the x-axis improvements previously provided in PR.
I decided to add this requested feature using a circle draw method: go-analyze/charts#11
I wanted to mention it in case you want to backport the feature.
Any thoughts on adding this @vicanso
Thanks
@kevincobain2000 Please use the latest version.
// custom option func
func(opt *charts.ChartOption) {
opt.SeriesList[1].RoundRadius = 10
opt.SeriesList[1].MarkPoint = charts.NewMarkPoint(
charts.SeriesMarkDataTypeMax,
charts.SeriesMarkDataTypeMin,
)
opt.SeriesList[1].MarkLine = charts.NewMarkLine(
charts.SeriesMarkDataTypeAverage,
)
},You are cool. Thanks!!
@vicanso I like your strategy of drawing an arc, however this results in the bottom of the bars also being curved. Maybe we should draw a box at the bottom to square it off? Overall this may be a better option than my solution of drawing the background if the circle overlaps past the axis.
Yes, It should support a four position radius setting.
Is this supported in horizontal_bar_chart?
@abhijitpawar12 The latest version supports now.
@vicanso Thank you
One more thing is there any way to change the default color of the horizontal bar charts bar ,I am trying but not getting way to do that,
One issue I am seeing when I use below code to generate horizontal bar chart then if we have more than or less than 6 countries then alignment is not proper (see attached image)
`charts.NewHorizontalBarChart(p, charts.HorizontalBarChartOption{
Padding: charts.Box{
Top: 10,
Right: 10,
Bottom: 10,
Left: 10,
},
SeriesList: seriesList,
Title: charts.TitleOption{
Text: "World Population",
},
YAxisOptions: charts.NewYAxisOptions([]string{
"Brazil",
"Indonesia",
"USA",
"India",
"China",
"World",
}),
BarHeight: 30,
}).Render()
`
- Add theme:
charts.AddTheme("myTheme",....), https://github.com/vicanso/go-charts/blob/main/theme.go#L124 - Set the chart's theme:
func(opt *charts.ChartOption) {
opt.Theme = "myTheme"
},
- Add theme:
charts.AddTheme("myTheme",....), https://github.com/vicanso/go-charts/blob/main/theme.go#L124- Set the chart's theme:
func(opt *charts.ChartOption) { opt.Theme = "myTheme" },
@vicanso where to add this theme ?
I am trying to add like below :
`
p, err := charts.HorizontalBarRender(
values,
charts.PaddingOptionFunc(charts.Box{
Top: 20,
Right: 40,
Bottom: 20,
Left: 20,
}),
charts.YAxisDataOptionFunc([]string{
"sim_rule_1567",
"sim_rule_1568",
"sim_rule_1569",
"sim_rule_1570",
"sim_rule_1571",
"sim_rule_15672",
"sim_rule_15673",
"sim_rule_15674",
"sim_rule_15675",
"sim_rule_15676",
}),
charts.ThemeOptionFunc("light"),
func(opt *charts.ChartOption) {
for i := range opt.SeriesList {
opt.SeriesList[i].Label.Show = true
//opt.SeriesList[i].RoundRadius = 10
//Set the color for each bar
//opt.SeriesList[i].Style = charts.Style{StrokeColor: drawing.ColorRed}
}
},
func(opt *charts.ChartOption) {
opt.Theme = "myTheme"
},
)
`
func init() {
charts.addTheme("myTheme", ...);
}@vicanso It worked thanks
Do you know how to customise space between two bars
`p, err := charts.HorizontalBarRender(
values,
//charts.TitleTextOptionFunc("World Population"),
charts.PaddingOptionFunc(charts.Box{
Top: 20,
Right: 40,
Bottom: 20,
Left: 20,
}),
charts.YAxisDataOptionFunc([]string{
"Application Rule 6",
"Application Rule 7",
"Application Rule 8",
}),
//charts.ThemeOptionFunc("light"),
func(opt *charts.ChartOption) {
for i := range opt.SeriesList {
opt.SeriesList[i].Label.Show = true
opt.SeriesList[i].RoundRadius = 10
}
opt.Theme = "mytheme"
opt.BarHeight = 30
}`
It does not support margin setting of bars
Thank you very much for your help.
@vicanso Are there any plan to give support for that in near future?
@abhijitpawar12 opt.BarMargin is supported now.
@vicanso
I tried with below code but this is not working
p, err := charts.HorizontalBarRender(
values,
//charts.TitleTextOptionFunc("World Population"),
charts.PaddingOptionFunc(charts.Box{
Top: 20,
Right: 40,
Bottom: 20,
Left: 20,
}),
charts.YAxisDataOptionFunc([]string{
"Application Default Rule 1",
"Application Default Rule 2",
}),
//charts.ThemeOptionFunc("light"),
func(opt *charts.ChartOption) {
for i := range opt.SeriesList {
opt.SeriesList[i].Label.Show = true
opt.SeriesList[i].RoundRadius = 10
opt.BarWidth = 10
}
opt.Theme = "mytheme"
opt.BarHeight = 20
opt.BarMargin = 30
},
)
@vicanso Can you please check if I am missing anything here as it is not getting reflected
Bar margin is set successfully. Please don't set it too big.
opt.BarMargin = 1:
opt.BarMargin = 3:
Maybe you should set opt.Height = 800 a larger value first.
Tried by setting opt.Height=800 but still it is not working
p, err := charts.HorizontalBarRender(
values,
//charts.TitleTextOptionFunc("World Population"),
charts.PaddingOptionFunc(charts.Box{
Top: 20,
Right: 40,
Bottom: 20,
Left: 20,
}),
charts.YAxisDataOptionFunc([]string{
"Application Default Rule 1",
"Application Default Rule 2",
}),
//charts.ThemeOptionFunc("light"),
func(opt *charts.ChartOption) {
for i := range opt.SeriesList {
opt.SeriesList[i].Label.Show = true
opt.SeriesList[i].RoundRadius = 10
opt.BarWidth = 10
}
opt.Theme = "mytheme"
opt.BarHeight = 20
opt.Height = 800
opt.BarMargin = 3
},
