Point labels are the labels that are displayed around the radial chart, at each angle line. Tick labels are placed inside the chart over the first angle line and have a backdrop. Point labels are configured with the scale.pointLabels property, which is an object with the following properties:
|
Property |
Value |
Description |
|
display |
true (default in radar) or false (default in polar area) |
Displays or hides the axis labels |
|
callback |
Function; default is d=>d |
Returns the value label for each point |
|
fontColor, fontFamily, fontStyle |
Strings containing CSS font attributes |
Font attributes |
|
fontSize |
Number |
Font size in pixels |
You can hide pointLabels using display:false in a radial chart (see the following diagram). If you are using a polar area chart, you can use display:true if you want to make them visible. See Radial/radial-1-pointLabels-hide.html and radial-2-pointLabels-polar.html.
The following code uses some other pointLabel properties to change the color of the labels in a radar chart and uses a callback to append text to each label:
scale: {
pointLabels: { callback: (d) => 'Step ' + d, fontColor: 'red'}
}
See the full code in Radial/radial-3-pointLabels-callback.html. The result is shown as follows:
