Open DatL4g opened 5 years ago
Hello @DATL4G,
Do you mean something like the image below?
@marjan-georgiev What do you think about this feature?
It's an interesting idea, but we need to consider all the configurations of the pie chart (i.e. doughut, explode slices, etc.) If we want to support all of these cases, a single circle wouldn't be enough. Each pie slice would need to have a slightly bigger element behind it, but we can't put it in the pie component because it would overlap other slices. We would need to add a second pie-series.
You are right, just tested this simple border feature with the explode slices and the result is not great as one should expect. Probably the better approach would be either the second pie-series which would impact the performance of rendering the chart or simply put the border for each slice. The last one is a bit ugly in the sense of having internal borders between each slice gap but who knows, some users would like that too...
I'm glad to hear you might want to implement that.
To the picture: I would leave a little space between the circle and the chart, but I would also be satisfied without the spacing
I'm submitting a ... (check one with "x")
ngx-charts
tag) or the gitter chat for support questionsCurrent behavior
Add a feature to display a border around the pie chart, so it looks like its circled (optional). Current way is to surrend it with a div and give it a class with border-styles, but the div doesn't auto-size so you have to define the height and width by yourself and if your chart has view parameters 150x150, the div width and height needs to be something like 150 - 155
Expected behavior
The circle around the pie-chart would have the right width and height. Because of that it would look better overall.
Reproduction of the problem
What is the motivation / use case for changing the behavior?
Looks better when e.g.: -2 slices, first color: red, second color: transparent So you only see one slice and its a bit confusing.
Please tell us about your environment:
Windows10 Visual Studio Yarn localhost:4200
ngx-charts version: 10.1.0
Angular version: 7.2.14
Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]
Language: [all | TypeScript X.X | ES6/7 | ES5]