Legend labels pointStyle for pie partially not working?

[lucapollani]

Expected Behavior

I should be able to define all the point styles defined here https://www.chartjs.org/docs/latest/configuration/elements.html#point-styles

Current Behavior

cross, crossRot, dash, line, star point styles are not working. Nothing is displayed. Am I doing something wrong?

circle, rect, rectRounded, rectRot, triangle point styles are working correctly instead.

Steps to Reproduce

https://codesandbox.io/s/red-lake-16cx6?file=/index.html

Context

Related to #9337 / #9341

Environment

• Chart.js version: 3.4.1
• Browser name and version: 91.0.4472.124

[LeeLenaleee]

It seems the cross is getting it styling from the borderColor and borderWidth propertys in the dataset, so when you set the borderColor the crosses will show and when you set the borderWidth it defines how big they are, downside is that you will get borders in your pie chart.

https://codesandbox.io/s/upbeat-smoke-f1221?file=/index.html

[etimberg]

To work around the borders in the chart problem, one could override the generateLabels config option with something like this

const labelOpts = {
  generateLabels: (chart) => {
    const items = Chart.overrides.pie.plugins.legend.labels.generateLabels(chart);
    
    for (const item of items) {
      item.strokeStyle = item.fillStyle;
      item.lineWidth = 1;
    }
    
    return items;
  }
}

[lucapollani]

Thanks for the tips 👍🏻 , so as far as I've understood those point styles are actually being drawn but they have a size / color which doesn't make them show, correct?

[etimberg]

That's correct

[lucapollani]

Perfect, thank you, closing the issue then.