FacetChart Examples

[rkumsher]

Are there any examples of the FacetChart anywhere yet?

[jvmvik]

I don't think so .. And, moreover com.smartgwt.client.widgets.chart.FacetChart cannot be used because dependencies are no available.

jar tvf smartgwt.jar | grep ISC_Drawing.js

[Isomorphic]

We're adding some standalone examples, in the meantime you can see the FacetChart in action here.

To try this out, you need to download the Pro/EE Evaluation.

[Sytematic]

Any thoughts on when they will be added?

I am particularly interested in some charts NOT tied to a cube, for when there is a requirement for like a simple bar chart based on some grid data.

[Isomorphic]

Here's some sample code demonstrating a simple FacetChart with no associated CubeGrid instance.
You will need the next nightly build (available Feb 4) to run this sample. We'll also be incorporating this into the showcase in the near future

Regards
Isomorphic Software

public class SimpleChart implements EntryPoint {

    @Override
    public void onModuleLoad() {
        // Suppose you have an array of Records
        // representing sales of certain products in certain regions
        class SalesRecord extends Record {
            SalesRecord(String region, String product, Integer sales) {
                setAttribute("region", region);
                setAttribute("product", product);
                setAttribute("sales", sales);
            }
        };
        
        Record[] chartData = new Record[] {
                new SalesRecord("West", "Cars", 37),
                new SalesRecord("North", "Cars", 29),
                new SalesRecord("East", "Cars", 80),
                new SalesRecord("South", "Cars", 87),
                new SalesRecord("West", "Trucks", 23),
                new SalesRecord("North", "Trucks", 45),
                new SalesRecord("East", "Trucks", 32),
                new SalesRecord("South", "Trucks", 67),
                new SalesRecord("West", "Motorcycles", 12),
                new SalesRecord("North", "Motorcycles", 4),
                new SalesRecord("East", "Motorcycles", 23),
                new SalesRecord("South", "Motorcycles", 45)
        };
        // You could construct a simple chart of that data like this ...

        final FacetChart simpleChart = new FacetChart();
        
        // Specify facets where ID is set to the key used for this facet in the data above
        // and title is the user-visible title you want in the chart
        Facet regionFacet = new  Facet("region", "Region");
        Facet productFacet = new Facet("product", "Product");
        simpleChart.setFacets(regionFacet,productFacet);
        
        simpleChart.setData(chartData);
        simpleChart.setValueProperty("sales");
        simpleChart.setChartType(ChartType.AREA);
        simpleChart.setTitle("Sales by Product and Region");
        
        // This is a form which you can use to change the chart type
        DynamicForm chartSelector = new DynamicForm();
        SelectItem chartType = new SelectItem("chartType");
        chartType.setTitle("Chart Type");
        
        
        chartType.setValueMap("Area", "Column","Line", "Radar");
        chartType.setDefaultValue("Area");
        chartType.addChangedHandler(new ChangedHandler() {
            
            private Map<String, ChartType> chartTypes = new HashMap<String, ChartType>() {{
                put("Area", ChartType.AREA);
                put("Column", ChartType.COLUMN);
                put("Line", ChartType.LINE);
                put("Radar", ChartType.RADAR);
            }};
            
            @Override
            public void onChanged(ChangedEvent event) {
                String typeName = (String)event.getValue();
                simpleChart.setChartType(chartTypes.get(typeName));
            }
        });
        chartSelector.setItems(chartType);
        
        // Overall layout
        VLayout simpleChartLayout = new VLayout();
        simpleChartLayout.setWidth100();
        simpleChartLayout.setHeight100();
        simpleChartLayout.setMembersMargin(20);
        simpleChartLayout.setMembers(chartSelector, simpleChart);
        simpleChartLayout.draw();
        
    }

}

[Sytematic]

Thanks!

Is this analytics / drawing module already for sale when I've got a Power license already? ie. can I run the sample below if I would buy the analytics module today?

[Isomorphic]

Yes, with a Power license you can just buy the module and start using the FacetChart (and CubeGrid).

[curiousgally]

Can you provide a sample which would work with the 2.4 stable evaluation edition.

thanks.

[curiousgally]

Hi,

I tried this sample with latest nightly build taken from smartgwt. I get the following error on module load.

ERROR: Unable to load module entry point class com.smartgwt.sample.client.BuiltInDS (see associated exception for details). com.google.gwt.core.client.JavaScriptException: (TypeError): $wnd.isc[scClassName] is undefined
 fileName: http://127.0.0.1:8888
 lineNumber: 12
 stack: ()@http://127.0.0.1:8888:12
