.NET 帮助

Livecharts C#（它如何为开发人员工作）

Name: IronPDF
Brand: Iron Software
Availability: InStock
Rating: 4.87 (307 reviews)

坎那帕·乌东攀

2024年四月29日

LiveCharts 是一个为 .NET 开发人员提供的库。 LiveCharts 可帮助在 C# 应用程序中创建动态美观的图表。这意味着当数据发生变化时，您的图表会自动刷新。 LiveCharts 不仅仅适用于传统应用程序；它支持Windows Presentation Foundation (WPF)，使其成为桌面应用程序的多功能工具。

主要特点和优势

正在为您的数据可视化需求寻找答案？ LiveCharts 提供了一个功能全面的解决方案。以下是一些关键点：

自动动画：图表会自动动画，平滑更新，无需额外的代码，使您的数据可视化更加引人入胜。
支持 WPF：您可以在 WPF 应用程序中使用 LiveCharts，从而实现丰富的用户界面。
高性能：专为提高性能、速度和效率而设计，尤其适用于大型数据集。
灵活性：从一开始就简单、灵活、互动且易于使用，同时也允许根据项目需求进行复杂的自定义。
交互式图表：用户可以与图表进行交互，增强数据探索。
广泛的图表类型：无论您的数据可视化需求是什么，LiveCharts 都有相应的图表类型。
LiveCharts 将复杂的数据转化为交互式、引人入胜的可视化表达。它的易用性和灵活性使其成为开发人员的强大工具。利用功能强大的 LiveCharts，开发人员可以将复杂的数据转化为交互式、引人入胜的可视化表达。我们将探索LiveCharts的功能及其与IronPDF库的集成。

开始使用 LiveCharts

设置您的开发环境以使用 LiveCharts 非常简单，访问其源代码可增强定制和理解能力。本节将指导您完成初始步骤，并帮助您创建第一个图表。

设置环境

要使用 LiveCharts，请确保已安装 Visual Studio。然后，在您的项目中添加 LiveCharts 软件包，这是一个专为动态数据可视化而设计的专用软件包。您可以通过 NuGet 软件包管理器来完成这项工作。搜索LiveCharts并安装最新版本。此过程将为您的项目添加所有必要的参考资料。

您使用 LiveCharts 制作的第一张图表

创建第一个图表只需几个简单的步骤。首先，在应用程序的用户界面中添加一个图表控件。如果您使用的是 WPF，您可以用 XAML 或用 C# 编程完成。

下面是一个基本的 XAML 示例：

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

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

XML

在您的 C# 代码中，为图表准备数据。对于基本折线图，您将需要一个SeriesCollection。您可以使用LineSeries填充此集合，将Values设置为您的数据点。

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

该代码片段创建了一个简单的折线图。它在直角坐标图上显示一系列数值。请记得设置窗口或控件的DataContext，以确保图表绑定到您的数据。

按照这些步骤，您就可以创建并运行一个基本图表了。这仅仅是个开始。 LiveCharts 允许更复杂的交互式数据可视化。

探索 LiveCharts 功能

LiveCharts 不仅仅是显示静态数据。图表的真正威力在于其实时更新、对数据变化做出反应以及提供多种图表类型的能力。本节将深入探讨这些功能，并提供示例帮助您掌握相关概念。

了解数据绑定和更新

数据绑定是 LiveCharts 的核心概念。它可以让您的图表自动反映数据的变化。这一功能对于处理动态数据源的应用程序尤其有用。

考虑一个跟踪股票价格的应用程序。随着新数据的到来，您希望您的图表能够更新。使用 LiveCharts，您只需更新数据源。图表会检测到这些变化并进行相应的更新。

以下是将图表绑定到数据源的方法：

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

Livecharts C# (How It Works For Developers): Figure 1

深入了解图表类型

LiveCharts 支持多种图表类型，每种类型都适合不同的数据可视化需求。下面是几个例子：

折线系列: 非常适合显示随时间变化的趋势。
饼图：最适合显示数据集中的比例。
柱状图：用于比较不同类别之间的数量。
要创建饼图，您可以使用PieSeries类。下面是一个简单的例子：

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

该代码片段设置了一个包含两个数据系列的基本饼图。与折线图示例类似，它将PieSeries绑定到Values属性。

Livecharts C#（开发人员如何使用）：图2

