![]() ![]() In addition, there are two methods used on a managed bean – one to answer the question whether or not a delta-value (an instance of ) is above zero and one to calculate the width of the bar – given the delta value, the maximum width and the maximum delta value. The Delta Graph display relies on a combination of ADF Faces components and their CSS properties. ![]() Press OK to complete the wizard and create the data bound table in the page.Īt this point, you can run the page and you will see the data from the placeholder data control presented in the web page in a rich ADF Faces table. Now, drag and drop the NewsPaperCirculation collection from the Placeholder Data Control to the page – drop it as an ADF Read Only Table:Ĭonfigure the table in a straightforward way – enabling sorting of the records in the table: The Data Control is now available in the Data Control Palette:Ĭreate the Web Page with Data Bound tableĬreate a new JSF Web Page in the normal way, from the New Gallery: This data can be typed in or read from a source file. Switch to the Sample Data tab to register the data that this ‘dummy’ data control will feed into the ADF Binding framework. For each attribute, UI properties such as Label and Format can be specified. Provide the name of the Data Type and the names and types of the attributes. The next step is the definition of the Placeholder Data Type(s). The configuration wizard appears, asking for a name for the Data Control. Creating the NewsPaperCirculation Placeholder Data ControlĬreating a Placeholder Data Control is done from the New Gallery. Then, the essential step, I manipulated CSS properties until I achieved the desired effect. Next I created the web page with data bound table – based on the circulation records from the placeholder data control. ![]() The easiest way of doing this was through the use of a Placeholder Data Control – that allows we to work with data that to the application appear like data from an enterprise resource such as a web service or a database but that in fact is typed in or read from a CSV file. In addition to the initial presentation, this ADF based version of the Delta Graph allows manipulation of the view, for example sorting the records by change or by current circulation:īefore creating the – data bound – Delta Graph display, I needed to create a data set that I could work with and bind the table to. So I started playing with ‘ordinary’ ADF Faces and – using some CSS definitions – I came up with the following ADF Faces rendition of the Delta Graph: And the inline-display inside table rows is related to spark charts, but again, it is not quite the same. Gauges appeared to come closest, but not quite there. However, it did not seem to offer a graph type that is very close to this presentation. ![]() My first port of call obviously was the ADF DVT (Data Visualization Tags) library. I started wondering it this way of presenting changes would be easy to implement in ADF Faces applications. It reveals a lot of information in an appealing way. The other day, my newspaper printed the next figure that illustrates the changes in circulation for all Dutch newspapers – comparing the 1st quarter of 2011 with one year ago. It inspires me to mimic in my own toolset: ADF. My morning paper has a broad palette of ways to represent numbers, trends, aggregates and incidents. Newspapers frequently use graphics to illustrate the news reported in their articles. Proper visualization provides quicker insight and reveals the true meaning of the numbers in an instant. And visualization of data can help to increase the value of the data tremendously. I may have bored you before with stories about Data Visualization. ![]()
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |