在實際環境中測試
在生產環境中測試無浮水印。
在任何需要的地方都能運作。
LiveCharts 是供 .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# 代碼中,準備您圖表所需的數據。對於基本的折線圖,您需要一個 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,您只需更新資料來源。圖表會檢測到這些變化並相應地進行更新。
以下是如何將圖表繫結到資料來源的方法:
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" 替換為圖表圖像的正確路徑,如果它不在與您的應用程式執行檔相同的目錄中。
此範例涵蓋了一個基本情境,以說明這個過程。根據您的具體需求,您可能需要調整代碼,特別是關於如何處理和取得圖表的圖像。
為了進一步提高整合性:
總之,將LiveCharts與IronPDF整合,為.NET開發人員提供了一個強大的組合,這樣可以製作動態且視覺吸引力的圖表,並將其納入專業風格的PDF報告中。這種協同作用不僅增強了數據的展示效果,還通過動態數據集生成靜態報告,擴展了應用程序的實用性。
IronPDF具備將HTML呈現為PDF的能力,並且完全支持CSS3、JavaScript和HTML5,確保您的圖表從螢幕順利過渡到印刷頁面。對那些有興趣探索這一功能的人,IronPDF提供了一個 免費試用 起價為 $749,為 .NET 應用程序提供高效且成本效益的高品質報告生成解決方案。