Livecharts C# (Comment ça marche pour les développeurs)

LiveCharts est une bibliothèque destinée aux développeurs .NET. LiveCharts permet de créer des graphiques dynamiques et magnifiques dans les applications C#. Cela signifie que vos graphiques sont actualisés automatiquement lorsque vos données changent. LiveCharts n'est pas réservé aux applications traditionnelles ; il prend en charge la Windows Presentation Foundation(WPF)le logiciel .NET est un outil polyvalent pour les applications de bureau.

Principales caractéristiques et avantages

Vous cherchez une réponse à vos besoins en matière de visualisation de données ? LiveCharts offre une solution complète avec un large éventail de fonctionnalités. Voici quelques points clés :

• Animations automatiques : Les graphiques s'animent automatiquement, se mettent à jour en douceur sans nécessiter de code supplémentaire, ce qui rend vos visualisations de données plus attrayantes.
• Prise en charge de WPF : Vous pouvez utiliser les LiveCharts dans les applications WPF, ce qui permet de créer des interfaces utilisateur riches.
• Haute performance : Conçu pour améliorer les performances, la vitesse et l'efficacité, en particulier pour les grands ensembles de données.
• Flexibilité : Il est simple, flexible, interactif et facile à utiliser dès le départ, mais il permet également des personnalisations complexes adaptées aux besoins de votre projet.
• Graphiques interactifs : Les utilisateurs peuvent interagir avec les graphiques, ce qui améliore l'exploration des données.

• Large gamme de types de graphiques : Quels que soient vos besoins en matière de visualisation de données, LiveCharts dispose d'un type de graphique adapté.

  LiveCharts transforme des données complexes en représentations visuelles interactives et attrayantes. Sa facilité d'utilisation et sa flexibilité en font un outil puissant pour les développeurs. Grâce aux capacités des puissants LiveCharts, les développeurs peuvent transformer des données complexes en représentations visuelles interactives et attrayantes. Nous allons explorer les fonctionnalités de LiveCharts et son intégration avec le logicielBibliothèque IronPDF.

Premiers pas avec LiveCharts

La configuration de votre environnement de développement pour utiliser LiveCharts est simple, et l'accès à son code source améliore la personnalisation et la compréhension. Cette section vous guide à travers les étapes initiales et vous aide à créer votre premier graphique.

Mise en place de l'environnement

Pour utiliser LiveCharts, assurez-vous que Visual Studio est installé. Ensuite, ajoutez à votre projet le paquet LiveCharts, un paquet orienté conçu pour la visualisation dynamique des données. Vous pouvez le faire via le gestionnaire de paquets NuGet. Recherchez LiveCharts et installez la dernière version. Ce processus ajoute toutes les références nécessaires à votre projet.

Votre premier graphique avec LiveCharts

La création de votre premier graphique se fait en quelques étapes simples. Tout d'abord, ajoutez un contrôle graphique à l'interface utilisateur de votre application. Si vous utilisez WPF, vous pouvez le faire en XAML ou par programmation en C#.

Voici un exemple de base en XAML :

<lvc:CartesianChart Series="{Binding MySeries}"/>

<lvc:CartesianChart Series="{Binding MySeries}"/>

'INSTANT VB TODO TASK: The following line uses invalid syntax:
'<lvc:CartesianChart Series="{Binding MySeries}"/>

Dans votre code C#, préparez les données pour votre graphique. Pour un graphique linéaire de base, vous aurez besoin d'une SeriesCollection. Vous pouvez remplir cette collection avec des LineSeries, en fixant les Values à vos points de données.

public SeriesCollection MySeries { get; set; }
public MainWindow()
{
    InitializeComponent();
    MySeries = new SeriesCollection
    {
        new LineSeries
        {
            Values = new ChartValues<double> { 4, 6, 5, 2, 7 }
        }
    };
    DataContext = this;
}

