Page History
Anchor | ||||
---|---|---|---|---|
|
Table of Contents | ||||
---|---|---|---|---|
|
Overview
The following sections outline sample dashboard content developed with DashXML and Yellowfin content. It will explore each of the avilalbe widget types, how they were set up in the XML, and how they were styled through custom CSS.
Note: this is merely a guide in order to walk you through using the DashXML framework for your own dashboard requirements.
The main XML widget types consist of the following:
Code Block | ||||
---|---|---|---|---|
| ||||
<application-definition> <sourcefilter></sourcefilter> <dashboard> <text></text> <exportlist> <export><export> </exportlist> <filter> <options> <summary><summary> </options> </filter> <report> <modal> <subcontent></subcontent> </modal> <filterMap></filterMap> </report> <modal> <subcontent></subcontent> </modal> <customhtml> <replacements></replacements> </customhtml> <subtab> <options> <subcontent></subcontent> <summary></summary> </options> <subtab> </dashboard> </application-definition> |
The full XML structure is outlined on the Widget XML page.
Dashboard Widget
Styleclass | ||
---|---|---|
| ||
Sub Tab Widget
Styleclass | ||
---|---|---|
| ||
Example Output
Example Elements
Expand |
---|
|
Example XML
Expand |
---|
|
Example CSS
Expand |
---|
|
Text Widget
Styleclass | ||
---|---|---|
| ||
<text>
XML Widget. This will simply need to contain the text to be displayed as the title, and a css class name to be used for styling that text.Example Output
Example Elements
Expand | |||||||||
---|---|---|---|---|---|---|---|---|---|
|
Example XML
Expand | |||||||
---|---|---|---|---|---|---|---|
|
Example CSS
Expand | |||||||
---|---|---|---|---|---|---|---|
|
Export Button Widget
Styleclass | ||
---|---|---|
| ||
<exportlist>
XML Widget. This will need to define which export formats you wish to allow, and which report to export (if you are using XLS).Example Output
Example Elements
Expand | ||||||||||||||||||||||||||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
|
Example XML
Expand | |||||||
---|---|---|---|---|---|---|---|
|
Example CSS
Expand | |||||||
---|---|---|---|---|---|---|---|
|
Filter Widget - Dates
Styleclass | ||
---|---|---|
| ||
<filter>
XML widget. Each filter widget requires at least one option to be defined, allowing the user to select a value to apply. This particular filter has four options; Custom, Year, Month, and All Time. The Year, Month, and All Time filters have been set up using pre-defined date ranges, while the Custom option was specified as user prompt in order to allow users to specify a custom range.Example Output
Example Elements
Expand | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
|
Example XML
Expand | |||||||
---|---|---|---|---|---|---|---|
|
Example CSS
Expand | |||||||
---|---|---|---|---|---|---|---|
|
Filter Widget - Buttons
Styleclass | ||
---|---|---|
| ||
Example Output
Example Elements
Expand | |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
|
Example XML
Expand | |||||||
---|---|---|---|---|---|---|---|
|
Example CSS
Expand | |||||||
---|---|---|---|---|---|---|---|
|
Report Widget
Styleclass | ||
---|---|---|
| ||
Example Output
Example Elements
Expand |
---|
|
Example XML
Expand |
---|
|
Example CSS
Expand |
---|
|
Modal Window Widget
Styleclass | ||
---|---|---|
| ||
Example Output
Example Elements
Expand |
---|
|
Example XML
Expand |
---|
|
Example CSS
Expand |
---|
|
Custom HTML Widget - Text & Report Data
Styleclass | ||
---|---|---|
| ||
<customHTML>
XML Widget along with other elements to produce a combined output. In this scenario, we wanted to display the first date we have records for within the user selected filter date range. To do this we wanted to combine some static text with a date record from a report. The widget needed to contain HTML to display the static text, such as "Your camp started on: ", and the dynamic date element that comes from the result of a Yellowfin report. In order to do this, you will also need to include the report that returns the date as a hidden report.Example Output
Example Elements
Expand | |||||||||||||||||||||||||||||||||||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
|
Example XML
Expand | |||||||
---|---|---|---|---|---|---|---|
|
Example CSS
Expand | |||||||
---|---|---|---|---|---|---|---|
|
Custom HTML Widget
Styleclass | ||
---|---|---|
| ||
Example Output
Example Elements
Expand |
---|
|
Example XML
Expand |
---|
|
Example CSS
Expand |
---|
|
horizontalrule |
---|
Styleclass | ||
---|---|---|
| ||