bt之家论坛,早乙女露伊,痴汉支配

如何在網(wǎng)頁報表中創(chuàng)建交互式矩陣

原創(chuàng)|使用教程|編輯：我只采一朵|2017-12-19 10:50:54.000|閱讀 841 次

概述：我們已經(jīng)講解過很多網(wǎng)頁報表的開發(fā)技巧了，今天我們講一講如何創(chuàng)建交互式矩陣報表（也可以稱為交叉報表）。

# 界面/圖表報表/文檔/IDE等千款熱門軟控件火熱銷售中 >>

相關(guān)鏈接：

我們已經(jīng)講解過很多網(wǎng)頁報表的開發(fā)技巧了，今天我們講一講如何創(chuàng)建交互式矩陣報表，或者說交叉報表。我們將使用FastReport.Net的xml數(shù)據(jù)庫。選擇好表格：

如何在網(wǎng)頁報表中創(chuàng)建交互式矩陣

添加矩陣（Matrix）對象到數(shù)據(jù)帶區(qū)：

如何在網(wǎng)頁報表中創(chuàng)建交互式矩陣

現(xiàn)在在數(shù)據(jù)窗口中打開“訂單明細”表。你將看到相關(guān)聯(lián)的表：產(chǎn)品與訂單。打開訂單。它又連接著一張表——員工。我們打開它并將FirstName字段拖到列頭：

如何在網(wǎng)頁報表中創(chuàng)建交互式矩陣

雙擊添加的字段。讓我們將LastName字段添加到FirstName字段，以顯示員工的全名。所以，整個字段組成如下所示：

[Order Details.Orders.Employees.FirstName]+" "+[Order Details.Orders.Employees.LastName]

這大幅擴展了列頭。讓我們禁用“自動寬度”功能。要做到這點，請右鍵單擊Matrix對象。然后在上下文菜單中勾選掉“自動尺寸”：

如何在網(wǎng)頁報表中創(chuàng)建交互式矩陣

現(xiàn)在你可以自由調(diào)整行和列的大小。

將Photo字段拖到列頭。調(diào)整單元格大小以適應(yīng)添加的字段。

現(xiàn)在找到在訂單明細表中找到關(guān)聯(lián)的產(chǎn)品表。打開它。它也有一張關(guān)聯(lián)的類別表。將CategoryName字段從類別表中拖動到行頭，并將Picture字段放到同一個單元格。

如何在網(wǎng)頁報表中創(chuàng)建交互式矩陣

現(xiàn)在，將“單價”字段從訂單明細表拖到數(shù)據(jù)單元格中。編輯添加的字段。你需要查找三個字段的產(chǎn)品：單價，數(shù)量和單折扣。因此，我們找到真正的銷售額：

[Order Details.UnitPrice] * [Order Details.Quantity] *（decimal）（1 - [Order Details.Discount]）

矩陣幾乎準(zhǔn)備就緒，它還有待選擇樣式。右鍵單擊矩陣，然后選擇“樣式”。例如，橙色。這就已經(jīng)很漂亮了：

如何在網(wǎng)頁報表中創(chuàng)建交互式矩陣

在單獨的頁面上創(chuàng)建詳細的報表。在報表中添加第二頁。

將Order Details.OrderDate字段添加到數(shù)據(jù)帶區(qū)。接下來，我們將Order Detail.Products.ProductName字段放在它旁邊。同時拖動字段：Order Detail.UnitPrice、Order Detail.Quantity和Order Detail.Discount。

要顯示所需的員工的數(shù)據(jù)，你需要過濾表格。我們將傳輸數(shù)據(jù)以比較第一頁和第二頁。為此，請在第二頁中創(chuàng)建參數(shù)。針對這個選項，我們創(chuàng)建了兩個子參數(shù)，都是字符串類型：

如何在網(wǎng)頁報表中創(chuàng)建交互式矩陣

現(xiàn)在為數(shù)據(jù)帶添加一個過濾器。雙擊并選擇“過濾器”選項卡：

[Order Details.Orders.Employees.FirstName] + " " + [Order Details.Orders.Employees.LastName] == [Parameters.Employee] && [Order Details.Products.Categories.CategoryName] == [Parameters.Category]

在這里，我們比較員工姓名與參數(shù)，以及類別名稱與參數(shù)。

我們?yōu)樵敿殘蟊硖砑右粋€標(biāo)題：

[Parameters.Employee] order's.

最終，模板如下：

如何在網(wǎng)頁報表中創(chuàng)建交互式矩陣

Tab Report page:我們回到第一頁。選擇矩陣的數(shù)據(jù)字段。在屬性查看器中，我們找到“超鏈接”并打開超鏈接編輯器。在報表頁面：

選擇第二頁和參數(shù)“Parameters”，子參數(shù)的值將被自動插入。

報表已經(jīng)準(zhǔn)備完畢。我們保存它。

現(xiàn)在創(chuàng)建一個Web應(yīng)用程序，我將使用ASP.Net MVC項目。

在“參考”中添加對FastReport.dll和FastReport.Web.dll庫的引用。

在Controllers文件夾中，找到文件HomeController.cs。這是起始頁面的控制器。在這里，我們將使用報表對象。

我們添加缺少的庫：

using FastReport.Web;
using System.Web.UI.WebControls;

添加負責(zé)起始頁面的Index方法的代碼：

public ActionResult Index()
 {
 WebReport webReport = new WebReport(); //create the instance of the WebReport.
 webReport.Width = Unit.Percentage(100); //set the webReport object width 100%
 webReport.Height = Unit.Percentage(100); //set the webReport object heigh 100%
 string report_path = "J:\\Program Files (x86)\\FastReports\\FastReport.Net\\Demos\\Reports\\"; //reports folder
 System.Data.DataSet dataSet = new System.Data.DataSet(); //create a dataset
 dataSet.ReadXml(report_path + "nwind.xml"); //load the xml db
 webReport.Report.RegisterData(dataSet, "NorthWind"); //register db in thr report
 webReport.TabPosition = TabPosition.Hidden; //hide the detail reports tabs
 webReport.ShowBackButton = true;// show back button
 ViewBag.WebReport = webReport; //pass the web report to View
 return View(); }

這里有兩個有趣的選項：TabPosition和ShowBackButton。第一個負責(zé)顯示工具欄上的報表標(biāo)簽。我們已經(jīng)隱藏了標(biāo)簽。第二個選項設(shè)置“返回”按鈕。它可以讓你回到以前的報表。

現(xiàn)在我們將在視圖中顯示報表。我們打開index.cshtml文件（Views-> Home文件夾）進行編輯。

設(shè)置頁面標(biāo)題并顯示網(wǎng)頁報表：

@{
 ViewBag.Title = "Home Page";
}
@ViewBag.WebReport.GetHtml()

在_Layout.cshtml文件的<head>部分添加腳本和樣式：

<head>
@WebReportGlobals.Scripts()
@WebReportGlobals.Styles() 
</head>

在“視圖”文件夾中的Web.config文件中添加命名空間。

<namespaces>
 <add namespace="FastReport" />
 <add namespace="FastReport.Web" />
 </namespaces>

添加位于項目根目錄的處理句柄Web.config文件：

<system.webServer> 
 <handlers>
 <add name="FastReportHandler" path="FastReport.Export.axd" verb="*" type="FastReport.Web.Handlers.WebExport"/>
 </handlers>
 </system.webServer>

運行應(yīng)用程序。我們的矩陣報表大概長這樣：

如何在網(wǎng)頁報表中創(chuàng)建交互式矩陣