EJS Charts parameters

EJS Chart may be a solution, if you need a JavaScript charting to put it on your web application. It means that you don't need to install any plugin, like Adobe Flash Player; you just need to enable the JS scripts for your browser.
This particular library is a little obsolete, it seems that the last touch was in 2009 -- so I wouldn't recommend it, if you start a brand new application. But for the older ones, which are already using it, I have some tips:
Configuration of the chart (create, choose settings, formatters etc) is done strictly in JavaScript. So if you use the GWT, you need to write your JSI native wrappers, like I did :)
Data  can be passed to the chart in 3 formats:
  • JSON objects
  • XML format
  • CSV format
JSON and XML are pretty simple and easy to understand, but the CSV documentation is poor. So, if you need for example to format your balloon tips (tooltip) you have access to some variables, which are defined in the data structure, like it's shown below.
CSV formats are the following (where the separators are | and , with these meaning: | for the separating the attributes for one point, and comma for separating the points):
  • Pie:                      x | label
Example: 12|point 1|,13|point2 will define the slices (12, point 1) and (13, point 2).
  • Bar vertical:       x | y | label
Example: point 1|12|label1,point2|13|label2 will define the bars (12, point 1, label 1) and (13, point 2, label 2).
  • Bar horizontal:       x | y | label    
Example: 12|point 1|label1,13|point2|label2  will define the bars (12, point 1, label 1) and (13, point 2, label 2).
  • Line:                     x | y | label
Example: x_val1|y_val1|label1,x_val2|y_val2|label2 will define the points (x1, y1, label1) and (x2, y2, label2).

Note that the string values which are components of the CSV data must be sure that are escaped, in order to don't break the parsing of it.  Also, there is something called "userdata", if you need to configure some URL links, to follow when you click on a slice, bar or line point. I haven't use it, so I'm not talking about it.
Escaping the separator characters is done like this:
,  =  & # 44 ;
| =  & # 124 ;

