Add option to allow square legend symbols at different sizes

[soniiic]

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

[etimberg]

@soniiic thanks for PR this. I haven't looked too deeply yet. Would it be easier to simply create a boxHeight param? It's a bit more general but might cover more use cases.

@simonbrunel thoughts?

[simonbrunel]

I agree, boxHeight is more flexible and in line with boxWidth, so I would tend to that solution as well. We also need to think the API to be consistent with #4496, #4638 and #4811 (and certainly other related requests)

[soniiic]

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

[etimberg]

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

[dan-sc]

Ok, I'll have a go at those

[simonbrunel]

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;

[simonbrunel]

Do we need to handle labelOpts.usePointStyle as in getBoxWidth()? or is it unrelated?

[benmccann]

@dan-schoolcomms will you be able to address Simon's comments?

[soniiic]

@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.

[etimberg]

Closing due to inactivity