public SeriesCollection MySeries { get; set; }
public MainWindow()
{
    InitializeComponent();
    MySeries = new SeriesCollection
    {
        new LineSeries
        {
            Values = new ChartValues<double> { 4, 6, 5, 2, 7 }
        }
    };
    DataContext = this;
}

Public Property MySeries() As SeriesCollection
'INSTANT VB WARNING: The following constructor is declared outside of its associated class:
'ORIGINAL LINE: public MainWindow()
Public Sub New()
	InitializeComponent()
	MySeries = New SeriesCollection
		From {
			New LineSeries With {
				.Values = New ChartValues(Of Double) From {4, 6, 5, 2, 7}
			}
		}
	DataContext = Me
End Sub

Cet extrait de code crée un simple graphique linéaire. Il affiche une série de valeurs sur un graphique cartésien. N'oubliez pas de définir le DataContext de votre fenêtre ou de votre contrôle pour vous assurer que le graphique est lié à vos données.

En suivant ces étapes, vous disposerez d'un tableau de base. Ce n'est qu'un début. LiveCharts permet des visualisations de données beaucoup plus complexes et interactives.

Exploration des fonctionnalités de LiveCharts

LiveCharts ne se limite pas à l'affichage de données statiques. La véritable puissance de ces outils réside dans leur capacité à se mettre à jour en temps réel, à réagir aux changements de données et à offrir un large éventail de types de graphiques. Cette section se penche sur ces capacités et fournit des exemples pour vous aider à comprendre les concepts.

Comprendre la liaison des données et les mises à jour

La liaison de données est un concept fondamental de LiveCharts. Il permet à vos graphiques de refléter automatiquement les changements dans vos données. Cette fonction est particulièrement utile pour les applications qui utilisent des sources de données dynamiques.

Prenons l'exemple d'une application qui suit le cours des actions. Au fur et à mesure de l'arrivée de nouvelles données, vous souhaitez que votre graphique soit mis à jour. Avec LiveCharts, il suffit de mettre à jour la source de données. Le graphique détecte ces changements et les met à jour en conséquence.

Voici comment lier un graphique à une source de données :

var myValues = new ChartValues<double> { 3, 4, 6, 3, 2 };
var lineSeries = new LineSeries
{
    Values = myValues
};
mySeries.Add(lineSeries);
// When data changes
myValues.Add(5); // The chart updates automatically

var myValues = new ChartValues<double> { 3, 4, 6, 3, 2 };
var lineSeries = new LineSeries
{
    Values = myValues
};
mySeries.Add(lineSeries);
// When data changes
myValues.Add(5); // The chart updates automatically

Dim myValues = New ChartValues(Of Double) From {3, 4, 6, 3, 2}
Dim lineSeries As New LineSeries With {.Values = myValues}
mySeries.Add(lineSeries)
' When data changes
myValues.Add(5) ' The chart updates automatically

Plongée dans les types de graphiques

LiveCharts prend en charge plusieurs types de graphiques, chacun adapté à différents types de besoins en matière de visualisation de données. Voici quelques exemples :

• Série de lignes : Idéale pour afficher des tendances dans le temps.
• Graphique en forme de tarte : Idéal pour montrer les proportions d'un ensemble de données.

• Graphique à barres : Utile pour comparer les quantités entre différentes catégories.

  Pour créer un diagramme circulaire, vous devez utiliser la classe PieSeries. Voici un exemple rapide :

public SeriesCollection MyPieSeries { get; set; }
public MainWindow()
{
    InitializeComponent();
    MyPieSeries = new SeriesCollection
    {
        new PieSeries
        {
            Values = new ChartValues<double> { 4, 6, 5 },
            Title = "Series 1"
        },
        new PieSeries
        {
            Values = new ChartValues<double> { 7, 8, 6 },
            Title = "Series 2"
        }
    };
    DataContext = this;
}

public SeriesCollection MyPieSeries { get; set; }
public MainWindow()
{
    InitializeComponent();
    MyPieSeries = new SeriesCollection
    {
        new PieSeries
        {
            Values = new ChartValues<double> { 4, 6, 5 },
            Title = "Series 1"
        },
        new PieSeries
        {
            Values = new ChartValues<double> { 7, 8, 6 },
            Title = "Series 2"
        }
    };
    DataContext = this;
}

