-
Notifications
You must be signed in to change notification settings - Fork 12k
Add option to allow square legend symbols at different sizes #4890
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
Conversation
If the useSquareBox option is set to true, the height is set to the same as the boxWidth option. It places it vertically central to the label. It also ensures the legend symbol never exceeds the size of the font size.
@soniiic thanks for PR this. I haven't looked too deeply yet. Would it be easier to simply create a @simonbrunel thoughts? |
Thanks for your consideration. My requirement was that it was square but I agree that adding boxHeight would allow more general usage. I have updated the code to allow the user to assign boxHeight in the label options Demo updated: https://codepen.io/soniiic/pen/zEgrGb |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Thanks for updating to a boxHeight
option! Is it possible to add unit tests for this? Also, could you update the docs in https://github.com/chartjs/Chart.js/blob/master/docs/configuration/legend.md
Ok, I'll have a go at those |
} | ||
|
||
function getBoxHeight(labelOpts, fontSize) { | ||
return labelOpts.boxHeight ? |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
If we consider 0
a valid height (which I think is), then:
return helpers.isNullOrUndef(options.boxHeight) ? options.boxHeight : fontSize;
else this can be simplified as:
return options.boxHeight || fontSize;
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Do we need to handle labelOpts.usePointStyle
as in getBoxWidth()
? or is it unrelated?
@dan-schoolcomms will you be able to address Simon's comments? |
@benmccann Sorry for not keeping on top of this. Adding the unit tests would require me getting a development environment set up which at the moment I do not have as I have just made the edit within github itself. At the moment I don't have the time to do this, but I will see if I can get an hour or two to start it to see how far I get. |
Closing due to inactivity |
If the useSquareBox option is set to true, the height is set to the same as the boxWidth option. It places it vertically central to the label. It also ensures the legend symbol never exceeds the size of the font size.
Demo: https://codepen.io/soniiic/pen/zEgrGb