Légende Légende

Question

Existe-t-il un moyen pour moi d'afficher des légendes dans les graphiques en créant simplement un nom et sa couleur en tant que données séparées?

Si ceci est mes données:

[{ 
    "x": 0.92, 
    "y": 1.12, 
    "date": "05-18-2003", 
    "color": "#0082c8", 
    "idNo": 3, 
    "mc": "green", 
    "symbol": "circle" 
}, 
{ 
    "x": 0.92, 
    "y": 1.13, 
    "date": "05-18-2003", 
    "color": "#0082c8", 
    "idNo": 10, 
    "mc": "green", 
    "symbol": "circle" 
}, 
{ 
    "x": 0.96, 
    "y": 1.05, 
    "date": "06-10-2003", 
    "color": "#f58231", 
    "idNo": 3, 
    "mc": "green", 
    "symbol": "circle" 
}, 
{ 
    "x": 0.96, 
    "y": 1.09, 
    "date": "06-11-2003", 
    "color": "#911eb4", 
    "idNo": 3, 
    "mc": "green", 
    "symbol": "circle" 
}, 
{ 
    "x": 0.96, 
    "y": 1.1, 
    "date": "06-11-2003", 
    "color": "#911eb4", 
    "idNo": 10, 
    "mc": "green", 
    "symbol": "circle" 
} 
] 

et les données de légende que je créé de façon dynamique en fonction des données ci-dessus est legendData =

[{name: "05-18-2003", color1: "#0082c8"} 
{name: "06-11-2003", color1: "#f58231"} 
{name: "06-10-2003", color1: "#911eb4"}] 

Comment puis-je faire la légende de cette variable legendData ?

Merci.

Answer 1

Pour modifier les étiquettes d'élément de légende, vous pouvez utiliser la fonction labelFormatter. En ce qui concerne la couleur différente pour chaque élément de légende, vous pouvez utiliser le mode stylisé et les styles en utilisant CSS. Jetez un oeil à l'exemple posté ci-dessous.

DOCS Référence:
https://www.highcharts.com/docs/chart-design-and-style/style-by-css

API Référence:
http://api.highcharts.com/highcharts/legend.labelFormatter

Exemple:
http://jsfiddle.net/mw06ywvp/