Chart.js - How to place text outside of radar chart

3
votes

I'm using Chart.js to build a radar chart. I have seven datasets grouped by color as seen in the image below:

enter image description here

I would like to place the dataset labels outside of the chart, in the center of each dataset sector (at the crosses in the image). Does anyone know if this is possible?

1
javascriptchartschart.jsradar-chart
Why not use the legend? - gipouf
Yes, this is possible using one of the axis tick configuration callback functions. I will send an example tonight showing you what i mean. - jordanwillis
Thank you!! I have only been able to move all legends either to the top, bottom, left or right of the diagram, but I have not figured out how to separate them and have them positioned as in the image. - Karonsbo
@Karonsbo can you please provide your chart.js configuration so I can recreate this chart? - jordanwillis
I have never tried this before, hope it works! Thank you! jsfiddle.net/z824kyfh/2 - Karonsbo

1 Answers

0
votes

You could probably basically accomplish this by doing roughly the following:

  • Specify a non-empty label only where you'd like the group label to appear (e.g. for every sixth datapoint or something similar)
  • Then set the tooltips.callbacks.label option to return the label for each point so that they still appear in the tooltip as they originally would