LightSwitch Reporting–A fully integrated data presentation solution (Charts)

I wanted to continue to show off the amazing features that come bundled with our reporting offering for LightSwitch. Our developers have done a fantastic job incorporating *all* of the elements required to present data in a concise and effective manner. Today I thought I would show off the the embedded charts that come with our solution.

Charts

The old adage that “a picture is worth a thousand words” rings true when it comes to presenting information in charts. Charts graphically summarize vast amounts of data in a small amount of space while maximizing information comprehension. Our chart wizard is second to none when it comes to available chart options and customizations. There are over 50 distinct chart types with a myriad of ways to customize them. Some of the available customizations include interactivity, look and feel, indicators, constant lines (and we are only scratching the surface here people).

Step 1: The data

Enough chatter! Let’s take a look at how to do charts in LightSwitch reports. The first thing to remember is that our components work natively with LightSwitch Entities and Queries. We will start with where we left off after our LightSwitch Webinar. In this webinar we used the Course Manager sample application to create interactive reports. Lets continue by adding a calculated field to the Student Entity that calculates the number of enrolled courses per student:

Once the field is typed in we set the Type to integer, check the Is Computed field,

and select Edit Method to generate the proper value:

These changes will then propagate to our custom LightSwitch Data Source control and enable us to create a bar chart depicting all students and the number the respective number of enrollments.

Step 2: Adding the Chart

There are really only three things that should be done in order to get the chart up an running within the report. Lets open the Student Report we created in the video. If you are starting from scratch create a new report and simply click on the report smart tag to select the Student entity as the report’s data source. Now lets drag a chart on to the report. Within LightSwitch all you have to do is Right-Click on the report and select Toolbox to be able to drag the control onto the design surface:

Once this action is complete, the Chart Wizard will automatically fire. The pages of most importance include the Chart Type page, the Series page and the Data page. In this example we will only have one series for the enrollment count. Once we select the chart type as a bar chart and rename the series we go over to the Data page and set the Argument binding

and the Value bindings

Notice how the chart automatically understands the calculated field (EnrollmentCount) that we added previously. At this point you can click on Finish.

Step 3: Enjoy

If you are following along with the completed project from the webinar, the screen should be prepared already. If not it is very easy to add a report screen to the LightSwitch application.

Final Thoughts

The best part of our reporting solution is that it is truly a fully integrated approach to presenting data in your LightSwitch application. Stay tuned! Next time we will look at additional reporting tools available in your analytics arsenal complements of DevExpress Reporting for LightSwitch!

Take a look at our LightSwitch Page: http://www.devexpress.com/LightSwitch

As always, if there are any comments and/or questions, feel free to get a hold of me!

Seth Juarez
Email: sethj@devexpress.com
Twitter: @SethJuarez

Let us know what you think of our Reporting Suite by rating it in the VS Gallery!

Free DevExpress Products – Get Your Copy Today