Menu

Changing axis categories and axis titles dynamically

2011-10-20
2012-07-13
  • Kombucha

    Kombucha - 2011-10-24

    Oh hai,

    This definitely works for me in this little test case (GWT 2.3, gwt-highcharts 1.1.2) :

    ~~~~~
    ::::java
    public class HighchartsRescue implements EntryPoint {
    public void onModuleLoad() {
    final Chart chart = new Chart().setType(Series.Type.SPLINE).setChartTitleText("I can haz cheezeburger").setMarginRight(10);

        Series series = chart.createSeries().setName("Yummy")
        .setPoints(new Number[] { 20, 157, 103, 12, 87, 960, 5});
        chart.addSeries(series);
    
        chart.getXAxis(); // That's the important part, call it (=> creates and keeps a reference of it) before rendering
    
        //chart.getXAxis().setCategories(false, "banana1", "banana2", "banana3", "banana4", "banana5", "banana6", "banana7");
    
        Button b = new Button("Change Categories !");
        b.addClickHandler(new ClickHandler() {
            @Override
            public void onClick(ClickEvent event) {
                chart.getXAxis().setCategories(true, "J", "F", "M", "A", "M", "J", "J", "A", "S", "O", "N", "D");
            }
        });
    
        RootPanel.get().add(chart);
        RootPanel.get().add(b);
    }
    

    }

    ~~~~~~

    So either you're not making the getXAxis call before rendering, or your doing something else that's messing with how things work, I dunno.

    kthxbai

     
  • Nuh

    Nuh - 2011-12-28

    Hi,
    Following the above comment, for making the Y-Axis title dynamic, I change the setAxisTitleText to below code snippet. If you're using jQuery this will work.

    private static native boolean setAxisTitleText(JavaScriptObject axis, String title)/*-{
      if(axis.axisTitle != null){
        $wnd.jQuery(axis.axisTitle.element).text(title);
       return true;
      }
      return false;
    }-*/;
    
     

    Last edit: Nuh 2011-12-29
  • Shawn Quinn

    Shawn Quinn - 2012-02-20

    FYI, for those that may run across this thread in the future, support to dynamically update the title of an axis post chart render time was added to Highcharts with the 2.2.0 release, and corresponding support was added to GWT Highcharts with the 1.2.0 release. So, you should now be able to dynamically change the text of an axis after the chart has been rendered by simply doing something like the following:

        chart.getXAxis().setAxisTitleText("New Title Here");
    

    Or, you can pass a full set of configuration options for more advanced cases like so:

    ~~~~~
    chart.getXAxis().setAxisTitle(new AxisTitle()
    .setText("New Title Here")
    .setStyle(new Style()
    .setColor("#ff0000")
    )
    );
    ~~~~~~

    Note that, as far as I know, this new method is currently only supported in Highcharts and not in Highstock, but I'd expect the Highsoft guys will likely promote that new method to a Highstock release in the near future as well.

    Hope that new mechanism helps those of you that were looking for this capability!

     

Log in to post a comment.