Elixir Dashboard Designer User Manual
Contents
1. FruitSales_Checkbox FruitSales C Apple Apple Orange Orange Strawberry C Strawberry Berry C Berry FruitSales_RadioBtn FruitSales_DropDownList Apple Apple v Orange Strawberry Berry HTML In HTML user can enter any URL of a webpage and in a frame or page If Embed HTML in Frame is selected the webpage will be displayed within the frame Embed HTML in a Page is seldom used for a webpage as there will be too much to process since they are scripts from both the perspective and webpage to load If user chooses to embed the HTML in a page there is a choice of Display content from URL and Display content from HTML text The difference is that one will display the contents of the selected page while the other will display contents entered by user in the provided field If the user selects Display content from HTML text the user can either choose to enter HTML codings manually or click Edit HTML whereby when the user finishes entering and or formatting the contents in the field as seen in Figure 2 13 HTML Editor it will be converted into HTML codes automatically as shown in Figure 2 14 Completed HTML codes 20 Contents Figure 2 13 HTML Editor HTML Editor File Edit View Font Format Search Insert Table Forms Help afro lsfefo le isla le 6 This is a sample of a HTML content Figure 2 14 Completed HTML codes Add Content HTML Content Ente2. 0 0 0 0 0 0 0 0 gt gt gt Note From Repertoire 7 4 onwards when user tries to right click within a particular column of a Table element a new option Format is available The Format wizard has 3 tabs Format tab allows to select the format type for that particular column The choice of Currency Percent Number and Date Time is available e Render tab allows user to change the icon background and foreground colour of row s in the particular column that satisfies the specified condition e Options tab determines the display of text and icon and also the alignment Case Study 1 Filter Sort and Extract Data In this case study filtering sorting and extracting data from the wizard and using view ViewName Selection will be covered The idea of this dashboard is to select a product_id from a Grid element and a Table element will display records with the selected product_id The border title for the Table element will display the product_id selected 1 Create a JDBC datasource and name it Sales using MondrianFoodMart Click on the Query Builder button and use the table named sales_fact_1997 Select all the fields Infer the schema and end the wizard 2 Create another JDBC datasource and name it Sales_param Then follow the steps mentioned above except in the SQL Query enter WHERE sales_fact_1997 product_id id after the line that says FROM sales_fact_1997 Infer the schema When promp
3. A Apple 201 0 102 0 199 0 232 0 A Orange 323 0 32 0 55 0 23 0 ao A Strawberry 99 0 20 0 39 0 23 0 SS B Apple 201 0 102 0 199 0 232 0 B Orange 323 0 32 0 55 0 23 0 EH B Strawberry 99 0 20 0 39 0 70 0 B Berry 23 0 320 34 0 76 0 60 C Apple 120 0 232 0 232 0 322 0 Orange 323 0 32 0 43 0 787 0 30 C Strawberry 122 0 2 0 20 70 0 EN c Berry 343 0 232 0 23 0 332 0 30 20 10 11 Try clicking on other rows in the Table element The SWF Table will react based on the data selected and you will be able to see the chart in action Case Study 6 SWF Slider with Chart The prerequisite for this case study is to have a swf file that has the design of a slider As a reminder the slider wouldn t be seen in Repertoire Designer nor Remote Designer The only way to see the slider work is to view the dashboard over the server 1 Ina newly created Perspective drag the RangeSlider swf file with range slider design into the blank space 2 Select the datasource to be used In this case study we ll be using FruitSales ds 3 Click on Next 5 times The skipped pages are for sorting and filtering of data 4 This page of the wizard is for the user to enter parameter values to be passed to the swf file name Field mandatory the field that the slider represents x optional the X location within the SWF rectangle The default value is 0 which is about 5px from the edge due to SWF having Spx padding
4. The JavaScript code executes in the context of the Perspective application itself which provides some useful helper functions to access content and views e Content getContent contentName e Panel getPanel panelName e void refresh panelName In addition some context objects are available e Parameters Use Parameters get Name to access any dynamic parameter values e State The overall dashboard state from here you can navigate and interact with all parts of the dashboard e thisState The state on which the event was triggered e thisEvent The event String that was triggered Note The full Perspective scripting API is described in Chapter 5 Script Reference and the separate PML Object Model documentation Triggering Actions from Events Actions are defined using the Actions table on the Perspective tab Each action identifies the trigger conditions by defining the combination of lt content view event gt that it responds to An empty value means that it matches all possible events For example lt CubeData select gt matches the select event on CubeData the content in any view For event name matching only the text string up to the first colon is matched This allows lt MyChart MyView click SomeURL gt to be matched by an action defining lt MyView click gt which means any click on MyView Only actions which are marked as enabled are eligible to be invoked in response to an event This allows a subset of ac
5. 3 Drag FruitSales ds from the repository to the workspace On releasing of the mouse a popup with four different options will appear It s for the user to select the element to add to the Perspective In this case we will add a Table element by selecting Add Table 4 On clicking a table with all the data from FruitSales ds will be displayed The Table element will appear About Elixir Dashboard Designer Figure 1 5 Table on Perspective FruitSales ple Orange Strawberry ple Orange Strawberry Berry ple Orange Strawberry erry A A A B B B B Cc Cc c c Drag FruitSales ds into the workspace again A blue box will be shown to indicate the placement of intended content as shown in Figure 1 6 Placement of Intended Content Over here we will be placing it on the left of the table When the mouse click is released select Add Chart and the content will be created on that region About Elixir Dashboard Designer Figure 1 6 Placement of Intended Content 6 Inthe Add Content Wizard change the name to FruitSales_Chart for easy reference 7 In this example we will create a Column Chart with Fruit as the key and 1997 1998 1999 and 2000 as the values About Elixir Dashboard Designer Figure 1 7 Chart and Table on Perspective FruitSales_Chart FruitSales Co
6. Available datasources All Selected Unselected SWF Chart SWF Chart displays a Chart element in a more attractive and vibrant manner compared to JFreeChart Moreover the user will be able to see the change in action when viewing the chart in the web interface of Repertoire Server In the section called Case Study 5 SWF Chart it explains the way to create a SWF Chart Available datasources All Selected Unselected Table A table shows records from a datasource one row per record This is a one dimensional presentation unlike the cube table which has two dimensions of variation As with the other datasource based contents the records can be filtered before showing and in the case of table columns can also be discarded This means the user can focus on just the few fields that are important Of course for even more control then table can be backed with a Composite DataSource that provides additional processing options Table data can be saved into a CSV DataSource Excel or XML file for subsequent processing Available datasources All Selected Unselected 23 Contents Figure 2 17 Table on Perspective Perspective View a lt FruitSales Company Fruit 1999 1998 Apple 102 0 199 0 Orange 32 0 55 0 Strawberry 20 0 39 0 Apple 102 0 199 0 Orange 32 0 55 0 Strawberry 20 0 39 0 Berry 32 0 34 0 Apple 232 0 232 0 Orange 32 0 43 0 Strawberry 2 0 2 0 Berry 232 0 23 0
7. Title Bar Tip is a field for entering some text for the tooltip The tooltip will appear when a cursor is placed over the top bar of the element s content border You will need to enter some text under Title Bar Tip and apply border to the element before any tooltip can be seen A Border is a set of images in a repository folder that are used to construct a frame around the content and padding To select a border you need to select the folder that contains the images There are a number of samples provided in ElixirSamples Resources Borders for example you might choose ElixirSamples Resources Borders Lavender You can create your own custom borders by following the examples Your borders don t need to have images on all sides of the frame Any missing images will just appear blank It is important for correct web display that the widths and heights of all images are consistent For example the heights of topleft top and topright images must be the identical If a border is chosen that supports titles if there is a title xml in the border folder then any text entered here will be placed on the border using the information provided by the title xml You may either use a fixed text string or substitutions The available substitutions are ContentName the name of the content ViewName the name of the view ShortDate the short form of the current date ShortTime the short form of the current time JavaScript Any JavaScrip
8. 23 F filter 9 G glint 17 22 grid 18 H html 20 image 21 map 22 maximize 35 P pdf 22 R report 22 S split 35 swf 23 swfChart 23 T table 23 action 2 47
9. y optional the Y location within the SWF rectangle The default value is 0 which is about 5px from the edge due to SWF having Spx padding width optional the width of the slider The default is set to 100 However when entering a figure do not use percentages The unit of measurement for width is pixel height optional the height of the slider The default is set to 100 However when entering a figure do not use percentages The unit of measurement for height is pixel grouping optional Three different values can be entered None Ordered and Sorted The default value is None Ordered will list the figures in the order that it is in the datasource Sorted will list the numbers in ascending order 32 Contents 10 e labels optional words to show on the slider This is only applicable when grouping is None e snapinterval optional the number of units moved with each click on the slider e tickInterval optional the incremental value of each marker on the slider For this case study have 2000 as the value for nameF ield and Sorted for grouping Click on Finish Next drag FruitSales ds to the right of the SWE In the View tab select E1xRangeSlider which is the swf file then the selected option Click on Finish Save the dashboard and go into the web interface of the server Try dragging the slider to different figures The table on the right will reflect records ranging between the chosen
10. 11 Add Content Wizard The normal behaviour of grid selection is to turn off other selections each time a new selection is made unless Control is held down The grid also includes a Toggle Selection option which changes the behaviour so that the first click selects an item and a subsequent click on the same item is required to deselect it This behaviour is often preferred as it prevents accidentally losing a set of existing selections by forgetting to press Control Check on the checkbox that says Show as Drop Down List to create a Drop Down list Enter a name for the Label so a name will be displayed beside the Drop Down list in the Dashboard See Figure 2 11 Add Content Wizard Note that the Sort in Figure 2 11 Add Content Wizard overrides the Sort in the earlier page of the wizard Checking on the checkbox that says Show as Radio Check Boxes will create checkboxes To create radio buttons check the Single Select option Figure 2 11 Add Content Wizard Add Content Grid View Choose grid display options Field name required Field Direction i Across then Down Down then Across E Sort C Single Select L Toggle Selection a Show as Grid Show as Drop Down List Label Show as Radio Check Boxes Previous x Finish Cancel Available datasources All Selected Unselected Contents Figure 2 12 Grid on Perspective
11. 2000 Only those records that pass all the rules are allowed to proceed The filter criteria used here are the same as those used in the Filter Processor in the Data Designer manual Please see that discussion for full details on the options available Sorting allows you to sort the records into ascending or descending order based on the values in fields Multi level sorting is supported so you can sort by Country and then City and the tool will ensure that the Cities are sorted within their respective Countries Contents such as Chart Grid Table and Cube have sorting capabilities now Sorting within the view will override any earlier sorting but will occur after any extraction For example you can sort sales people by performance extract the top ten and then show them in a chart sorted in alphabetical order Two variants of sort are supported regular Ascending and Descending and Simple Ascending and Simple Descending The Simple options are very fast but don t take into account complex character differences for example letters with accents produced by merged Unicode character combinations The regular Ascending and Descending use the full Unicode algorithms Further the Simple variants treat whitespace as significant whereas the Unicode algorithms don t just like a dictionary Extraction is the retention of certain records based on their position in the data set You might choose to extract those records at the top or the bottom of the set p
12. The Elixir Dashboard Designer toolbar is shown in Figure 1 3 The Dashboard Toolbar From left to right the contents are Home This button resets the dashboard to it s initial state That is all views are restored to their initial contents and initial selection About Elixir Dashboard Designer Back Just like a browser this button reverts to the previous dashboard state This can undo any undesirable change or navigate back to a previous position to allow further exploration Forward Again just like a browser this button takes you forward again redoing any action that was undone by pressing Back Card Combo This combo box shows all of the cards in the dashboard and allows you to choose one to view Actions can also be used to change the card as a result of events Dashboard Dimension The dimension of a dashboard can be specified by selecting the Perspective root of the view tree as shown in Figure 1 4 Dashboard Dimension The dimensions are measured in pixels Figure 1 4 Dashboard Dimension Views E Perspective Perspective El Carat width 7 000 Height sent Case Study This case study will create a simple dashboard built upon the ElixirSamples DataSource FruitS ales de datasource 1 Select a FileSystem Right click to select Add gt Perspective from the filesystem popup menu 2 When the Add Perspective window appears enter a unique name for the Perspective and click Finish
13. at different times Views may have titlebars that allow interaction with the underlying content and act as placeholders for connecting content together For example a chart may receive it s data for rendering from the selection in another view All views also have unique names to allow this kind of referencing Views are grouped together into cards Elixir Dashboard Designer shows one card containing one or more views at a time and user actions can be used to trigger navigation between cards The different kinds of view supported by dashboards are described in Chapter 3 Views Figure 1 2 Cards Views and Contents Perspective pml Actions Actions are invoked in response to events Typically these are user interaction events like selecting a row in a table or clicking on a detail in a report Certain actions are preconfigured if a chart shows the data from a table and the table contents changes then the chart is automatically refreshed Other actions can be user defined For example double clicking on a chart may open another view on that data Actions are chosen based on a combination of the user event the view and the content involved so a double click on two charts may result in two completely different actions it is completely user definable The different kinds of actions supported by a dashboard are described in Chapter 4 Actions The Dashboard Toolbar Figure 1 3 The Dashboard Toolbar ei Card1 v
14. click url doubleClick url refresh Report click url doubleClick url refresh Table refresh select Grid click key value doubleClick key value refresh select Map click key value doubleClick key value refresh select HTML click key value doubleClick key value refresh Elements written in braces like this xxx are substituted by dynamic values depending on where the event occurs These are usually preceded by a colon symbol Elements written in square brackets like this yyy are optional and may not be present if the information is not available For example a bar chart will have both a key and value string available whereas a pie chart will only offer a key Here s a description of when each event is sent click A click event is sent whenever a user clicks on a supporting view The click may include extra information after the event name for example click url if the click occurs over a mouse sensitive region in a glint or report or click key value if the click occurs over a chart doubleClick A doubleClick event is sent whenever a user clicks twice on the same view within a short preiod of time and without moving the mouse A click event will always precede a doubleClick event 37 Actions refresh A refresh event is sent each time a view is rendered because the underlying data has changed It is not necessary to respond to this ev
15. else if select getSelectedValue B paies Meca SO 119 47 Wee 99 179 143 Ip else if select getSelectedValue C patas Lee 47 18 152 Wie 147 1390 132 Ip if paints null var cds new CustomDrawingSupplier cds setPaintNames paints plot drawingSupplier cds Click on Next This is the page where the user can select the explicit dependencies Select CompanyName This will let the Chart element know that it will be depending on the Grid element Click on Finish to create the Chart successfully Try clicking on the options in the Grid element The Chart element below will change its colour according to the colours specified in the script as seen in Figure 2 21 Final Result 29 Contents Figure 2 21 Final Result Perspective View EN Card1 Perspective View ei Card1 AA GE 2000 Case Study 4 SWF Content The purpose of this case study is to demostrate the way to use a SWF element as a table and displaying the data selected 1 2 In a newly created perspective drag FruitSales ds into the blank space and select Add Table After clicking on Next once click on Finish Next drag the Table swf to the bottom of the table This file can be found in ElixirSamples Dashboard SWF Dashboard swfs The Add Content window will appear Click on the View tab and select FruitSales and Sele
16. o 1999 1998 pple range Oloo 00 00 gt Repeat step and 2 Place the blue region on the right of FruitSales_DropDown and select Add Cube Click through the wizard without changing any settings You can adjust the height and width of each element by dragging the sides At the end of this the whole Perspective should look something as shown in Figure 1 9 Completed Perspective About Elixir Dashboard Designer Figure 1 9 Completed Perspective FruitSales_DropDown FruitSales_Cube Li rg se A Apple o Jl Bew A Orange Strawberry FruitSales_Chart 300 250 200 150 100 50 1998 1999 2000 Chapter 2 Contents Introduction Elixir Dashboard Designer provides different kinds of content from which you can compose your views Every content must have a unique name within the Perspective so that it can be referenced Each kind of content reads data and renders it into a view The views then provide the ability to interact with the content Most kinds of content read from a datasource There are two kinds of datasource available the ds files in the repository which can be JDBC XML etc and dynamic datasources where the data records are extracted from other views The first kind of datasource will be identified with a repository URL whereas the dynamic data will be accessed with a view URL When the datasour
17. order for the border title of the Table element to display the product_id selected in the Grid element right click anyway on the Table element Select Presentation The default value for Border Title is ContentName which is the name of the element in the perspective This name is editable at the properties of the element To change it to reflect the selected product_id enter view Sales selected product_id in the Border Title field Click on Finish to exit from the wizard 12 Try clicking on some of the values under Sales The value selected will also be the border title of the Table element which is similar to Figure 2 19 Results of Case Study 26 Contents Figure 2 19 Results of Case Study Perspective View e 719 customer_id product_id promotion_id store_co 1633 719 1199 5 0225 2389 719 504 2 5725 2405 719 11866 2 2785 3572 719 1829 3 0135 3866 719 1129 11 813 4609 719 11772 2 352 6007 719 11856 2 2785 Case Study 2 Chart Drilldown In this case study we will demostrate how to use the Chart element drilldown function l The first element to create needless to say will be the Chart element Drag FruitSales ds into the Perspective and select Add Chart After clicking on Next 4 times you will need to select a chart type Select Pie followed by Pie chart then Next For the Key tab se
18. used to get the selected records from the view Support for Unselected means the view name followed by unselected can be used to get the unselected records from the view The figure below Figure 2 2 Dynamic Datasource shows the screen where a user selects a dynamic datasource to use Figure 2 2 Dynamic Datasource Edit Content Table Choose a data source Name IFruitsales URL lrepository Sample FruitSales ds Repository View Left All Right O Selected Unselected L Auto Refresh Previous Next Finish Cancel If a datasource has a parameter there will be a page in the wizard for specifying the value of the parameter as shown in Figure 2 3 Datasource Parameters 10 Contents Figure 2 3 Datasource Parameters Add Content Enter DataSource Parameters Enter parameter values to be passed to the datasource Finish Cancel Previous Next Filtering Sorting and Extracting Data from a datasource or another view can be filtered and sorted before being passed to the view Certain records can also be extracted for example the top ten or bottom five can be retained and the rest discarded this extraction operation occurs after any filtering and sorting Filtering allows you to define rules that each record is tested against A typical rule might be Country Equals Singapore or Salary Greater Than
19. value as in Figure 2 24 SWF Range Slider Figure 2 24 SWF Range Slider ElxRange Slider FruitSales Company Fruit 2000 1999 1998 1997 Strawberry 99 0 20 0 39 0 23 0 Strawberry 99 0 20 0 139 0 70 0 Apple 120 0 232 0 232 0 322 0 A B B Berry 23 0 32 0 134 0 76 0 C C Strawberry 122 0 2 0 20 70 0 23 99 120 122 201 323 343 I I j I I I A mmm 33 Chapter 3 Views Introduction Elixir Dashboard Designer provides a hierarchy of views to control the layout of content The topmost view is the Card There may be many cards in a dashboard but only one card is visible at a time and switches between cards can be done either manually using the combo box on the titlebar or based on actions For example a double click on a chart could switch to a card that contains a breakdown of the information in that chart Within a card there may be two kinds of view split views which divide the available space amongst their children and content views which render content such as a chart or table Card The card is the top level view As mentioned in the introduction a dashboard can contain many cards but only one can be visible at a time Every card must have a unique name allowing it to be selected in response to user actions A card is implemented as a kind of split view So the discussion of split view below also applies to card Cards can also define a background colour wh
20. Elixir Dashboard Designer User Manual Release 8 0 Elixir R pertoire Elixir Technology Pte Ltd Elixir Dashboard Designer User Manual Release 8 0 Elixir Technology Pte Ltd Published 2010 Copyright 2005 2010 Elixir Technology Pte Ltd All rights reserved Solaris Java and all Java based trademarks and logos are trademarks or registered trademarks of Sun Microsystems Inc Microsoft and Windows are trademarks of Microsoft Corporation Table of Contents 1About Elixir Dashboard Designer ce s5ccsenes esate Reha ENEE ENEE ENNER SEENEN ENEE EEN 1 Introduction nisin EE Di ns eRe 1 ET UC 2 KC H ACUONS Ee EE e be EE e Ee ENEE EE 2 The Dashboard Tool bar ss cce c ccestarste A a E 2 Dashboard DIMENSION 3 5s cdecsorevesecs ENEE SEENEN ENEE SEENEN Eege 3 Case EE 3 2 CONTENTS bass obsess Sense she BEE EE eeh BEE dE pare sae ee meee 9 lire E e 9 Dynamic DataSOurces 0 555 s5 sc rois nen oE saa NEE ENEE EES seses eds vertendsseesbegeae sense soos 9 Filtering Sorting and Extracting 2 0 0 0 cee cece cee cee ca eeca cece eene eens een eeneeeneeeeeeeenes 11 En Te 12 Initial Selection getest ee ES Seege 13 En SE 14 Cube Tableta e Galan ies vores le eben eres 16 GIN sass criar dee ticos metas eben ee 17 C to eet Seed PR EES Os hes ERA OS 18 TEM LEE 20 MM E E E E e S EE EEE O E EA A E EE EE 21 Map reran da T E RE T REEE E E EA E A Sek ER 22 O 22 DWE eeh Reegele E E ENEE ENEE ENEE SEN 23 SWE Chart iii is 23 T
21. HTME Editor 7 ses iaa ve tenian dee EEN EEN EEN eet cede 21 2 14 Completed HIME COdeS sssrin ERNEST paves ee Sees Sess Subs ads ieoa EPT dane PERES 21 2 15 Image on Perspectives vncccssietecisie voce E E EE EEE oeste car ide 22 2 16 Report on Perspective ze denge EENS EENS EBEN EENS 23 217 Table om Perspective EE 24 2 18 Initial Selection Wizard AAA TN 26 2 19 Results of Case et ogc sista nace oaks ANERER ENEE 27 2 20 Results Of Case Study Zeen EE a E EENS EEN sas Sank aps 28 2 21 Final Result ocre nara 30 222 SWE Chatt esere soeia essa des edn veg sand Sebotes esa dos SEEE E TEE ER PIA dda P E E STENENE 31 2 23 AA GEET 32 Z2A SWF Range Slider iii diria 33 A 34 US O coisa discseaa er aE SEE EE cdsbedee uss E aE PaE EE CEET NEEESE R EOIS SEE NRS 35 4 1 Default screen of Action Wizard eeesesneneeesesesessesesesreresrrrsesreresesrereseresesreresesrerete 40 4 2 Generate Data Wizard eessen ENEE nck REESEN E E T EE EEES 40 4 3 Sample A AA ia I 41 4A Render Wizard EE 42 DL Sept Action rca dani tapia E 43 Chapter 1 About Elixir Dashboard Designer Introduction Elixir Dashboard Designer is a tool for navigating and visualizing enterprise data A dashboard can assemble a comprehensive view of the available information It provides e Seamless navigation between data cube and reports with user customizable views e On demand cube creation and modification of dimensions and measures for data analysis e Graphical
22. PIs for controlling the Dashboard through scripts Each view that is positioned on a card in the dashboard is accessible through a state object The view itself is not accessible because it may be a graphical view ie in the Designer or Remote tool or it may be an HTML view in a browser The states can be identified by the name of the view they represent To create a JavaScript action choose the Perspective tab on the designer and add a new Action to the Action table at the bottom right Choose Script as your Action type and proceed to add your script in the available field The dialog is shown in Figure 5 1 Script Action Figure 5 1 Script Action Action Sample _ click z Script gt A f f this JavaScript will be executed when the user clicks on the view 7 showing the content called Sample Ok Cancel Parameters The Parameters object holds the dynamic parameters the user has entered e String get String name This is equivalent to using name in other parts of the dashboard Within scripts substitution will work but Parameters get name should be preferred because it is more efficient State The State object represents the dashboard as a whole It provides a set of useful services and acts as a container for the named states which link the contents and views that you define To access a particular state you need to append the name to the State object For exampl
23. able charts and options is described in the Elixir Report Designer manual Figure 2 6 Chart on Perspective Perspective View ela carat y FruitSales 325 300 275 225 200 175 4 2000 1999 1998 1997 Bar column area and pie charts have selectable regions corresponding to the chart shapes For example clicking on a bar will select all records that contributed to that bar You can create another view which uses this selection as a filter to control its display You can also attach actions so that clicking on a bar will show a new view or card which is mapped to the selection made This is an easy method of creating a drill down chart 14 Contents From Repertoire 7 3 onwards Pie Chart will be able to support mouse over and explode slices In order for the Pie Chart to display the containing values when the mouse rolls over the following scripts are required to be inserted under the Script tab of the Edit Content Wizard importClass Packages org jfree chart labels StandardPieToolTipGenerator plot setToolTipGenerator new StandardPieToolTipGenerator After the changes are being applied the value of the particular slice of the pie will display its value when the mouse rolls over as shown in Figure 2 7 Mouse Roll Over Pie Chart Figure 2 7 Mouse Roll Over Pie Chart FruitSales In Pie Chart Orange 323 50 In order to explod
24. able gees See Eesen exe BEE dE E SEA 23 Case Study 1 Filter Sort and Extract Data ooccooccoccnoconnconnccnnconnconnconoconaconaconccnnronoss 24 Case Study 2 Chart DrilldoWn SEENEN ENEE EEN REESEN ERREECHEN 27 Case Study 3 Explicit Dependencies 2 0 0 0 cece cece cece cece cece ceca cen eeneceeeeeeeeeeeeaees 28 Case Study 4 SWE Content c2ccsissnscsdses ENEE RENE SNE ERHALE 30 Case Study 5 SWE Charte NEEN EENS EES 31 Case Study 6 SWF Slider with Chat 32 3s VIEWS e ee tend ee Ee ster thee tale tet 34 ee te 34 Card EE 34 LAV OU E 34 Split EE 35 Content AE 35 O EE 35 Drag and DATO o AEA E E E ad oseoees eacteangesboysscassessagashoeeedds eeaeass 36 4A ACUSA ss 37 liese Te te 37 Content Events A Ee eR Hans bees eaten eee 37 Available ACtiOns ii ENEE EEN 38 Maximize Actions tee ra 38 Refresh Dt ess gea SAAR NEE EEN 38 SHOW ACHON EE 38 Show Card Acton is soos ees Ged ee BEEN EEN Paves Ee SNE ee 38 Reset Actos te 38 Render Report Action socia tras EAR satay sos REENEN EE 38 Generate Data ACI AA A A dE 38 Generate Excel C be Action mail ar Ae 39 Sept E 39 Triggering Actions from E Vents sisese 30s css carta SNE EEN EES EE sas Danae oh 39 Case Study 1 ADA on a e Nee edel ENEE EEN 39 Case Study 2 Render Report in Perspective ooocoooccocnncconocnnccnnccnnccnnccnnccnnconnconaconaconoss 41 lil Elixir Dashboard Designer User Manual SN 43 lr ee Te Te ie 43 Parameters EE 43 State E 43 Individ al Stat
25. ce is defined in the repository a schema is associated with it and is available to the content designer When the datasource is defined by a view there is no explicit schema available it depends on the content of the view which can itself be dynamic The solution is to allow view based datasources to explicitly load a schema When a datasource has been chosen for a content the subsequent page in the wizard will show the schema of that datasource if one is available If no schema is available the Load Schema button will be available to allow one to be explicitly loaded The data schema needs to be available in order to support options like filtering Each content that reads from a datasource is allowed to filter the records before rendering them The filtering options allow records to be selected based on criteria such as Equals Greater Than In Range In DataSet etc These are discussed in the Filter Processor description of the Elixir Data Designer manual Dynamic DataSources Dynamic datasources allow a content to read it s data from another view rather than from a fixed datasource This allows the user to select an item in one view and see related items appear automatically in another view A dynamic datasource is identified by a URL with the protocol view The next part of the URL is the name of the view For example view Top Left would use the data supplied by the view called Top Left Many views support selection and it is often use
26. cted This will mean that the SWF element will display according to the data selected from the table created using FruitSales ds After 5 clicks on Next user needs to enter the respective names for the columns Enter a parameter name for example columns for the Name field For Value enter the following Company Fruit Year 4 1997 1998 1999 2000 The above line will split the table into 6 different columns with names Company Fruit 1997 1998 1999 and 2000 Rows 1997 1998 1999 and 2000 are split into 4 columns with Year as the heading Click on Finish to complete the creation 30 Contents 7 To see the SWF element it has to be opened from Repertoire Server web interface When the Perspective is opened it will look like Figure 2 22 SWF Chart Figure 2 22 SWF Chart FruitSales Company Fruit 2000 1999 1998 1997 H A Apple 201 0 102 0 199 0 232 0 A Orange 323 0 32 0 55 0 23 0 A Strawberry 99 0 20 0 39 0 23 0 B Apple 201 0 102 0 199 0 232 0 B Orange 323 0 32 0 55 0 23 0 B Strawberry 99 0 20 0 39 0 70 0 B Berry 23 0 32 0 34 0 76 0 G Apple 120 0 232 0 232 0 322 0 Iz Table Year Company Fruit 1997 1998 1999 2000 B Orange 23 55 32 323 Case Study 5 SWF Chart A SWE Chart is very similar to the Chart used in Report Designer The only difference is only the appearance and the variety of chart types available l 2 10 In a newly created perspective
27. des where to read data from Therefore we explicitly added the dependency so that the element will be updated whenever there is a change in the other element It is useful only if the dependencies are hidden in scripts l First of all create a Tabular datasource named CompanyName with Company as Name String as Type Add 3 columns and name them A B and C respectively Click on Finish to complete the creation process Create a Grid element using CompanyName ds by dragging it into the perspective and select Add Grid After 4 clicks on Next button user will reach Choose grid display options page Select Company from the dropdown list Check on Single Select so that only one selection can be done at a time Click on Finish to complete the creation of the Grid element Then create a Chart element by dragging the same datasource into the perspective and place it below the Grid element This time select Add Chart Create a Column Chart using Company as the Key As for the Values add 2000 1999 1998 and 1997 In the Script tab enter the following script which will change the colour of the columns based on the respective selection 28 Contents importClass Packages com elixirtech chart2 custom CustomDrawingSupplier var paints null if cxt null var select cxt getPerspectiveState getStat CompanyName if select getSelectedValue A pelas wel 228 5270 4 09 245 121 1118
28. drag FruitSales ds into the blank space and select Add Table After clicking on Next once click on Finish Next drag FruitSales ds to the right of the Table and select Add SWF Chart In the View tab click on FruitSales then select the option Selected This will mean that the SWF Chart will display data according to the selected row On the next screen sorting can be done according to requirements This case study is to illustrate the creation of a simple SWF Chart so we will skip that After 3 clicks on the Next button choose a desired chart type We will use a Column Chart in this case study It can be seen that the variety of charts available is lesser compared to the usual chart variety This is because SWF Charts can only be applied to few particular types of charts On the next page of the wizard select Company under the Key tab In the Values tab check all the available checkboxes In the Group tab select On Value for the Group on drop down list and select Sum for the Operation drop down list Then click on Finish In order to see the SWF Chart it has to be opened from Repertoire Server web interface When the Perspective is opened it will look like Figure 2 23 SWF Chart SWF Chart itself will display data of a particular column on a mouse rollover 31 Contents Figure 2 23 SWF Chart FruitSales FruitSales1 Company Fruit 2000 1999 1998 1997 100
29. e if you have a view named MyCube you can access the state of that view like this 43 Script Reference State MyCube If your view name contains spaces then you need to use an alternate JavaScript syntax State My Cube to achieve the same effect We will start by reviewing the API of the State object itself Note that most of these services are available through the Action mechanism so you don t have to use scripts to perform these commands these services are only for situations where you want to chain a few actions together in a certain order or maybe add some additional scripted logic void excelCube String cubeName void generate String contentName String getCurrentCard String getParameterValue String name Perspective getPerspective IState getState String name void maximize String viewName void render String reportName void reset void restore void show String view String content void showCard String perspective String card Individual States Generate the presentation of a cube as an Excel spreadsheet The user will be prompted to enter a filename Generate the data shown by a particular content as a file The user will be prompted to enter a filename and output type eg XML CSV XLS etc Get the name of the current card Get the value associated with the parameter name or null if the parameter is not found Get the Perspective object which represents t
30. e a Standard Report Tabular Report Click Next For simplicity we will use all the fields in FruitSales ds To move the fields to the Report column all at one go you can click on the second button from the top Click on Finish to exit from the wizard On exiting of the wizard the report template would have been created To add this report template to the perspective go to the perspective and simply drag the file to the perspective In this case study we will add it to the right of FruitSales At the second page of the Edit Content wizard click on the empty field under Mapping then click on the button Inthe DataSet Chooser wizard click on the View tab Select FruitSales then Selected Exit the DataSet Chooser wizard by clicking on Ok Exit the Edit Content wizard by clicking on Finish To add an action to generate the report template go to the Perspective tab At the Action tab click on the Add icon and the Action Wizard will appear For the View and Content select Fruit Report For the Event select doubleClick For the Type select Render Report For the View select Fruit Report Exit the wizard by clicking on the Ok button With this the report template will display records selected from FruitSales Now try selecting some records from FruitSales The report template will show the selected records which is something like Figure 4 3 Sample Figure 4 3 Sample Perspective View lt Fru
31. e the slice of a Pie Chart when clicked as seen in Figure 2 8 Pie Chart Explode Slice enter a figure in Explode Percent in the Pie tab of the Edit Content Wizard This figure represents the degree of explosion of the slice meaning the space between the exploded slice and the pie chart 15 Contents Figure 2 8 Pie Chart Explode Slice FruitSales Available datasources All Selected Unselected only for bar column area and pie charts Cube Table A cube table reads data from a datasource and renders a two dimensional table showing the values derived from those records that form the intersection of the two dimensions There are two ways in which a cube table can be designed The Cube Table wizard provides a step by step dialog to guide the design process This is identical to the wizard used in Elixir Report Designer and is described in that manual The other approach is to create an empty cube table using the wizard just click Finish after choosing a datasource and designing the cube interactively This approach is usually preferred because each change to the cube is immediately reflected in the view Similar to a Cube element in report template and Cube processor Cube Table in a dashboard is able to Show Row Grand Totals Show Column Grand Totals Row Totals After Details and Column Totals After Details To change the settings of the Cube Tabale in a dashboard click on the arrowhead pointing downwards The respecti
32. ent to update dependent views this is handled internally select A select action occurs when a user changes the selection state of those contents that maintain a selection eg table It is not necessary to respond to this event to update dependent views eg those that depend on view XXX selected this is handled internally Available Actions When an event is received it can trigger zero or more actions The available actions are Maximize Action The maximize action controls the maximized state of a named view There are three types of action possible Maximize Restore and Toggle Note that it is possible to maximize a view from a different card and it will show over the current card until it is restored or toggled off The current card will not be affected by the action Refresh Action The refresh action forces a named view to render it s content The refresh action is usually handled internally for dependent views but may be useful if the data is changed from outside Perspective for example through JavaScript or because of a timed change Show Action The show action replaces the current content of a named view with a different content Show Card Action The show card action shows a named card in place of the current one Reset Action The Reset action reverts the dashboard back to the default contents and initial selections This action is particularly useful for web based dashboards where the server session remembers t
33. es al a ida 44 AEK oana r pee Mande N A a pia debed wan deek Geeade ecu ad otal vee awa ERY 47 List of Figures 1 1 A Sample Dashboard ge EENS ER poe it E A podia 1 T2 Cards Views and Contents ices ee ed os Ga red A ak Sst hes 2 1 3 The Dashboard Toolbar ez es cesgseesccesss voce vsssedes oss sess sds eestend seve EPAPER susvees seen senvese 2 L Dashboard Dimension ii ide 3 1 5 Table on Perspective statistic le reacia js 4 1 6 Placement of Intended Content 5 1 7 Chart and Table op Perspective iiis soriire ssvedssshscesaegsseneesdsavecends shecss chveeseegssesteadeens 6 1 8 Grid Chart and Table on Perspective 2 0 0 0 ccs ecece cece nce ece ence neeeeeeeeeeeeeeseaecea seen teas eeaes 7 1 9 Completed Perspective misne niaaa pt webateh ee ANE E siete ese 8 21 View UR Zeg ee EE E ees ahaha 9 2 2 Dynamic DataSource ocio sirena isc rss princi EE ENEE seer see in creada 10 2 3 Datasource Parameters sisis iyo s iese oe EEEE ES EEEE EE ESK EE E TESE 11 24 The W3C CSS Box Modelen EEEeh o a E E nated a EE 13 2 5 Initial Selection Dialog cissie r S EE E E N e E EE 13 2 6 Chart A r erreser s Ere i oee ETOT aS Eese ENNEN a 14 2 7 Mouse Roll Over Pie Chart irecte eiyan neie tec Ee E EESE ENE SEES 15 2 82 Pie Chart Explode SliCS usina ERR dE EE aa 16 2 9 Cube Table on Perspective oveni ose eec ees ese ENEE EES ENEE EEN EE e 17 2 10 e 18 2 11 Add Content Wizard imita da S EEES 19 2 12 Grid on Perspective EE 20 2 13
34. ful to show information related to the selected records of another view This can be accomplished by adding the suffix selected onto the URL Similarly unselected will use those records that are not selected Taking the previous example the URL view Top Left selected would get the selected data records only from the Top Left view Figure 2 1 View URL Steeg Contents The tool will manage the connection between views so that any view that depends on another is automatically updated when the dependent view changes There is usually no need to define explicit actions to enable this behaviour If you use scripts to extend the dependency mechanism for example changing the dependency dynamically then you can explicitly define the dependency on the last page of the content wizard It is important to note that datasources can only be read from views not from contents This is because each content may be filtered and selected differently within different views at the same time The benefit of selecting through views is that the same view may show different contents at different times and the dynamic data connection is still maintained For each kind of content described below there is an indication of Available datasources that indicates what options each supports Support for All means the view name can be used to get the entire datasource of the view Support for Selected means the view name followed by selected can be
35. he current state throughout the user session Add a button image with a Reset action to your dashboard so that the user can easily reset the dashboard to its original state without having to logoff and logon again Render Report Action The Render Report action will render the selected report in the perspective with the renderer selected by the user The output is identical to the rendering in the Report Designer Often dashboards will be created so that the user can dynamically construct the report contents by navigating through the data views You can then provide a button image so that the final report can be preserved Generate Data Action The Generate Data action can generate data in the selected element to 4 different formats They are XML Excel Comma Separated Data CSV and Datasource This action outputs the data as records so any formatting of the display is not preserved If you need to preserve the format of a dashboard cube then use the Generate Excel Cube Action below 38 Actions Generate Excel Cube Action The Generate Excel Cube action can generate data in the selected cube as an Excel spreadsheet Unlike the Generate Data Action this action preserves the cube structure and cell rendering that you see on the dashboard Script Action The Script action is the most powerful because it can interact with the Perspective views contents and even actions directly This action is intended for power users and developers
36. he whole dashboard See the PML Object Model documentation for full details on the dashboard object model This provides another mechanism for getting the individual state objects it is synonymous with State name as described above Maximize the named view which need not be on the current card The current card does not change on restore the original card will show again Render the named report The user will be prompted to enter the render type and destination Reset the current dashboard state back to the initial default view states and selections Restore any maximized view back to the normal position Show the named content in the named view Replaces the current card with a new one which could come from the same dashboard file or jump to another dashboard The perspective parameter should contain the full URL of a pml file eg repository User jane mydash pm1 or null if the card 1s located in the current dashboard All state objects support the refresh service to force a refresh of the view In most cases this is handled automatically by the dashboard when it detects that the display needs to be updated All state objects also provide a getName service which will return the name of the state Further to this states which support selection allow scripted access to the selection values as described below 44 Script Reference CubeS tate e DataTable getDataSource e List lt DataRecord gt getSelectedRec
37. ich will fill the whole background of the dashboard Individual contents can set their own background colours which only affects their individual view rectangles The default background colour is white Layout When the Card is selected the layout of the views will be displayed accordingly in the Card panel Also right clicking on the Card then Default Layout shows options available for setting the layout of the Card as shown in Figure 3 1 Layout The name background colour and direction of the Card can be changed from here Figure 3 1 Layout Card Name Card1 Background Direction 8 Horizontal Vertical Ri Add split Horizontal Split Add view Vertical Split Delete Quartered View Single View A Single View as seen from the name will only 1 view can be seen Horizontal Split A Horizontal Split will split the dashboard into 2 halves and each view placed beside each other Only 2 views can be seen in the dashboard 34 Views Vertical Split A Vertical Split will split the dashboard into half and 1 view will be on top of the other Like the Horizontal Split only 2 views can be seen in the dashboard Quartered View A Quartered View will split the dashboard into 4 equal squares After setting the Default Layout a user can still add view s to the dashboard manually Split View A split view will present it s child views which may be content views o
38. iew of the content The dialog is shown in Figure 2 5 Initial Selection Dialog Figure 2 5 Initial Selection Dialog Initial Selection Initial Selection Choose initial selection options None CAM First Last Values Field customer _id Finish Cancel 13 Contents The choices for initial selection are None The default no items are initially selected All All items are initially selected First The first item is selected depending on sort order if any Last The last item is selected depending on sort order if any Values This option requires a field name and one or more values to compare against the records All records that contain values of the chosen field that match the value strings will be selected Note that values are strings so any other data types will be formatted into strings if necessary for comparison purposes Chart A chart reads data from a datasource and renders it as a graphical display which sizes to fill the view it is placed in The datasource chosen may be identified by a repository URL in which case the content is fixed or the datasource may be reading from another view in which case the chart will be updated automatically each time the other view is modified There are many parameters that can be used to configure the presentation of the chart most importantly what type of chart is required The chart wizard and range of avail
39. itSales Fruitsales_Report Company Fruit 2000 1999 1998 1997 pple 201 0 102 0 199 0 232 0 Orange 323 0 32 0 55 0 23 0 Strawberry 99 0 20 0 39 0 23 0 201 0 102 0 199 0 232 0 323 0 32 0 65 0 23 0 99 0 20 0 39 0 FruitS ales 23 0 32 0 34 0 120 0 232 0 232 0 323 0 32 0 43 0 Strawberry 122 0 2 0 2 0 Berry 343 0 232 0 23 0 o010 0 0 0 0 0 0 gt 2 2 41 Actions 6 To render the report double click within the area of the report template as configured in the Action wizard The Render Wizard which is similar to the one in Report Designer will appear as shown in Figure 4 4 Render Wizard Select the format you wish to render the report to and run through the wizard if you need to do any extra configurations Figure 4 4 Render Wizard Render Wizard Choose A Renderer Print launch a viewer or save to disk Standard Web Others Je csv Ze Image A PS fe XLS CSV IMG F ee fr PDF A Print GLINT PDF E m Jo ppt pa RTF IML PPT Launch viewer Page range All Pages C Save to disk la Previous Finish Cancel 7 The report will be generated to your desired format after clicking on Finish 42 Chapter 5 Script Reference Introduction Dashboards are scriptable using JavaScript Script Actions This chapter will introduce the essential A
40. lect Fruit For Value tab select 2000 Exit the wizard by clicking on Finish Next drag FruitSales ds again into the Perspective and place it on the right This time select Add Table On the first page of Add Content Wizard click on the View tab and select FruitSales then Selected Exit the wizard by clicking on Finish On the Perspective workspace try clicking on the different slices on the Pie Chart Since the Key of the Pie Chart is Fruit when the user clicks on the different slice the Table element will display the records with the selected Fruit which is similar to Figure 2 20 Results of Case Study 2 27 Contents Figure 2 20 Results of Case Study 2 Perspective View A lt Card v FruitSales FruitSales_Table Company Fruit 2000 1999 1998 1997 A Orange 323 0 32 0 55 0 23 0 B Orange 323 0 32 0 55 0 23 0 Orange 323 0 32 0 43 0 787 0 Case Study 3 Explicit Dependencies The use of Explicit Dependencies will be demostrated in this case study For example there is a Table element and a Chart element that has its column colour changed based on the selection in the Table element This will require some scripting in the Chart element In this case using view selected will not work as the perspective will not know of the dependency by the parsing of scripts In some other cases the scripts might be calling some other codes which deci
41. mpany Fruit 2000 1999 1998 1997 Apple 201 0 102 0 199 0 232 0 Orange 323 0 32 0 55 0 23 0 Strawberry 99 0 20 0 39 0 23 0 201 0 102 0 199 0 232 0 Lf 325 300 4 275 ange 3230320 55 0 23 0 Strawberry 99 0 20 0 39 0 70 0 Berry 23 0 32 0 34 0 76 0 ple 120 0 232 0 232 0 322 0 range 3230 32 0 43 0 787 0 Strawberry 1220 20 2 0 70 0 Berry 343 0 232 0 23 0 332 0 250 225 7 200 7 175 4 A A A B B B B C C C C 150 125 2000 1999 1998 1997 Now we will try creating a Grid element in the Perspective Repeat step 1 to 3 but place the element on top of FruitSales_Chart select Add Grid and change the name to FruitSales_Grid At the next page of the wizard select a field for the Grid element to display Select Company then click on Finish Repeat step 9 and 10 place the element above FruitSales and change the name to Fruit Sales_DropDown In the Add Content Wizard select Fruit as the field and check the checkbox that says Show as Drop Down List In the Label field enter Fruit 12 13 14 15 About Elixir Dashboard Designer Figure 1 8 Grid Chart and Table on Perspective FruitSales_Grid FruitSales_DropDown FruitSales_Chart FruitSales Company Fruit 2000 1999 1998 19 pple range 300 1 250 200 5 150 4 100 4 50 5
42. o do some filtering of data Under When of promotion_id select Not Equals As for the Condition enter the value 0 This will filter away all the records where the promotion_id is zero Finally click on Finish to exit from the wizard When an error appears saying that there is an error building the datasource table for repository caused by a syntax error in the query expression this is the correct behavior This is because when the perspective tries to load the data in all the elements the Table element doesn t have any data to load There is no value being passed to the parameter therefore causing the error To solve this problem you can add Initial Selection to the Grid element With Initial Selection the Table element will have a value to pass to the datasource when it loads To add Initial Selection right click on the Grid element and select Initial Selection You will then see the Initial Selection Wizard like Figure 2 18 Initial Selection Wizard Select First For the Field select customer_id Click on Finish With this setting the first record of the Sales element will be selected based on customer_id when the dashboard first loads 25 Contents Figure 2 18 Initial Selection Wizard Initial Selection Initial Selection Choose initial selection options None OAI First Last Values Field customer_id D Previous Next Finish Cancel 11 In
43. ords e BitSet getSelection e boolean hasSelection e void setSelection BitSet sel GridState e boolean allSelected e DataTable getDataSource e List lt DataRecord gt getSelectedRecords e String getSelected Value e BitSet getSelection e String getValues e boolean hasSelection e void setSelection BitSet sel TableState e DataTable getDataSource e List lt DataRecord gt getSelectedRecords e BitSet getSelection e boolean hasSelection e void setSelection BitSet sel The infrastructure objects exposed by these APIs are DataTable and DataRecord DataSchema and DataType These are all in the com elixirtech data2 package The useful services of these classes include DataTable e int getRecordCount e DataRecord getRecord int idx e DataRecord getRecords e DataSchema getSchema DataRecord e Object getData int idx e Object getData e DataSchema getSchema DataSchema e int getColumnIndex String columnName e String getColumnName int idx e DataType getColumnType int idx The following DataType constants are defined e BLOB 45 Script Reference BOOLEAN BYTE BYTE_ARRAY CHAR CLOB DATE DOUBLE FLOAT INTEGER LONG OBJECT SHORT STRING TIME TIMESTAMP UNKNOWN XML 46 toolbar 2 Index V A view 2 X C xml 16 23 card 34 chart 14 content 2 9 35 csv 16 23 cube table 16 D datasource 9 16 23 drag and drop 36 E events 2 excel 16
44. r a name and an HTML URL HimlContent Embed HTML in Page Display content from URL e Display content from HTML Text lt html gt lt head gt lt head gt lt body gt lt p style margin top 0 gt This is a sample of a lt font color ff0000 gt HTML lt font gt content lt p gt lt p style margin top 0 gt lt p gt lt body gt lt html gt Edit HTML Previous Available datasources None Image An Image element is a rectangular region which picture files can be loaded into Elixir Dashboard Designer supports image formats such as jpg png and gif As jpg and png file formats are supported across all implementations they will be a best choice The Image element together with any drawings on it can be copied to user s desired application This is similar to Chart and Map Bmp and tiff image formats are not supported for Elixir Dashboard Designer Similar to glint files image files can also be opened in the Perspective tab following the same steps Right click on the image file and select the correct option 21 Contents Available datasources None Figure 2 15 Image on Perspective Perspective View a lt Card1 DH LogoElixir A Map element is a graphical framework that adds a new dimension to data visualisation which is usually used to represent geographic areas User can copy
45. r more splits in a sequence either left to right horizontal mode or top to bottom vertical mode The amount of space given to each child depends on the weight attribute of the child Each child is given a space proportional to it s weight divided by the sum of all child weights The default weight is 100 and unless changed will give equal spacing to each child Weights are used rather than explicit sizes in pixels or inches etc so that the Perspective output can scale properly to be shown on different size devices Editing can be done in the screen as shown below Figure 3 2 Split View Views E Perspective Split E Cardt Name Split Left i f gt EIS Weight 100 E Right Direction Horizontal 8 Vertical Splits can also be resized manually by dragging the gap between views Resizing varies the weights of the cells on either side of the gap being dragged This is a useful option for direct manipulation of the views themselves in conjunction with drag and drop described in the section called Drag and Drop Content View Each content view identifies a content by name to be shown within it The content can be changed dynamically by the user explicitly choosing a new content or through an action which can trigger the content change Each content view should have a unique name so that it can be referenced as part of aview URL to link records to other contents If the content is dependent on a datasou
46. rce instead of another content right clicking on that particular content will allow the user to open the datasource as one of the options Maximize A single content view can be maximized to fill the entire Perspective The view can be maximized by choosing the Maximize option from the titlebar or by double clicking on the titlebar Similarly the view can be restored to it s original size by choosing the Restore option from the titlebar or by double clicking again on the titlebar It is also possible to maximize and restore a view with a user action such as double clicking In this case the view to be maximized might not even be on the current card In this situation the chosen view will be maximized as expected and on restoration the original card will remain visible This 35 Views approach means it is easy to use other cards to hold a number of popup views and maximize them based on different user actions Actions can also be used to restore views to their normal size which has the effect of returning to the original card Drag and Drop As well as populating cards using the wizard it is possible to create views dynamically Dragging and dropping glint files report templates and datasources from the repository onto a card enables interactive positioning With this approach the tool will automatically insert the split views necessary to support the content views that are dropped When dragging over a view a blue box i
47. resumably the order is significant probably because they have just been sorted You can choose to retain either a fixed number or a percentage of all the records If a percent value is chosen then the value will be rounded up to include partial records For example if you choose 1 you will still get one record even if there are only twenty records in the set 11 Contents Presentation Each kind of content has some common presentation characteristics along with some content specific ones These are all editable from the Presentation Wizard accessible from the Presentation popup menu item The common characteristics are Padding Margins Background Title Bar Tip Border Name Border Title Padding is the area inside the border which provides insets for the content area The background of the padding is set according to the background colour of the content See Figure 2 4 The W3C CSS Box Model Margins is the area outside the border which provides insets for the border rectangle The background of the margins is set according to the background colour of the card that the content is shown on See Figure 2 4 The W3C CSS Box Model The background colour is used to fill the background of the border and padding rectangles along with the content area If no background is specified then usually the card background will show though this depends on the content type and other content specific backgrounds
48. s shown to indicate the current drop region When near to the edge of a view any drop will create a new content view on that side introducing a split view if necessary When dropping directly over a view the old view will be replaced by a new one showing the new content Note that when creating views this way the content and view names are initialized automatically by the tool to ensure they are unique It is possible to adjust the names later if desired 36 Chapter 4 Actions Introduction Many kinds of content can fire events when the user interacts with them These events may in turn trigger actions that manipulate or update the views being shown This chapter describes the events that each kind of content can generate what kinds of actions can be performed and then explores how to handle those events in order to trigger actions Content Events Users interacting with content generate events that consist of three pieces of information lt content view event gt The content attribute is the name of the content that the event occurred on The view attribute is the name of the view the event occurred on The event attribute is the name of the event An example event might be lt Employees LeftTable doubleClick gt In this section we will describe the events that each kind of content can generate Chart click key value doubleClick key value refresh select Cube Table click doubleClick refresh select Glint
49. select doubleClick For Type select Generate Data For View select FruitSales Exit the wizard by clicking on the Ok button Go to the View tab Try selecting a few records in FruitSales while holding on the Ctrl key After selecting double click within the Table element and Generate Data Wizard will appear as shown in Figure 4 2 Generate Data Wizard Al 1 will mean saving all the data in the Table element Selected will mean saving only the selected records in the Table element Unselected will mean saving all the records other than the selected ones Figure 4 2 Generate Data Wizard Generate Data 2 Choose which records from FruitSales to generate All Clicking on the OK button will lead you to the page for selecting the format you wish to save to designate the location for saving and the name of the file Clicking on Save will generate the file 40 Actions Case Study 2 Render Report in Perspective In this case study we will demostrate how to render a report in a Perspective which is similar to the Report Designer using Action We can continue using the Perspective created in Case Study 1 1 Since we are rendering a report we will need a report template Create a new report template and give it a unique name In this case study we name it Fruit Report Click Next For the datasource we will use FruitSales ds available in ElixirSamples DataSource Click Next As for the report type we will us
50. t after an equals will be evaluated at runtime and the result substituted view ViewName Selection Field The field name of the selected unselected record in a particular view However the element must be refreshed before being able to show the updated border title An ideal way of utilising this feature will be using on an element that displays data based on the selected unselected of a Contents view This will be discussed later in the case study You can mix these for example ContentName ShortDate will show both the content name and short date in the title For other titles you can use script substitutions like this java lang System getProperty java version Any JavaScript syntax which can call Java as shown inside a JavaScript substitution will be evaluated when the title is shown Figure 2 4 The W3C CSS Box Model Initial S When m m D E D d D d D kd Top TM Margin Transparent BM oe oe ee ee wm wm wm mmm mmm mm wm mmm mmm mmm mm mmm mmm wm e mmm mmm Bottom mm mmm wm Magn edge mmm Border edge Padding edge Content edge election the dashboard is first loaded it is often useful for contents to be given initial selections so that the user isn t presented with a blank page No initial selection is provided by default but you can use the Ini tial Selection dialog available on the popup menu of each content or if you prefer each v
51. tab by right clicking on the glint file and select Open Glint 17 Contents Figure 2 10 Glint on Perspective Perspective View fa lt FruitSales FruitS ales Strawberry Strawberry BJOmee 330 a ER DR ERREECHEN DR 30 al 40 160 The grid content type is a special kind of table The grid renders one field from each record and allows for a more compact representation where the fields may be displayed in a grid layout Before rendering any duplicate fields are removed and the values can optionally be sorted When you select a field in the grid you are actually selecting all records in the datasource that have that selected value For example with a grid showing the Field Month selecting April will select all records where Month April When designing a grid you can choose a direction Across then Down or Down then Across and either length in that direction For example a 4 Across then Down grid will place the cells like this There will be four cells in each horizontal row and the fields will be added across then down Altern atively a 3 Down then Across grid would look like this L y E 3 In this case there are four cells vertically and the fields are added down then across 18 Contents A grid can also be displayed as a Drop Down list This can be done on the second page of the Add Content wizard The second page of Add Content wizard is shown in Figure 2
52. ted for the id enter and exit from the wizard by clicking on the Finish button 24 Contents 10 Create a new Perspective and give it a unique name Drag Sales ds to the perspective Select Add Grid When the wizard appears click on the Next button twice Inthe Expression Builder enter 100 in the Amount field Then click on the Set Value button This will extract the top 100 data from the datasource Click on Next twice At this screen of the wizard the user will need to select the field for the Grid element to display In the drop down list select product _id Finally exit from the wizard by clicking on the Finish button The Grid element will be displayed on the perspective with Sales as the border title Drag Sales_Param ds into the perspective Place it on the right of the Grid element On release of the mouse click select Add Table At the second page of the wizard you will see the parameter defined in the datasource Under Value change fid to view Sales selected product_id This will pass in the value selected by the user from the Grid element to Sales_param ds as a parameter The Table element will display the respective results At the next page of the wizard add a Sort by clicking on the Add icon Select product_id and Ascending for the Name and Sort Order respectively This will sort the data according to the product_id in ascending order Click on the Next button twice Over here you will be able t
53. the Map element as an image and paste it in desired application by right clicking on the Map element and select Copy Available datasources All Selected Unselected Report Report templates created by Elixir Report Designer can be shown within a view By default the templates will be rendered with their original datasources as if rendered within Elixir Report Designer itself However you can also substitute new datasources derived from dynamic views in the Perspective This allows interactive selection and filtering of data values for reporting The report can be saved into any Elixir Report Designer output format including Glint PDF and HTML Note that within a Perspective a report is always shown in Streamed mode no page breaks page headers or footers When the report is saved it is possible to choose either Streamed and Paged versions if the output format supports it Available datasources None 22 Contents Figure 2 16 Report on Perspective Perspective View al lt carat v FruitSales FruitS ales DR MANE IAE ANNE MANEL DREES EECH B__Jomer 3330 0 so 230 c a a ARNM IRMA eoo pa y ANNIE INM SWF SWF element uses swf files which cannot be created using Repertoire but is required for creating a SWF element User will need to create their own swf file In the section called Case Study 4 SWF Content it demostrates the use of SWF element in a simplified way
54. tions and events to be tested and verified without side effects from others Multiple actions can be triggered by a single event if they all match the event attributes The order of invocation is based on the order of actions in the Actions table Actions can be raised or lowered in the action list to control the order of execution Case Study 1 Generate Data This case study will do a simple illustration on how to use the Generate Data action 1 Create a Perspective and give it a unique name 39 Actions 6 Drag FruitSales ds available in ElixirSamples DataSource into the perspective and select Add Table Click through the wizard and click on Finish to exit from the wizard The Table element will be created on the perspective To add an action to generate data go to the Perspective tab At the bottom of the screen click on the Act ion tab then click on the Add icon and the Action Wizard will appear as shown in Figure 4 1 Default screen of Action Wizard With this action on double clicking on FruitSales the Table element you will be able to generate the data in FruitSales Figure 4 1 Default screen of Action Wizard Action FruitSales FruitSales Event click Type Refresh Target FruitSales Cancel In the Action Wizard you can customize the actions you want In this case study for View select FruitSales For Content select FruitSales For Event
55. ve settings can be found in Row Options and Column Options More information about Cube can be found in Elixir Data Designer pdf Chapter 4 Composite Datasource the section on Cube Processor If the cube data is required for subsequent processing it is possible to save the cube table contents into a CSV DataSource Excel or XML file Available datasources All Selected Unselected Glint Contents Figure 2 9 Cube Table on Perspective Perspective View CAE FruitSales gt y ai Count F ruit 9 All 11 9A Apple Berry Orange ___ Strawberry 98B Apple Berry Orange Strawberry de Apple Berry Orange Strawberry w b ab ab ad D d eh eh eeh ra web The glint content type renders a glint file to produce a graphical view Glint is Elixir s native vector graphics format It is designed to be extremely compact to minimize network traffic and reduce memory requirements on low end machines Instructions on generating a glint file can be found in the Report Designer documentation This is useful for displaying fixed content and pre rendered output For example a view could be based on a FileSystem DataSource to show a list of glint files Selecting a file would load it and display it in another view allowing quick creation of a customized interface to access pre rendered reports Available datasources None A glint file can be opened from the Perspective
56. visualization of data and OLAP cube e User definable linking and filtering of data from disparate data sources Dynamic report generation from view selections A Perspective is the set of views contents and actions that together form a dashboard Dashboards are stored in files with the extension pm1 which stands for Perspective Markup Language Figure 1 1 A Sample Dashboard Elixir Repertoire 7 0 0 Xx gt HIN e e 7 D C Elb rSamplesDashboard Corporate Performance Management Performance Management Dashboard pmi D m Perspective View lt Overall Trends and KPI ZA Elixi Elixir Technology DES Jl Severity Level Click to Drill Down For Year 2002 2003 2004 Maintenance Job Types Corrective Enhancement O Planned O Predictive O Preventive Maintenance Job Status Critical Major Minor To achieve this powerful and flexible solution Elixir Dashboard Designer defines Content Views and Actions About Elixir Dashboard Designer Contents The content is the underlying data and presentation This could be a report or cube backed by a data source or a chart showing data derived from other Contents Each content added to a Perspective has a unique name allowing it to be referenced by views The different kinds of content supported by in a dashboard are described in Chapter 2 Contents Views A view acts as a frame for content Content may appear in different views
Download Pdf Manuals
Related Search