Table of Contents

Introduction

Features

Installation

Webforms

Tips

Guide

Creating a New Dashboard

Adding Report Parts to the Dashboard Tile

Moving & Resizing Dashboard Tiles

Tile Customizations

Viewing an Existing Dashboard

Main Dashboard Menu

Introduction

Izenda now offers its new Angular.js Dashboard Designer / Viewer with the platform’s latest update to 6.9. Once implemented, any existing dashboards will automatically convert to the new dashboard format. While previous versions were limited to a static structure for the dashboard, tiles can now be resized. Users can add new tiles to any point on the grid in the Dashboard Designer. The dashboard displays with more fluid animation as well. The new Dashboard Designer/Viewer also includes a presentation mode, which allows the user to slide through dashboard tiles on a carousel.

Features

New responsive Angular.js Dashboards
User friendly user interface
Modern Look and Feel
Movable and resizable tiles
Presentation Mode to scroll through full screen dashboard tiles

Installation

Webforms

Download the full Webforms kit and replace the bin and resources folders within your projectt
Take the Dash.aspx and Dash.aspx.cs files from the downloaded kit and copy it to your project

Update Default.Master with the new changes to update links to Dash.aspx from Dashboards.aspx

  <div class="top-nav applyStyles" id="blueHeader">
    <div class="page">
      <ul id="topnav" style="margin: 0px; padding: 0px;">
        <li class="top-nav-item"><a href="ReportList.aspx">Reports</a></li>
        <li class="top-nav-item"><a href="Dash.aspx?clear=1" onclick="ShowRlToDbLoading();">Dashboards</a></li>

In the global, update the dashboard viewer setting to AdHocSettings.DashboardViewer = "Dash.aspx";, as well as the dashboard designer setting to AdHocSettings.DashboardDesignerUrl = "Dash.aspx";. Additionally, set AdHocSettings.DashboardDateSliderMode = DashboardDateSliderMode.None;, this will enable between date filters to be exposed in the new dashboard. Without this setting date filters will not be exposed.

MVC

Download the full MVC kit for 6.9
Copy the bin and resources from the kit downloaded into your project
Add: _Dashboards-New-Head-Angular, _Dashboards-New-Body-Angular, _SiteLayout and Dash files to Views/Reporting. Ensure they are included in the project

Update the IzendaReportingController.cs to include:

  public ActionResult Dash() {

    return View();
  }

In the global, update the following: AdHocSettings.DashboardViewer = "Dash" and AdHocSettings.DashboardDesignerUrl = "Dash";. Additionally, set AdHocSettings.DashboardDateSliderMode = DashboardDateSliderMode.None;, this will enable between date filters to be exposed in the new dashboard. Without this setting date filters will not be exposed.

Tips

When upgrading, ensure log4net.dll and log4net.xml are in the Bin folder
If you get an error stating System.Web.Mvc or System.Web.Mvc.Ajax are not in the namespace, right-click the file in the references, click properties and ensure Copy Local is true.

Guide

Creating a New Dashboard

a) Click on the arrow to expose the drop down menu under New
b) Select Dashboard from the Menu drop down. A New Blank Dashboard will be exposed with a blank tile.

Adding Report Parts to the Dashboard Tile

c) Click on the + sign to add a Report Part to the new Dashboard

d) The user can now select a report to use in the dashboard.

e) Once a report is selected, the user is presented with a window displaying all of the report parts as options to add to the new dashboard. These can include charts, maps, gauges, summaries or report details.

f) The report part selected will then be displayed to the user.

To remove a tile, simply click the “X” in the top right corner of the tile.

To add additional tiles to the dashboard, the user can click on a blank area of the dashboard background.

A new blank tile will then be displayed.

The user can repeat the process to add additional tiles

Moving & Resizing Dashboard Tiles

The tiles can be resized by dragging the corners to the desired length or width. Tiles can also be moved around the Dashboard. When the tile shows a green hue, it is positioned correctly and can placed on the grid. If the tile shows a red hue, it is not positioned on the grid properly and cannot be moved.

Properly Positioned Tile for move (green hue)

Improperly Placed Tile for move (red hue)

Tile Customizations

There are several options available for customizing a tile. These options can be found by clicking on the menu button in the top right corner of the specific tile. The tile will then spin to the reverse side, revealing the additional options.

The user can now choose to add a Tile that is displayed on the front of the tile along with a Description that is also displayed on the tile

The additional following menu items are available for use on the back of each dashboard tile

Appearance	Description
	Print tile report – prints the tile from dashboard
	Export tile report to Excel
	Opens the Report the tile is created from in report editor
	Opens the Report the tile is created from in the report viewer
	Reloads the tile from report
	Add a new report part to tile (change report part selected from original report)
	Change the Number of Records to be displayed in the tile

Viewing an Existing Dashboard

Click on Dashboard at the Top Navigation Bar

Dashboards will be displayed as tabs in the window with the active window highlighted from below

Main Dashboard Menu

This menu offers the following menu options are available from the menu button in the top left navigation bar when expanded

Appearance	Description
	Collapse Menu
	Presentation Mode – Allows the user to scroll through the Dashboard tiles in a carousel
	Create a New Dashboard
	Refresh Tile Data. This button will refresh data only aspects of the tile, meaning the report query will be rerun with current settings and tile data updated.
	Refresh Report Metadata. This button will refresh non-data elements of the tile such as style and filter settings.
	View Filters – Each report in the dashboard must share the same filter to be displayed
	Share Dashboard with other users
	Schedule Dashboard - Sends dashboard via email at a scheduled time
	Print Dashboard = Prints Dashboard HTML or Report PDF
	Save Dashboard - Saves dashboard as different name or pdf file
	Change Dashboard - Changes background image

Guides/Dashboards v2