Public Property MyPieSeries() As SeriesCollection
'INSTANT VB WARNING: The following constructor is declared outside of its associated class:
'ORIGINAL LINE: public MainWindow()
Public Sub New()
	InitializeComponent()
	MyPieSeries = New SeriesCollection
		From {
			New PieSeries With {
				.Values = New ChartValues(Of Double) From {4, 6, 5},
				.Title = "Series 1"
			},
			New PieSeries With {
				.Values = New ChartValues(Of Double) From {7, 8, 6},
				.Title = "Series 2"
			}
		}
	DataContext = Me
End Sub

Cet extrait de code met en place un diagramme circulaire de base avec deux séries de données. Comme dans l'exemple du graphique linéaire, il lie la PieSeries à la propriété Values.

LiveCharts offre également une flexibilité et un contrôle sur l'apparence et le comportement de vos graphiques. Vous pouvez personnaliser presque tous les aspects, des couleurs et des étiquettes aux animations et à l'interactivité. Il est ainsi possible d'adapter les graphiques à l'aspect et à la convivialité de votre application.

Introduction à IronPDF

L'intégration de LiveCharts à IronPDF comble le fossé entre la visualisation dynamique des données et la génération de rapports statiques. IronPDF est une puissante bibliothèque pour C# qui permet aux développeurs de créer, manipuler et convertir des documents PDF de manière programmatique.

La combinaison avec LiveCharts permet de créer des rapports PDF contenant vos graphiques interactifs. Cette section présente IronPDF et vous guide dans sa mise en place dans votre projet.

Pourquoi IronPDF ?

Capacités de conversion de HTML en PDF d'IronPDF la traduction doit rester professionnelle, en préservant l'exactitude technique tout en expliquant les caractéristiques et les avantages de ces outils de développement. Cette fonction est particulièrement utile lorsque vous travaillez avec LiveCharts, car vous pouvez convertir vos graphiques en canevas HTML, puis convertir ces canevas en documents PDF. IronPDF prend en charge l'intégralité des feuilles de style CSS3, JavaScript et HTML5, ce qui garantit que vos graphiques ont l'apparence voulue dans la sortie PDF.

LiveCharts avec IronPDF

Voici un exemple de code détaillé qui illustre le processus de création d'un graphique avec LiveCharts, son exportation, puis l'utilisation d'IronPDF pour générer un rapport PDF incluant ce graphique. Cet exemple suppose que vous avez des connaissances de base sur la façon de travailler avec LiveCharts et IronPDF.

Tout d'abord, assurez-vous que les paquets LiveCharts et IronPDF sont installés dans votre projet via NuGet.

Étape 1 : Générer le graphique avec LiveCharts

Commençons par créer un simple graphique linéaire à l'aide de LiveCharts. Par souci de simplicité, cet exemple se concentrera sur la génération du graphique et son enregistrement en tant qu'image, qui sera ensuite incluse dans notre PDF.

private void GenerateChartButton_Click(object sender, RoutedEventArgs e)
{
    CreateAndSaveChartImage();
}
public void CreateAndSaveChartImage()
{
    var seriesCollection = new SeriesCollection
{
    new LineSeries
    {
        Values = new ChartValues<double> { 4, 6, 5, 2, 7 },
        Title = "Sample Series"
        // Make sure to configure the series properties like color, point geometry, etc.
    }
};
    var chart = new CartesianChart
    {
        Series = seriesCollection,
        Width = 400,
        Height = 300,
        Background = Brushes.White
    };
    // Add chart to the UI
    ChartContainer.Child = chart;
    chart.Update(true, true); // Force chart redraw
    SaveChartToImage(chart);
}
private void SaveChartToImage(CartesianChart chart)
{
    // Ensure the chart layout is updated.
    chart.Measure(new Size(chart.Width, chart.Height));
    chart.Arrange(new Rect(0, 0, chart.Width, chart.Height));
    var renderTargetBitmap = new RenderTargetBitmap(
        (int)chart.ActualWidth,
        (int)chart.ActualHeight,
        96, // dpiX value
        96, // dpiY value
        PixelFormats.Pbgra32); // Pixel format
    renderTargetBitmap.Render(chart); // Render the chart to the bitmap
    var encoder = new PngBitmapEncoder();
    encoder.Frames.Add(BitmapFrame.Create(renderTargetBitmap));
    // Define the path where the chart will be saved
    string path = "chart.png";
    using (var stream = File.Create(path))
    {
        encoder.Save(stream);
    }
    MessageBox.Show($"Chart saved as {path}");
}

