Creating a Simple Dashboard | Syncfusion Blogs
Live Chat Icon For mobile
Live Chat Icon
Popular Categories.NET  (166).NET Core  (29).NET MAUI  (116)Angular  (93)ASP.NET  (51)ASP.NET Core  (81)ASP.NET MVC  (89)Azure  (39)Blazor  (174)BoldSign  (2)DocIO  (23)Essential JS 2  (95)Essential Studio  (186)File Formats  (40)Flutter  (124)JavaScript  (210)Microsoft  (116)PDF  (72)React  (84)Succinctly series  (130)Syncfusion  (685)TypeScript  (33)Uno Platform  (3)UWP  (4)Vue  (45)Webinar  (41)Windows Forms  (59)WinUI  (60)WPF  (143)Xamarin  (158)XlsIO  (27)Other CategoriesBarcode  (5)BI  (29)Bold BI  (6)Build conference  (7)Business intelligence  (54)Button  (4)C#  (127)Chart  (73)Cloud  (13)Company  (445)Dashboard  (8)Data Science  (3)Data Validation  (7)DataGrid  (60)Development  (494)Doc  (7)DockingManager  (1)eBook  (98)Enterprise  (22)Entity Framework  (5)Essential Tools  (14)Excel  (25)Extensions  (21)File Manager  (5)Gantt  (16)Gauge  (11)Git  (5)Grid  (28)HTML  (13)Installer  (2)Knockout  (2)Language  (1)LINQPad  (1)Linux  (2)M-Commerce  (1)Metro Studio  (11)Mobile  (378)Mobile MVC  (9)OLAP server  (1)Open source  (1)Orubase  (12)Partners  (21)PDF viewer  (34)Performance  (12)PHP  (2)PivotGrid  (4)Predictive Analytics  (6)Report Server  (3)Reporting  (10)Reporting / Back Office  (11)Rich Text Editor  (10)Road Map  (11)Scheduler  (47)SfDataGrid  (9)Silverlight  (21)Sneak Peek  (25)Solution Services  (3)Spreadsheet  (11)SQL  (10)Stock Chart  (1)Surface  (4)Tablets  (5)Theme  (12)Tips and Tricks  (107)UI  (264)Uncategorized  (68)Unix  (2)User interface  (68)Visual State Manager  (2)Visual Studio  (24)Visual Studio Code  (17)Web  (461)What's new  (245)Windows 8  (19)Windows App  (2)Windows Phone  (15)Windows Phone 7  (9)WinRT  (26)

Creating a Simple Dashboard

This post has been adapted from “Creating a Simple Dashboard,” one of Syncfusion’s growing number of informative videos.

Creating a dashboard using Syncfusion’s Dashboard Designer, part of the Syncfusion Dashboard Platform, is a simple process. For purposes of demonstration, we will be creating a straightforward dashboard to display financial information for a restaurant regarding its online orders, including expenditures, revenue, and other details.

Our End Goal

The first step is to add a data source. This can be managed from the Data Source subwindow on the right side of the main Dashboard Designer screen. Once the data source is selected, you will be taken to the data source management screen. Here, the data source can be given a custom name for ease of use while we create our dashboard. For this dashboard, we will name our data source “OrderDetails.”

The Data Source Subwindow (Highlighted)

Now that a data source has been selected and named, it is time to pull information from it to construct our dashboard. On the left side of the data source management screen, we can see a selection of menus. The Tables menu displays the categories of information pulled from the data source. This information can be added to the dashboard by dragging the desired categories from the left pane into the stage. For our purposes, we will select Orders, Restaurant, Bill, and Expense.