((void 0),"builtinds","http://127.0.0.1:8888/builtinds/",0)@http://127.0.0.1:8888/builtinds/hosted.html?builtinds:281
C()@http://127.0.0.1:8888/builtinds/builtinds.nocache.js:3
(-1)@http://127.0.0.1:8888/builtinds/builtinds.nocache.js:10

	at com.google.gwt.dev.shell.BrowserChannelServer.invokeJavascript(BrowserChannelServer.java:237)
	at com.google.gwt.dev.shell.ModuleSpaceOOPHM.doInvoke(ModuleSpaceOOPHM.java:126)
	at com.google.gwt.dev.shell.ModuleSpace.invokeNative(ModuleSpace.java:561)
	at com.google.gwt.dev.shell.ModuleSpace.invokeNativeObject(ModuleSpace.java:269)
	at com.google.gwt.dev.shell.JavaScriptHost.invokeNativeObject(JavaScriptHost.java:91)
	at com.smartgwt.client.widgets.chart.FacetChart.create(FacetChart.java)
	at com.smartgwt.client.widgets.BaseWidget.getOrCreateJsObj(BaseWidget.java:361)
	at com.smartgwt.client.util.JSOHelper.convertToJavaScriptArray(JSOHelper.java:643)
	at com.smartgwt.client.widgets.BaseWidget.setAttribute(BaseWidget.java:664)
	at com.smartgwt.client.widgets.layout.Layout.setMembers(Layout.java:1054)
	at com.smartgwt.sample.client.BuiltInDS.onModuleLoad(BuiltInDS.java:101)
	at sun.reflect.NativeMethodAccessorImpl.invoke0(Native Method)
	at sun.reflect.NativeMethodAccessorImpl.invoke(NativeMethodAccessorImpl.java:39)
	at sun.reflect.DelegatingMethodAccessorImpl.invoke(DelegatingMethodAccessorImpl.java:25)
	at java.lang.reflect.Method.invoke(Method.java:592)
	at com.google.gwt.dev.shell.ModuleSpace.onLoad(ModuleSpace.java:396)
	at com.google.gwt.dev.shell.OophmSessionHandler.loadModule(OophmSessionHandler.java:183)
	at com.google.gwt.dev.shell.BrowserChannelServer.processConnection(BrowserChannelServer.java:510)
	at com.google.gwt.dev.shell.BrowserChannelServer.run(BrowserChannelServer.java:352)
	at java.lang.Thread.run(Thread.java:595)
ERROR: Failed to load module 'builtinds' from user agent 'Mozilla/5.0 (Windows NT 5.1; rv:2.0) Gecko/20100101 Firefox/4.0' at localhost:2063.

Please provide pointers if I'm missing any javascript loads in the html page.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<!-- The HTML 4.01 Transitional DOCTYPE declaration-->
<!-- above set at the top of the file will set     -->
<!-- the browser's rendering engine into           -->
<!-- "Quirks Mode". Replacing this declaration     -->
<!-- with a "Standards Mode" doctype is supported, -->
<!-- but may lead to some differences in layout.   -->
<html>
  <head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <!--                                           -->
    <!-- Any title is fine                         -->
    <!--                                           -->
    <title>BuiltInDS</title>
    
    <!-- IMPORTANT : You must set the variable isomorphicDir to [MODULE_NAME]/sc/ so that the SmartGWT resource are 
	  correctly resolved -->	
	<script> var isomorphicDir = "builtinds/sc/"; </script>
    <!--                                           -->
    <!-- This script loads your compiled module.   -->
    <!-- If you add any GWT meta tags, they must   -->
    <!-- be added before this line.                -->
    <!--                                           -->
          <!--<script type="text/javascript" language="javascript" src="builtinds/sc/modules/ISC_Forms.js"></script>-->
      <!--<script type="text/javascript" language="javascript" src="builtinds/sc/modules/ISC_Core.js"></script>-->
    <script type="text/javascript" language="javascript" src="builtinds/builtinds.nocache.js"></script>

  </head>

  <!--                                           -->
  <!-- The body can have arbitrary html, or      -->
  <!-- you can leave the body empty if you want  -->
  <!-- to create a completely dynamic UI.        -->
  <!--                                           -->
  <body>

    <!--load the datasources-->
    <script src="builtinds/sc/DataSourceLoader?dataSource=supplyItem,animals,employees,adb"></script>

    <!-- OPTIONAL: include this if you want history support -->
    <iframe src="javascript:''" id="__gwt_historyFrame" tabIndex='-1' style="position:absolute;width:0;height:0;border:0"></iframe>

  </body>
</html>

[bartyhoho]

I get the same error as curiousgally when trying to run the sample standalone, using both the standard 2.4 EE release and the current (June 14, 2011) 2.5 nightly build.

Also, in the javadoc, there does not appear to be a "setFacets" method for the FaceChart, like in the sample.

Bart

[Isomorphic]

You forgot to <inherit> Drawing and Analytics - see OptionalModules doc.

As far as JavaDoc, sounds like you're looking at something from a prior release.

[vishal.superb]

I've been using SmartGwt 2.4 Enterprise Edition, but there is no setFacets() method in the Facet Chart Class associated in this version. plz help me, Where can i find this method??

[bartyhoho]

You have to download a nightly build of SmartGwt 2.5.

Bart

[Vali]

Will the charts be available on editions other than Enterprise ?

[Isomorphic]

They are already available with a Power license plus the Analytics module.