private void GenerateChartButton_Click(object sender, RoutedEventArgs e)
{
    CreateAndSaveChartImage();
}
public void CreateAndSaveChartImage()
{
    var seriesCollection = new SeriesCollection
{
    new LineSeries
    {
        Values = new ChartValues<double> { 4, 6, 5, 2, 7 },
        Title = "Sample Series"
        // Make sure to configure the series properties like color, point geometry, etc.
    }
};
    var chart = new CartesianChart
    {
        Series = seriesCollection,
        Width = 400,
        Height = 300,
        Background = Brushes.White
    };
    // Add chart to the UI
    ChartContainer.Child = chart;
    chart.Update(true, true); // Force chart redraw
    SaveChartToImage(chart);
}
private void SaveChartToImage(CartesianChart chart)
{
    // Ensure the chart layout is updated.
    chart.Measure(new Size(chart.Width, chart.Height));
    chart.Arrange(new Rect(0, 0, chart.Width, chart.Height));
    var renderTargetBitmap = new RenderTargetBitmap(
        (int)chart.ActualWidth,
        (int)chart.ActualHeight,
        96, // dpiX value
        96, // dpiY value
        PixelFormats.Pbgra32); // Pixel format
    renderTargetBitmap.Render(chart); // Render the chart to the bitmap
    var encoder = new PngBitmapEncoder();
    encoder.Frames.Add(BitmapFrame.Create(renderTargetBitmap));
    // Define the path where the chart will be saved
    string path = "chart.png";
    using (var stream = File.Create(path))
    {
        encoder.Save(stream);
    }
    MessageBox.Show($"Chart saved as {path}");
}

Imports System

Private Sub GenerateChartButton_Click(ByVal sender As Object, ByVal e As RoutedEventArgs)
	CreateAndSaveChartImage()
End Sub
Public Sub CreateAndSaveChartImage()
	Dim seriesCollection As New SeriesCollection
		From {
			New LineSeries With {
				.Values = New ChartValues(Of Double) From {4, 6, 5, 2, 7},
				.Title = "Sample Series"
			}
		}
	Dim chart = New CartesianChart With {
		.Series = seriesCollection,
		.Width = 400,
		.Height = 300,
		.Background = Brushes.White
	}
	' Add chart to the UI
	ChartContainer.Child = chart
	chart.Update(True, True) ' Force chart redraw
	SaveChartToImage(chart)
End Sub
Private Sub SaveChartToImage(ByVal chart As CartesianChart)
	' Ensure the chart layout is updated.
	chart.Measure(New Size(chart.Width, chart.Height))
	chart.Arrange(New Rect(0, 0, chart.Width, chart.Height))
	Dim renderTargetBitmap As New RenderTargetBitmap(CInt(Math.Truncate(chart.ActualWidth)), CInt(Math.Truncate(chart.ActualHeight)), 96, 96, PixelFormats.Pbgra32) ' Pixel format
	renderTargetBitmap.Render(chart) ' Render the chart to the bitmap
	Dim encoder = New PngBitmapEncoder()
	encoder.Frames.Add(BitmapFrame.Create(renderTargetBitmap))
	' Define the path where the chart will be saved
	Dim path As String = "chart.png"
	Using stream = File.Create(path)
		encoder.Save(stream)
	End Using
	MessageBox.Show($"Chart saved as {path}")