Also the labels support simple HTML tags, like <label>, <br/>, <b>, <u>, <i>.
So, if you need custom tooltips, then use the "label" variable, which can be passed through attribute hint_string for the bar and line, but not for the pie (perhaps because of some bug, whatever you put here it's ignored).

Anyways, In pie case there is a workaround, you have to define the function onShowHint(), like this:

var chart = new EJSC.Chart (...);
...
chart.onShowHint = function() {
    return '<label>[parent_title]</label><br/>[series_title]: [x]<br/>[label] ([percent]%) ';
};

For the other chart types (bar and line) you can do it like below, set the hint_string in the definition of the series:

    hint_string='[label] ([percent]%)'
The known variables are, which can be used in formatting the tooltips:
  • pie: [x], [label], [percent], [total], [series_title], [parent_title], [min], [max]
  • bar: [x], [y], [label], [percent], [total], [series_title], [parent_title], [min], [max], [xaxis], [yaxis]
  • line: [x], [y], [label], [percent], [total], [series_title], [parent_title], [min], [max], [xaxis], [yaxis]

So, having said these, I hope you are better informed about EJS Charts!
Happy charting!


How to Use GWT for Large Scale Applications

<><>News
How to Use GWT for Large Scale Applications Cameron McKenzie Google Web Toolkit is great for creating Ajax enabled content spots on your web pages. But what about creating large web applications with GWT? The DayZipping tech blog asserts that there are benefits to be had from using GWT, including a reduced server load, social integration and some SEO help through the history manager.
Site Highlights
Snapshots in the cloud: The Developer's friend What's the best tasting part of the cloud, especially if you're working on a Java development team? Cheap storage space and snapshots that cost very little to administer or produces make life much easier for the enterprise developer.
Optimizing your mobile website for all devices Should UI testing be automated or exploratory? Learn when each type of testing is appropriate and how, when used together, they can provide the most comprehensive UI test coverage.
REST: Preferred architecture and infrastructure for Web applications Explore REST as a primary design pattern for cloud computing architecture in this new tip with insight from Gartner analyst Anne Thomas Manes.
TSSJS Spotlight
Session Spotlight: Do You Really Get Class Loaders? Class loaders are at the core of the Java language. Java EE containers, OSGi, NetBeans modules, Tapestry 5, Grails and many others use class loaders heavily. Yet when something goes wrong, would you know how to solve it? Jevgeni's session explores the Java class loading mechanism, both from JVM and developer point of view covering: • How different delegation systems are built • How synchronization works • The difference between finding classes and resources • Which incorrect assumptions have been made and are now supported Find out more about Do You Really Get Class Loaders? at TheServerSide Java Symposium 2011.




Key Headlines


Bean Definitions for Spring Framework Spring framework's core features are around dependency injection and beans lifecycle management. What this means is that programmers don't write code to inject bean definitions. Instead, Spring framework injects the dependency to beans.
Get started with JDK 7 and Netbeans 7.0 Beta 2 In order help early adopters explore Java 7 we've put up a series of blog posts starting with installing the latest JDK 7 binary build, followed by installing NetBeans 7.0 (Beta 2). Regular blog posts featuring code samples and the weekly state of Java 7 progress will commence starting from this week.
Chronon "time travel debugger" now in open beta and available for download Chronon is a new technology that consists of a a??flight data recordera?? for Java programs which can record every line of code executed inside a program and save it to a file on the disk. The file can be shared among developers and played back in a special time traveling debugger (which is a plugin To Eclipse) to instantly find the root cause of an issue.
ZK 5.0.6 Released - a new SEO content generator among other features This latest ZK release introduces a new custom SEO content generator, a more intelligent mechanism that fits layout to content, a new interactive tree model, additional built in jQuery effects and others.
About this Newsletter

TechTargetThis e-newsletter is published by TheServerSide.com, part of the TechTarget network. TechTarget provides IT professionals with the resources they need to perform their jobs: Web sites, newsletters, forums, blogs, white papers, webcasts, events and more.

Copyright 2011 TechTarget. All rights reserved. Designated trademarks and brands are the property of their respective owners.

Contact Us: TechTarget, Member Services, 275 Grove Street, Newton, MA 02466, Contact: Webmaster@techtarget.com

GWT-Ext: How to show tooltips for the ColumnTree (tree-grid, tree-column) widget

One day, a friend of ours has asked this:

"Hi, how to set the tooltip on the columns of a ColumnTree ? The structure is as follows:
ColumnTree.Column cols[] = new ColumnTree.Column[9]; 
cols[0] = columnTree.new Column("header", 290, "dataIndex");
cols[1] = columnTree.new Column("",50,"dataIndex");
cols[2] = columnTree.new Column("",100,"dataIndex");
cols[3] = columnTree.new Column("",170 , "dataIndex");
cols[4] = columnTree.new Column("",170,"dataIndex");
cols[5] = columnTree.new Column("", 70, "dataIndex"); 
cols[6] = columnTree.new Column("", 120, "dataIndex"); 
cols[7] = columnTree.new Column("", 70, "dataIndex"); 
cols[8] = columnTree.new Column("", 70, "dataIndex"); 
Columns are valued with the TreeLoader ."

The answer cannot be that simple, due to the defunct library GWT-Ext, which isn't under dev for long time. Anyhow, because I used this library first time, and I really like it, I found a way to solve this problem.

The column tree is the implementation of the very known tree-column, or tree-grid widget. This can be editable as well.

So the solution contains 2 files:
- 1. an updated ColumnNodeUI.js that sets the title DOM attribute for each cell with the value of the cell.
- 2. a Java class, called SccColumnTreeEditor.java that updates the title attribute of the cell element, after the completion of the edit action.



 You can download these files from here:
- ColumnNodeUI.js
- SccColumnTreeEditor.java
- GWTExt_TreeColumn.java -- a test class, where you can see how everything is used.


Cheers!


Here's the solution found by our friend Faber:

Hi SCC, I wanted to post my solution on a tooltip using the TreeLoader. I did not want to change the javascript so I did the following:

- a function:

private String getToolTip (Integer value, String tooltip) {
   StringBuilder text = new StringBuilder ();
   text.append ("<div ext:qtitle = \"\" " + "ext:qtip = \"");
   text.append (tooltip);
   text.append ("\"/> "+ value + "</div>");
   return text.toString();
}

and then inside the JSONObject build my tooltip with data that I want.

StringBuilder tooltip = new StringBuilder ();
MyJSon JSONObject = new JSONObject (); / / JsonObject data
tooltip.append ("Label");
tooltip.append (myBean.getValue ()+"  ");
myJSon.put ("value", getToolTip (myBean.getValue (), tooltip.toString ()));
 
This obviously is server-side.

Thanks Faber!

Java Swing - Date Picker dialog to select a date

This is addressed to the few Java Swing developers, who may still be out there and looking for cool widgets.

How many times did you need a date picker widget? you know, like the one from the GWT for example, and there are many others available.

Unfortunatelly the Java Swing library doesn't have a built-in one. Anyways, I found a good starting point here, http://sourceforge.net/projects/datepicker/ -- which is a very nicely done example, a little incomplete, but still good to go.

Because I wanted this widget to be perfect, I've updated and enhanced and it can do the followings:
  • automatic extract the name of the days and months from the Java locale (not like the original from a properties file).
  • automatic detects and display the first day of the week according with the used locale (not like the original that uses hard-coded only US style).
  • correct the coloring in red of the weekend days (not like original that had only Sundays on red, and Saturdays on gray). 
  • corrected the button images to have all the same size (better header than the original)
  • implemented the "close on away click" feature to easily close the picker dialog when click away.
These are the results of the Java Swing widget:

  

The first image is a read-only text-field and a button, which will open the date-picker dialog, as seen in the second image.

We can fast scroll though months and years, or quickly select from the 2 combos, and for the days just press on the date, which you want to select.

Hope you like it -- the source code is available here.

Cheers!

PS: you can see this widget at work, in my free application Money On Thread.