Menu

Multiple X Axis shows both sets of categories since 1.5 update

Vince
2013-01-04
2013-01-17
  • Vince

    Vince - 2013-01-04

    I have 2 X axis on my chart. The reason I have 2 is because the second axis has rotated labels and the first doesn't. Since the 1.5 update, as a switch between adding data to one or the other axis, the one without data stays visible, ticks and labels. Before adding data to an axis I remove all series, so why is the other axis sticking around?

    Also, I'm new to posting in here, can I attach an image to a post?

     
  • Shawn Quinn

    Shawn Quinn - 2013-01-09

    (Yeah, you can definitely add an image to your post using the "add attachment" button for any individual post entry.)

    If you can attach a short code example that demonstrates the problem, that would help. I have a feeling this is an issue with the latest Highcharts.js file, but can't tell for sure. If it is, you may be able to get some pointers if you post your question over on the main Highcharts forums:

    http://highslide.com/forum/viewforum.php?f=8

    However, if the problem is GWT related, than this forum is the right place to be.

     
  • Vince

    Vince - 2013-01-09

    Thanks for the reply. Here is a short sample app and a screen shot. In the screen shot you can see 2 sets of labels under the x axis.

    public class MySampleApplication implements EntryPoint {

    boolean flip = true;
    Chart chart;
    
    final String HOURS[] = {"Midnight - 1AM",
            "1 AM - 2 AM", "2 AM - 3 AM", "3 AM - 4 AM", "4 AM - 5 AM", "5 AM - 6 AM", "6 AM - 7 AM", "7 AM - 8 AM",
            "8 AM - 9 AM", "9 AM - 10 AM", "10 AM - 11 AM", "11 AM - Noon"};
    final String DAYS[] = {"1", "2", "4", "5", "6"};
    
    public void onModuleLoad() {
        chart = new Chart().setChartTitleText("").setAlignTicks(true);
        chart.getXAxis(0);
        chart.getXAxis(1).setLabels(new XAxisLabels().setRotation(-90));
        chart.setWidth("600px");
        chart.setHeight("400px");
    
        Button button = new Button("BUTTON");
        button.addClickHandler(new ClickHandler() {
            @Override
            public void onClick(ClickEvent event) {
                chart.removeAllSeries();
                if(flip){
                    List<Point> pointValues = new ArrayList<Point>();
                    for(int i = 0; i < HOURS.length; i++){
                        pointValues.add(new Point(i, i+1));
                    }
                    getSeries(pointValues);
                }else{
                    List<Point> pointValues = new ArrayList<Point>();
                    for(int i = 0; i < DAYS.length; i++){
                        pointValues.add(new Point(i, i+1));
                    }
                    getSeries(pointValues);
                }
                flip = !flip;
            }
        });
        VerticalPanel panel = new VerticalPanel();
        panel.add(button);
        panel.add(chart);
        RootLayoutPanel.get().add(panel);
    }
    
    void getSeries( List<Point> pointValues){
        Series seriesTemplate = chart.createSeries()
                .setType(Series.Type.COLUMN)
                .setPoints(pointValues.toArray(new Point[pointValues.size()]))
                .setXAxis(flip ? 1 : 0);
        chart.addSeries(seriesTemplate);
    }
    

    }

     
  • Shawn Quinn

    Shawn Quinn - 2013-01-09

    Thanks Vince. I gave this a quick look and (at least when I run your code) the "chart.addSeries(seriesTemplate)" line isn't completing successfully. (If you can confirm that by just putting an alert or something before and after that line, that'd be good to know.)

    So, I dug into why it wasn't returning, and in my case it was failing within the "getSeriesExtremes()" within highcharts.src.js because the following line of that method:

    xExtremes = series.xAxis.getExtremes()
    

    is failing because "series.xAxis" is undefined (that's around line 6020 in my version of highcharts.src.js). Therefore, I'm suspecting you've uncovered a bug in the Highcharts JS library itself with series that are added to the chart after it is rendered (possibly related to the fact that you're using multiple x axis.) So, for next steps I'd suggest you try boiling this down to a simple JS example (to confirm that it is indeed a Highchart JS issue), and then submit it over on the main Highcharts forum to see if they can confirm it as a bug and get you a potential patch:

    http://highslide.com/forum/viewforum.php?f=8

    If you could update this post with whatever you find in order to benefit others that may run into a similar issue, that'd be much appreciated!

     
  • Vince

    Vince - 2013-01-14

    Here is a link to my highslide post. For anyone interested in following.

    http://highslide.com/forum/viewtopic.php?f=9&t=24196

     
  • Vince

    Vince - 2013-01-17

    There was a work around solution found here.
    http://highslide.com/forum/viewtopic.php?f=9&t=24196

     

Log in to post a comment.

Want the latest updates on software, tech news, and AI?
Get latest updates about software, tech news, and AI from SourceForge directly in your inbox once a month.