LiveCharts 还能灵活控制图表的外观和行为。您可以自定义从颜色和标签到动画和交互性等几乎所有方面。这样就可以对图表进行定制，使其完全符合应用程序的外观和感觉。

IronPDF 简介

将 LiveCharts 与 IronPdf 集成，可以缩小动态数据可视化与静态报表生成之间的差距。 IronPDF 是一个强大的 C# 库，允许开发人员以编程方式创建、操作和转换 PDF 文档。

将其与 LiveCharts 结合使用，可以创建包含交互式图表的 PDF 报告。本节将介绍 IronPdf 并指导您如何在项目中设置它。

为什么选择IronPDF？

IronPDF 的 HTML 转 PDF 转换功能在其他 PDF 库不尽如人意的地方表现出色，特别是在将 HTML 渲染为 PDF 的能力上。该功能在使用 LiveCharts 时尤其有用，因为您可以将图表渲染为 HTML 画布，然后将这些画布转换为 PDF 文档。 IronPdf 完全支持 CSS3、JavaScript 和 HTML5，确保您的图表在 PDF 输出中看起来与预期一致。

使用 IronPDF 的 LiveCharts

下面是一个详细的代码示例，说明了使用 LiveCharts 创建图表、导出图表，然后使用 IronPDF 生成包含此图表的 PDF 报告的过程。本示例假定您已基本了解如何使用 LiveCharts 和 IronPDF。

首先，确保通过 NuGet 在项目中安装了 LiveCharts 和 IronPDF 软件包。

第 1 步：使用 LiveCharts 生成图表

让我们先使用 LiveCharts 创建一个简单的折线图。为简单起见，本示例将侧重于生成图表并将其保存为图片，随后将包含在我们的 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

Livecharts C#（开发人员的工作原理）：图 3

第 2 步：创建 HTML 模板并插入图表

现在，我们要准备 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>";

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>"

第 3 步：使用 IronPDF 将 HTML 转换为 PDF

最后，我们将使用 IronPdf 将 HTML 内容（包括嵌入的图表图片）转换为 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

确保将htmlContent字符串中的"chart.png"替换为聊天图片的正确路径，如果它不在与您的应用程序可执行文件相同的目录中。

本示例涵盖一个基本场景，以说明翻译过程。根据您的具体要求，您可能需要调整代码，特别是关于如何处理和获取图表图片的代码。

Livecharts C#（开发人员如何使用）：图 4

高级技术和技巧

为进一步加强整合：

优化性能：对于大型数据集或复杂图表，考虑优化LiveCharts和IronPDF的性能，以确保快速加载时间和流畅操作。
交互式PDF：虽然PDF是静态的，但添加超链接或书签可以改善导航，使报告更易于使用。
自定义样式：在 HTML 模板中使用 CSS，确保报告符合您的企业品牌或设计指南。

结论

Livecharts C#（开发人员如何使用）：图 5

总之，将 LiveCharts 与 IronPDF 集成为 .NET 开发人员提供了一个强大的组合，他们希望创建动态、具有视觉吸引力的图表，并将其纳入专业风格的 PDF 报告中。这种协同作用不仅增强了数据的展示效果，还通过促进从动态数据集生成静态报告来扩展应用程序的实用性。

IronPDF 能够将 HTML 渲染成 PDF，完全支持 CSS3、JavaScript 和 HTML5，确保您的图表从屏幕无缝过渡到印刷页面。对于有兴趣探索此功能的人，IronPDF 提供了从 $749 起的 IronPDF 免费试用，为 .NET 应用程序中的高质量报告生成提供了一种具成本效益的解决方案。

坎那帕·乌东攀

立即与工程团队聊天

软件工程师

在成为软件工程师之前，Kannapat 从日本北海道大学完成了环境资源博士学位。在攻读学位期间，Kannapat 还成为了生物生产工程系车辆机器人实验室的成员。2022年，他利用自己的 C# 技能加入了 Iron Software 的工程团队，专注于 IronPDF。Kannapat 珍视他的工作，因为他能直接向编写 IronPDF 大部分代码的开发者学习。除了同伴学习，Kannapat 还享受在 Iron Software 工作的社交方面。不写代码或文档时，Kannapat 通常在 PS5 上玩游戏或重看《最后生还者》。

< 前一页
Masstransit C#（开发者如何使用）

下一步 >
MS Graph .NET（开发人员如何使用）