-
Notifications
You must be signed in to change notification settings - Fork 11.9k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Support background colour for radial scale point labels #5085
Comments
To someone who wants to implement this, would need to draw a background rectangle just before https://github.com/chartjs/Chart.js/blob/master/src/scales/scale.radialLinear.js#L278 |
@etimberg Thank you so much for your feedback. |
I think drawing the rectangle should be as simple as |
@etimberg I have tried but and this is what I got
I really appreciate if someone goes to test these codes and give me some advice (bow) |
var size = scale._pointLabelSizes[i];
fillRoundRect(ctx, pointLabelPosition.x -(size.w / 2), pointLabelPosition.y - (size.h / 2), size.w, size.h, 15) To change the colour you can do:
|
Thank you so much for your support @etimberg |
Hi, Thank you so much for this! I can't, however, get the backgrounds colored, and also not get the backgrounds in the shape that @spideyinf had, nor in the centred position as described by @etimberg. I attach image and code, inserted between these two lines (in v2.7.2, bundle):
and
Here's the code:
Really grateful for any help. Vidar |
@ninjaklas the issue I think is that in the current code, the These two lines get the canvasTextAlign and adjust the height. You should adjust the height and then use the following code based on the alignment
|
Thank you so much @etimberg, exactly what I needed! With some additional tweaks I now got the positioning exactly where I wanted it. |
@kyracriteria I don't have updated code, but it should be a lot easier now. You can call |
Happy holiday,
I just want to ask for an option to add the background color (a rounded rect with bg color) for labels (individually) in Chartjs. Is there any callback that I can apply for changing this, any help is appreciated with best regards!
This is the demo
![others radar chart js sample 2017-12-27 15-27-06](https://user-images.githubusercontent.com/14868943/34376086-91ecade2-eb1c-11e7-8b25-af02963b64e7.png)
The text was updated successfully, but these errors were encountered: