Documentation menu

Blocco Radar

Un confronto multi-asse — fino a 3 serie tracciate su un insieme di assi condivisi, disegnato come un poligono sovrapposto (o "ragnatela") anziché come barre o una linea. È la forma giusta per confrontare categorie su più dimensioni contemporaneamente: un prodotto valutato su prezzo, qualità, velocità e assistenza, oppure un livello di piano confrontato con un altro sullo stesso insieme di criteri.

Come funziona

Ogni riga inserita è un asse. La sua posizione intorno al cerchio deriva puramente dall'ordine di inserimento (l'angolo è uguale all'indice della riga diviso per il numero di righe), mai riordinata o ordinata per valore. Fino a 3 serie tracciano il proprio valore su ogni asse, condividendo un'unica scala 0..max: lo stesso modello "un unico asse dei valori condiviso" già usato dai grafici a barre e a linee, semplicemente disposto in modo radiale invece che lungo una linea retta. Questo è il motivo per cui l'elenco righe di un radar riutilizza esattamente le stesse colonne di inserimento di barre/linee — un asse del radar è identico, dal punto di vista del modello dati, a una categoria di un grafico a barre.

Un poligono richiede almeno 3 vertici per essere una forma significativa — 2 punti disegnano una linea, 1 punto non disegna nulla — quindi il radar è l'unico grafico di questa famiglia ad avere sia un minimo sia un massimo. Meno di 3 assi inseriti (compreso zero) mostra lo stesso segnaposto "aggiungi altri dati" di un grafico vuoto altrove nella famiglia. All'altro estremo, il radar è limitato a 8 assi; oltre quel limite, i raggi si affollano e le etichette degli assi iniziano a sovrapporsi, lo stesso limite di "troppi elementi" che ogni altro tipo di grafico di questa famiglia applica a 8 categorie/spicchi/serie.

La tabella dei dati sempre visibile sotto l'immagine elenca ogni asse come riga, con una colonna per ogni serie attiva — la stessa forma categoria × serie che le tabelle dei grafici a barre e a linee già usano. Una legenda compare solo quando sono in gioco 2 o più serie; l'identità di una singola serie è già indicata dal titolo stesso del blocco, la stessa convenzione seguita dai grafici a barre/linee.

L'identità della serie deriva dal fatto che tu le abbia dato un nome. La serie 1 viene sempre renderizzata, ricadendo sul titolo stesso del blocco se lasciata senza nome, mentre le serie 2 e 3 compaiono solo dopo che digiti un nome nel loro campo etichetta. Una colonna dei valori parzialmente compilata senza un nome di serie non emerge mai come una serie fantasma senza etichetta.

Campi configurabili:

  • Titolo del grafico — testo di intestazione facoltativo sopra il grafico.
  • Dati (almeno 3 righe) — l'elenco righe: un'etichetta Categoria per l'asse più fino a 3 valori numerici di serie per riga.
  • Nome serie 1/2/3 e Colore serie 1/2/3 — la serie 1 viene renderizzata incondizionatamente; le serie 2 e 3 vengono renderizzate solo dopo essere state nominate.
  • Colore di sfondo, padding, bordo e raggio del bordo della card.
  • Colore/dimensione del titolo e colore/dimensione della legenda — stile del testo per l'intestazione e per il testo di legenda/tabella sotto l'immagine.

Esempi

Confrontare due livelli di prodotto sugli stessi criteri — prezzo, profondità delle funzionalità, reattività dell'assistenza, facilità di configurazione — come due serie sovrapposte su un unico radar dà a un'email di vendita o marketing un unico visual al posto di una tabella comparativa delle funzionalità. Un riepilogo operativo interno può valutare più fornitori o collaboratori sulla stessa griglia di criteri (costo, qualità, affidabilità, comunicazione) per giustificare a colpo d'occhio una decisione di rinnovo. Un team di prodotto che conduce un sondaggio clienti con più dimensioni valutate (usabilità, valore, assistenza, affidabilità, design) può graficare il punteggio medio per dimensione come una serie, con i punteggi del trimestre precedente come seconda serie per mostrare l'andamento.

Come appare il fallback statico

<div style="margin:12px 0;background-color:#ffffff;padding:16px">
  <p style="margin:0 0 8px;font-weight:600;font-size:15px;color:#111827">Vendor scorecard</p>
  <img src="https://mailinapp.com/api/analytics/chart?d=eyJ0eXBlIjoi...&s=3f9a2b1c..." width="360" height="360"
       alt="Radar chart: Speed (Vendor A 8); Reliability (Vendor A 6); Design (Vendor A 9); Price (Vendor A 5); Support (Vendor A 7)" />
  <table style="width:100%;border-collapse:collapse;margin-top:4px">
    <tr>
      <th style="text-align:left;padding:4px 8px;font-weight:600">Category</th>
      <th style="text-align:left;padding:4px 8px;font-weight:600">Vendor A</th>
    </tr>
    <tr>
      <td style="padding:4px 8px">Speed</td>
      <td style="padding:4px 8px">8</td>
    </tr>
  </table>
</div>

Con una sola serie nominata, la legenda viene omessa (il titolo la nomina già), ma la tabella dei dati elenca comunque ogni asse e valore.

Vedi anche