Sunday, August 26, 2012

GWT Celltable - Add multiple anchors to a cell



I am trying to insert multiple anchors in a single celltable cell. This is how it would look like-
The cars column has multiple cars, each car link can be clicked to perform different actions.
I have extended a MultipleAnchorCell class from AbstractSafeHtmlCell like this-



And then I use this cell in a celltable to create a column. My User class contains comma separated values of cars in a class variable.

      

       

I am still learning GWT and it took me a while to figure this out.

Comments/feedback is welcome.
===============================================================

Saturday, April 7, 2012

GWT dygraph example using visualization datatable

Here is a quick example of how to create a dygraph using GWT and visualization api to get the datatable.

1. Add dygraph-gwt.jar to your build path and these inherits tags in your mysamplegwtproj.gwt.xml file

<inherits name="com.google.gwt.visualization.Visualization"/>
<inherits name="org.danvk.dygraphs"/>

2. Add the following script tag in mysamplegwtproject.html file

<script type="text/javascript" src="dygraph-combined.js">
<script type="text/javascript" src="http://www.google.com/jsapi">
3. Add the following code in your onModuleLoad() function-



        final VerticalPanel vp = new VerticalPanel();
        vp.setWidth("700px");
        vp.setHeight("700px");
        VisualizationUtils.loadVisualizationApi(new Runnable() {
            @Override
            public void run() {
                Query q = Query
                        .create("mysampleproj/getMyDatatable?params=2&id=1");

                q.send(new Callback() {
                    @Override
                    public void onResponse(QueryResponse response) {
                        JavaScriptObject jdygraph = createDygraph(
                                vp.getElement(), response.getDataTable(), 0,
                                100);
                    }
                });
            }
        }, LineChart.PACKAGE);

        RootPanel.get().add(vp);

4. Here is the JSNI function which actually creates the dygraph.


public static native JavaScriptObject createDygraph(Element element,
            DataTable dataTable, double minY, double maxY) /*-{
        var chart = new $wnd.Dygraph.GVizChart(element);
        chart.draw(dataTable, {
            valueRange : [ minY, maxY ],
            displayAnnotations : true,
            showRangeSelector : true,
            legend : 'always',
            labelsDivStyles : {
                'textAlign' : 'right'
            },
            title : 'TITLE',
            titleHeight : 25,            
            axes : {
                x : {
                    pixelsPerLabel : 50
                }
            }            
        });
        return chart;
    }-*/;

Hope this helps. Suggestions/improvements are welcome.

===============================================================
 

Wednesday, April 4, 2012

NoClassDefFoundError: com.google.common.collect.Sets


Error-
NoClassDefFoundError: "com.google.common.collect.Sets"

Solution-
Add guava-11.0.2.jar to WEB-INF/lib and add it to the build path.

Wednesday, March 21, 2012

GWT wrapper for visualization treemap with mouse events

A treemap is a helpful visualization of a data tree. It would be nice if the treemap had features like weighted box sizes for intermediate levels and explicitly setting up colors for non-leaf nodes. I wrote a  quick Google Web Toolkit(GWT) wrapper for Google visualization treemap-

 public class TreeMap extends Visualization<TreeMap.Options>
{
   public static class Options extends AbstractDrawOptions {
       public static Options create() {
           return JavaScriptObject.createObject().cast();
       }

       protected Options() { }
   }

   public static final String PACKAGE = "treemap";

   public TreeMap() {
       super();
   }

   public TreeMap(AbstractDataTable data, Options options) {
       super(data, options);
   }

   @Override
   protected native JavaScriptObject createJso(Element parent) /*-{
       return new $wnd.google.visualization.TreeMap(parent);                
   }-*/;
   
   public final void addOnMouseOverHandler(OnMouseOverHandler handler) {
       Handler.addHandler(this, "onmouseover", handler);
   }
   
   public final void addOnMouseOutHandler(OnMouseOutHandler handler) {
       Handler.addHandler(this, "onmouseout", handler);
   }
}

Tuesday, March 20, 2012

Postgres script - for loop two dimension array using array upper and lower


A basic script to loop over an array in psql-


CREATE OR REPLACE FUNCTION func1(n character varying, v character varying)

  RETURNS integer AS

$BODY$

    DECLARE   

       return_code integer;

    BEGIN

       RAISE NOTICE '(%,%)', n, v;          

       return_code := 1;

    RETURN return_code; 

    EXCEPTION 

        WHEN NO_DATA_FOUND THEN           
           RETURN -1;
    END;

    $BODY$

  LANGUAGE plpgsql;

CREATE OR REPLACE FUNCTION func2()

  RETURNS integer AS

$BODY$

    DECLARE      

       return_code integer;

       pairs varchar[][] := array[['key2','val2'],

                            ['key1','val2']];

    BEGIN

        FOR i IN array_lower(pairs, 1) .. array_upper(pairs, 1)

        LOOP

         --RAISE NOTICE '%,%',pairs[i][1]::varchar, pairs[i][2]::varchar;

           PERFORM func1(pairs[i][1]::varchar, pairs[i][2]::varchar);

        END LOOP;

    return 1;

    END;

    $BODY$

  LANGUAGE plpgsql;

SELECT * from func2();

Saturday, October 15, 2011

Problem - GWT logging not working

When you inherit certain modules in .gwt.xml file, it disables GWT logging. This happened to me when I tried inheriting Requestfactory. Some modules inherit com.google.gwt.logging.LoggingDisabled  internally and thus affect your logging.

To fix this you should explicitly enable logging after you have inherited all your modules. At the end of your list of inherits add the following to your .gwt.xml file-

<set-property name="gwt.logging.enabled" value="TRUE"/>

Executing Postgres crosstab query as a prepared statement


I was executing a crosstab query as a prepared statement in Java(in a GWT app) and getting the following error -

PSQLException - Can't use query methods that take a query string on a PreparedStatement.

With some helpful folks from stackflow, I was able to resolve the error with the following code -

String query = "SELECT * FROM crosstab(
                      'SELECT rowid, a_name, value
                       FROM test WHERE a_name = ''att2''
                                    OR a_name = ''att3''
                      ORDER BY 1,2'
) AS ct(row_name text, cat_1 text, cat_2 text, cat_3 text);";

PreparedStatement stat = conn.prepareStatement(query);
ResultSet rs = stat.getResultSet();

//Note that, it is executeQuery() and not executeQuery(query)
stat.executeQuery();
rs = stat.getResultSet();
while (rs.next()) {
    //TODO
}





Thanks!