在实际环境中测试
在生产中测试无水印。
随时随地为您服务。
实时图表 是一个面向 .NET 开发人员的库。LiveCharts 可帮助在 C# 应用程序中创建动态美观的图表。这意味着当数据发生变化时,图表会自动刷新。LiveCharts 不仅仅适用于传统应用程序。它支持 Windows Presentation Foundation (WPF).这使其成为桌面应用程序的多功能工具。
正在寻找满足您数据可视化需求的答案吗?LiveCharts 提供全面的解决方案。LiveCharts 提供多种功能。以下是一些要点:
LiveCharts 可将复杂的数据转化为交互式、引人入胜的可视化表示。它的易用性和灵活性使其成为开发人员的强大工具。利用功能强大的 LiveCharts,开发人员可以将复杂的数据转化为交互式、引人入胜的可视化表示。我们将探索 LiveCharts 的功能及其与 IronPDF 库.
设置开发环境以使用 LiveCharts 非常简单,访问其源代码可增强自定义和理解能力。本节将指导您完成初始步骤,并帮助您创建第一个图表。
要使用 LiveCharts,请确保已安装 Visual Studio。然后,在项目中添加 LiveCharts 软件包,这是一个专为动态数据可视化而设计的实用软件包。您可以通过 NuGet 软件包管理器来完成此操作。搜索 LiveCharts 并安装最新版本。此过程会将所有必要的引用添加到项目中。
创建第一个图表只需几个简单的步骤。首先,在应用程序的用户界面中添加一个图表控件。如果您使用的是 WPF,您可以在 XAML 或 C# 中以编程方式完成此操作。
下面是 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}"/>
在 C# 代码中,为图表准备数据。对于基本的折线图,您需要一个序列集合。您可以用 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
该代码片段创建了一个简单的折线图。它在笛卡尔图表上显示一系列数值。请记住设置窗口或控件的数据上下文,以确保图表与数据绑定。
按照以上步骤,您就可以创建并运行一个基本图表了。这仅仅是个开始。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 支持多种图表类型,每种类型都适合不同的数据可视化需求。下面是几个例子:
饼图:最适合显示数据集中的比例。
要创建饼图,可以使用 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 还能灵活控制图表的外观和行为。从颜色和标签到动画和交互性,您几乎可以自定义各个方面。这样,您就可以量身定制图表,使其与应用程序的外观和感觉完美契合。
将 LiveCharts 与 IronPDF 相集成,可以缩小动态数据可视化与静态报表生成之间的差距。IronPDF 是一个功能强大的 C# 库,允许开发人员以编程方式创建、操作和转换 PDF 文档。
将其与 LiveCharts 结合使用,可以创建包含交互式图表的 PDF 报告。本节将介绍 IronPDF,并指导您如何在项目中对其进行设置。
IronPDF 其他 PDF 库的不足之处,尤其是其呈现 HTML 转 PDF.该功能在使用 LiveCharts 时尤其有用,因为您可以将图表渲染为 HTML 画布,然后将这些画布转换为 PDF 文档。IronPDF 完全支持 CSS3、JavaScript 和 HTML5,确保您的图表在 PDF 输出中看起来与预期一致。
下面是一个详细的代码示例,说明了使用 LiveCharts 创建图表、导出图表,然后使用 IronPDF 生成包含该图表的 PDF 报告的过程。本示例假定您已基本了解如何使用 LiveCharts 和 IronPDF。
首先,确保通过 NuGet 在项目中安装了 LiveCharts 和 IronPDF 软件包。
让我们先用 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
现在,我们要准备 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>"
最后,我们将使用 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 "替换为图表图像的正确路径。
此示例涵盖了一个基本场景,用于说明流程。根据您的具体要求,您可能需要调整代码,尤其是关于如何处理和获取图表图片的代码。
进一步加强整合:
交互式 PDF:虽然 PDF 是静态的,但添加超链接或书签可以改善导航功能,使报告更方便用户使用。
总之,LiveCharts 与 IronPDF 的集成为.NET 开发人员提供了一个强大的组合,他们希望创建动态的、具有视觉吸引力的图表,并将其纳入专业风格的 PDF 报告中。这种协同作用不仅增强了数据的显示效果,还通过促进从动态数据集生成静态报告来扩展应用程序的实用性。
IronPDF 将 HTML 渲染为 PDF 的功能完全支持 CSS3、JavaScript 和 HTML5,确保您的图表从屏幕无缝过渡到印刷页面。对于有兴趣探索此功能的用户,IronPDF 提供了一个 免费试用 起价 749 美元,为在 .NET 应用程序中生成高质量报告提供了经济高效的解决方案。