Creating Dashboards using Data View webpart

Data View web part can be linked to data source and made to display the data in dashboards which change visually when the underlying data changes.

Data View web part will be configured as per the requirement in SharePoint designer.

In this blog SharePoint lists are Inventory, having items with different columns.

Now this list will be linked with the Data View web part to show the list data into Dashboard, steps to achieve the same areas following:

Publish a diagram as a Web drawing

Step1: Open Microsoft SharePoint Designer 2010 from the Start menu-> All Programs -> Microsoft SharePoint Designer 2010

Step2: Go to File->Sites and select Open Site, here we have chosen the required site on which the data source(list) is.

Step3: It will open the site page. Here we see different options to modify the site. Here we select Edit Site Home Page, which will redirect you to the site page.

Step 4: Here we select Data View under Insert tab. While the cursor is at web part section of the page.

Step5:  When you click on the Data View it will show us a dropdown here we select Empty Data View option

Step 6:  This will insert a data view control on to the web part section of the page. With an option to select the data source.

Step 7: When you click on the option to select the data source , a small window will be opened , where from you can select the data source(in our case a list)

Step 8: When you select the data source, a new window will be opened in the side panel. It will ask you to select the desired columns/ fields you want in the Data View. It will also ask you how to display the data(like Single item or Multiple Item and like Form or View) 

Step 9: Here we select all the desired fields and select  Multiple Item View . Data will be fetched from the source & will be displayed in the Data View

Step10:  Now we will modify the Data view as per our requirement. We can modify directly through design or we can also do that through code behind to achieve the desired results.

Now we can see our Data View has been modified. It has different properties like GroupBy, Hyperlink, Table Borders, & little styling as well.

We can Save our changes to the site & can preview our site in browser using F12 .