'chartjs V3 align legend text

how to align the legend text to center this is what I have now:

enter image description here

as you can see the text is not vertically align to center and I dont find any way to do that

this is my options

 options.plugins.legend= {
      position: "top",
      align: "start",
      labels: {
        boxWidth: 14,
        boxHeight: 14,
        color: "black",
        usePointStyle: true,
        radius: 55,
        textAlign: "center",
        font: {
          size: 11,
          family: "Roboto",
        },
      },
    }
chart.js


Solution 1:[1]

so I found a solution that is to change the svgs code from

 <svg width="14" height="14" viewBox="0 0 14 14"...

to

<svg width="16" height="16" viewBox="0 0 16 16"...

and now text aligned

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 elad BA

Related Questions