BUG REPORT: Chart Legend Placement inconsistent and chart.setCenterLegend not working

[lpolvani]

We switched theme from enterprise to stratos and the chart legend is now left aligned:


So we tried to use setCenterLegend to no avail.

Here's the code to replicate the issue:

 
 public class AppEntryPoint implements EntryPoint  
 {  
     @Override  
     public void onModuleLoad()  
     {  
         final FacetChart chart = new FacetChart();  
         chart.setData(records());  
         chart.setFacets(new Facet("region", "Region"), new Facet("product", "Product"));  
         chart.setValueProperty("sales");  
         chart.setChartType(ChartType.AREA);  
         chart.setTitle("Sales by Product and Region");  
     
         chart.setCenterLegend(true);  
     
         VLayout layout = new VLayout();  
         layout.setWidth100();  
         layout.setHeight100();  
         layout.addMember(chart);  
     
         layout.draw();  
     }  
     
     private final Record simpleChartData(String region, String product, Integer sales)  
     {  
         Record record = new Record();  
         record.setAttribute("region", region);  
         record.setAttribute("product", product);  
         record.setAttribute("sales", sales);  
         return record;  
     }  
     
     private final Record[] records()  
     {  
         return new Record[] {  
                 simpleChartData("West", "Cars", 37),  
                 simpleChartData("North", "Cars", 29),  
                 simpleChartData("East", "Cars", 80),  
                 simpleChartData("South", "Cars", 87),  
     
                 simpleChartData("West", "Trucks", 23),  
                 simpleChartData("North", "Trucks", 45),  
                 simpleChartData("East", "Trucks", 32),  
                 simpleChartData("South", "Trucks", 67),  
     
                 simpleChartData("West", "Motorcycles", 12),  
                 simpleChartData("North", "Motorcycles", 4),  
                 simpleChartData("East", "Motorcycles", 23),  
                 simpleChartData("South", "Motorcycles", 45)  
         };  
     }  
 }

[Isomorphic]

setCenterLegend() centers the legend, not the title - you would need to set FacetChart.titleAlign, which defaults to "left" in the Stratus skin.

However, the titleAlign API has never been publicly documented, and so FacetChart.setTitleAlign() doesn't exist in SmartGWT.

We've just made it public and you'll find setTitleAlign() to be present and working as of tomorrow's builds.

If you like, you can override the skin-default setting, as with any other defaults, with code like this at the top of your app:

FacetChart config = new FacetChart();
config.setTitleAlign(TitleAlign.CENTER);
FacetChart.setDefaultProperties(config);

[Isomorphic]

In fact, we misread that your problem was just with the title in the chart - as you note, the same issue was present for setLegendAlign(LegendAlign), and that's also now fixed for tomorrow's builds. We're taking a second look at the centerTitle and centerLegend attributes and will update here separately.

[Isomorphic]

A quick update on this - having made setTitleAlign() and setLegendAlign() visible to SGWT, there are no other bugs/problems here - we've expanded the docs for centerLegend and centerTitle a little to better explain what's going on.

You can check out the entirety of these changes in builds dated September 24 and later.