End Sub

Étape 2 : Création d'un modèle HTML et insertion du graphique

Nous allons maintenant préparer notre contenu HTML, en intégrant le graphique que nous venons d'enregistrer en tant qu'image.

string htmlContent = @"
<html>
<body>
    <h1>Chart Report</h1>
    <img src='chart.png' alt='Chart'>
    <p>This is a report generated by combining LiveCharts and IronPDF.</p>
</body>
</html>";

string htmlContent = @"
<html>
<body>
    <h1>Chart Report</h1>
    <img src='chart.png' alt='Chart'>
    <p>This is a report generated by combining LiveCharts and IronPDF.</p>
</body>
</html>";

Dim htmlContent As String = "
<html>
<body>
    <h1>Chart Report</h1>
    <img src='chart.png' alt='Chart'>
    <p>This is a report generated by combining LiveCharts and IronPDF.</p>
</body>
</html>"

Étape 3 : Convertir HTML en PDF avec IronPDF

Enfin, nous utiliserons IronPDF pour convertir notre contenu HTML, y compris l'image graphique intégrée, en un document PDF.

using IronPdf;
public void CreatePdfReport(string htmlContent)
{
    var renderer = new ChromePdfRenderer();
    var pdf = renderer.RenderHtmlAsPdf(htmlContent);
    pdf.SaveAs("Report.pdf");
}

using IronPdf;
public void CreatePdfReport(string htmlContent)
{
    var renderer = new ChromePdfRenderer();
    var pdf = renderer.RenderHtmlAsPdf(htmlContent);
    pdf.SaveAs("Report.pdf");
}

Imports IronPdf
Public Sub CreatePdfReport(ByVal htmlContent As String)
	Dim renderer = New ChromePdfRenderer()
	Dim pdf = renderer.RenderHtmlAsPdf(htmlContent)
	pdf.SaveAs("Report.pdf")
End Sub

Veillez à remplacer "chart.png " dans la chaîne htmlContent par le chemin d'accès correct à votre image graphique si celle-ci ne se trouve pas dans le même répertoire que l'exécutable de votre application.

Cet exemple couvre un scénario de base pour illustrer le processus. En fonction de vos besoins spécifiques, il se peut que vous deviez adapter le code, notamment en ce qui concerne la manière dont vous traitez et sourcez les images pour vos graphiques.

Techniques et conseils avancés

Pour améliorer encore l'intégration :

• Optimiser les performances : Pour les grands ensembles de données ou les graphiques complexes, pensez à optimiser les performances de LiveCharts et d'IronPDF pour garantir des temps de chargement rapides et un fonctionnement fluide.
• PDF interactifs : Bien que les PDF soient statiques, l'ajout d'hyperliens ou de signets peut améliorer la navigation et rendre les rapports plus conviviaux.
• Style personnalisé : Utilisez le CSS dans vos modèles HTML pour vous assurer que les rapports correspondent à la marque de votre entreprise ou à vos lignes directrices en matière de conception.

Conclusion

En conclusion, l'intégration de LiveCharts à IronPDF constitue une combinaison puissante pour les développeurs .NET qui souhaitent créer des graphiques dynamiques et visuellement attrayants et les incorporer dans des rapports PDF de qualité professionnelle. Cette synergie permet non seulement d'améliorer la présentation des données, mais aussi d'étendre l'utilité des applications en facilitant la génération de rapports statiques à partir d'ensembles de données dynamiques.

La capacité d'IronPDF à rendre HTML en PDF, avec une prise en charge complète de CSS3, JavaScript et HTML5, garantit une transition transparente de vos graphiques de l'écran à la page imprimée. Pour ceux qui souhaitent explorer cette fonctionnalité, IronPDF offre un service deessai gratuit d'IronPDF à partir de $749l'objectif est d'offrir une solution rentable pour la génération de rapports de haute qualité dans les applications .NET.