J'ai un graphique en toile d'araignée avec une ligne de tracé à une valeur spécifique. L'interpolation de la ligne de quadrillage est utilisée comme cercle. Dans ce cas, l'étiquette fournie est affichée très loin de la ligne de tracé (coin supérieur gauche du graphique) par défaut.
Comment puis-je toujours afficher les étiquettes au centre ou à une position spécifique du cercle de la ligne de traçage, sans calculer manuellement les points x et y.
Voir l'exemple : http://jsfiddle.net/2862pqma/4/
Highcharts.chart('container', {
chart: {
polar: true,
type: 'line'
},
title: {
text: 'Budget vs spending',
x: -80
},
pane: {
size: '80%'
},
xAxis: {
categories: ['Sales', 'Marketing', 'Development', 'Customer Support',
'Information Technology', 'Administration'
],
tickmarkPlacement: 'on',
lineWidth: 0
},
yAxis: {
gridLineInterpolation: 'circle',
lineWidth: 0,
min: 0,
plotLines: [{
value: 35000,
width: 2,
dashStyle: "Solid",
color: "red",
label: {
text: "Line Marker",
style: {
color: "red"
}
}
}]
},
tooltip: {
shared: true,
pointFormat: '<span style="color:{series.color}">{series.name}: <b>${point.y:,.0f}</b><br/>'
},
legend: {
align: 'right',
verticalAlign: 'top',
y: 70,
layout: 'vertical'
},
series: [{
name: 'Allocated Budget',
data: [43000, 19000, 60000, 35000, 17000, 10000],
pointPlacement: 'on'
}, ]
});
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/highcharts-more.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>
<div id="container" style="min-width: 400px; max-width: 600px; height: 400px; margin: 0 auto"></div>