C# creazione di un grafico a torta con legenda in .Net 8

Articolo introduttivo alla creazione dei grafici con la versione 8 di .Net, utilizzando le classi basi di disegno.

il
Sviluppatore Microsoft .Net, Collaboratore di IProgrammatori

Nella creazione di progetti di tipo Windows Forms, può essere necessaria la creazione di applicazioni che fanno uso dei grafici, tutto questo era possibile fino alla versione del Framework 4.8 ma dalla versione 5 di .Net non sono più presenti i controlli chart per Windows forms.
In questo articolo vedremo come creare un grafico a torta utilizzando le classi di messe a disposizione da .Net 8 con il linguaggio di programmazione C# e l’ambiente di sviluppo Visual Studio 2022 Community.
Verrà illustrata una tecnica per la creazione di grafici a torta, con una legenda che illustra a cosa sono riferiti i vari colori e quindi fette, il tutto come mostrato in figura 1.

Figura 1 – Il grafico a torta con legenda
Figura 1 – Il grafico a torta con legenda

Nell'articolo inoltre sarà fornito anche un esempio di come esportare il grafico in formato immagine di tipo .Jpg


Creazione del progetto

Si crea un nuovo progetto di tipo Windows Form selezionando come modello di progetto “App Windows Forms” , fare click sul pulsante “Avanti” e nella finestra successiva impostare un nome al progetto, continuando con la finestra successiva selezionare l’ultima versione del Framework, in questo momento in cui si stiamo scrivendo l’articolo la versione è la 8.
Dopo aver fatto crea, verrà visualizzata una form, inserite un pulsante e nella proprietà “Name” impostare il valore “BtnSalva” mentre per la proprietà “Text” impostare il valore “Salva”.
A questo punto la creazione del progetto è terminata

Stesura del codice

Terminata la preparazione del progetto non resta che scrivere il codice. Passiamo in visualizzazione codice ed in una qualsiasi parte della classe “form” scriviamo una funzione che sarà richiamata dall’evento “Paint” del form e dall’evento click del pulsante, per la creazione del grafico o del file grafico.
La funzione accetterà diversi parametri, quali un oggetto Graphics per la creazione del grafico, un oggetto rect per la creazione dell’area dove creare il grafico, una variabile di tipo array float per i dati corrispondente ad ogni fetta, un array di tipo colors per il colore dei vari elementi ed infine un array di tipo string con le voci per ogni elemento.
Di seguito si riporta la funzione per la creazione del grafico.

C#
       private void CreaGrafico(Graphics g, Rectangle rect, float[] dati, Color[] colori, string[] testoValori)
       {
           // Calcola la somma totale dei valori
           float totale = dati.Sum();
           // Inizializza l'angolo di partenza per la creazione della forma del grafico
           float angoloPartenza = 0;
           // Disegna ogni fetta del grafico a torta
           for (int contaElementi = 0; contaElementi < dati.Length; contaElementi++)
           {
               // Calcola l'angolo di spostamento per il valore corrente per ogni fetta
               float angoloFetta = dati[contaElementi] * 360 / totale;
               // Disegna la fetta del grafico a torta
               g.FillPie(new SolidBrush(colori[contaElementi]), rect, angoloPartenza, angoloFetta);
               // Aggiorna l'angolo di partenza
               angoloPartenza += angoloFetta;
           }
           // Disegna la legenda
           for (int ContaElementi = 0; ContaElementi < testoValori.Length; ContaElementi++)
           {
               // Disegna il simbolo della legenda
               g.FillRectangle(new SolidBrush(colori[ContaElementi]), rect.Right + 10, rect.Top + ContaElementi * 20, 10, 10);
               // Disegna il testo della legenda
               g.DrawString(testoValori[ContaElementi], new Font("Arial", 12), Brushes.Black, rect.Right + 25, rect.Top + ContaElementi * 20);
           }
       }

Come si è visto nel precedente esempio, tramite i metodi fillPie, fillRectangle, DrawString possiamo creare un grafico a forta con vari colori, il tutto gestendo le informazioni che passiamo alla funzione.

Ora dobbiamo visualizzare il grafico nella form, questo avviene richiamando la funzione precedentemente creata, possiamo eseguire la funzione nell’evento “Paint” della nostra form. 
Nell’evento Paint passeremo alla funzione un oggetto di tipo grafico per gestire il disegno, un oggetto rettangolo per impostare l’area, l’array dei dati , l’array di tipo testo che sarà utilizzato per la legenda ed un array di color per i vari colori.

Di seguito si riporta il frammento di codice delle suddette operazioni.

C#
private void Form1_Paint(object sender, PaintEventArgs e)
{
   // Crea un oggetto grafico
   Graphics g = this.CreateGraphics();
   // Crea un array di dati
   float[] dati = { 10, 20, 30, 40 };
   string[] leggenda = { "Gennaio", "Febbraio", "Marzo", "Aprile" };
   //Oggetto per i colori di ogni fetta
   Color[] colori = { Color.Red, Color.Blue, Color.Green, Color.Yellow };
   //L'area di disegno
   Rectangle rectangle = new(100, 100, 200, 200);
   //Eseguo la funzione
   CreaGrafico(g, rectangle, dati, colori, leggenda);
}

A questo punto la stesura del codice per la creazione del grafico a torta con legenda è terminato, non resterà che eseguire il nostro progetto per vedere il risultato simile alla figura 1.

Salvataggio del grafico in formato immagine

Nel caso che si desidera salvare il grafico in un file di tipo immagine, dobbiamo passare all’oggetto  Graphics un oggetto di tipo Bitmap, il quale tramite il metodo “Save” salverà il grafico in un file immagine.
Passiamo in visualizzazione grafica della form e facciamo doppio click sul pulsante, in questo modo viene visualizzata la modalità codice per l’evento click del pulsante.
Di seguito si riporta il frammento di codice delle suddette operazioni per il salvataggio del grafico.

C#
private void BtnSalva_Click(object sender, EventArgs e)
{
   // Crea un oggetto di tipo Bitmap per salvare l'immagine 
   Bitmap bmp = new Bitmap(800, 600);
   // Crea un nuovo oggetto Graphics dal Bitmap
   Graphics g = Graphics.FromImage(bmp);
   float[] dati = { 10, 20, 30, 40 };
   string[] leggenda = { "Gennaio", "Febbraio", "Marzo", "Aprile" };
   Color[] colori = { Color.Red, Color.Blue, Color.Green, Color.Yellow };
   // Disegna il grafico a torta sul Graphics
   CreaGrafico(g, new Rectangle(10, 10, 100 - 20, 100 - 20), dati, colori, leggenda);
   // Salva l'immagine
   bmp.Save("C:\\Varie\\Grafico.png", System.Drawing.Imaging.ImageFormat.Png);
   // Rilascia le risorse
   g.Dispose();
   bmp.Dispose();
}

Conclusioni


L’articolo ha voluto fornire le basi per la creazione di un grafico a torta nei progetti di tipo “Windows Forms”. 
I vari esempi di codice permettono di far comprendere al lettore la possibilità di creare grafici, in particolare quelli di tipo a torta con legenda, utilizzando le classi base del Framework .Net versione 8. Di recente sono disponibili una serie di controlli gratuiti sulla creazione di grafici, ma comprendere come realizzarli utilizzando le classi per la grafica fornisce al programmatore le basi per  creare grafici con particolari funzionalità ed aspetti che in quelli presenti sul mercato  non possono avere  o creare grafici personalizzati di proprio interesse.