Why do Y axis labels appear above the axis? Jqm

I am working on setting up a site using jQuery Mobile and Flot. The idea is that it can display graphs that you can scroll between them.

So far, I got this: http://lasmit.co.uk/tmm-graphs/graph2.php

The first graph works fine, but if you swipe your finger to the side, the labels will appear above the axis line and come off.

I am sure that I am missing something obvious here, so any help would be greatly appreciated.

+5
source share
2 answers

The fleet does not work too well when you call $.ploton something that is currently not visible. Your best bet would be to move your pages 2 and 3 into events pageshow:

$('#device2').bind('pageshow',function(){    
  $.plot($("#total-inches-graph"), 
    [{  color: "rgb(14, 91, 173)", label: 'Total Measurements', data: totalInchesArray }] , 
    { xaxis: { mode: "time", timeformat: "%a" ,minTickSize: [1, "day"] } });
});

$('#device3').bind('pageshow',function(){    
  $.plot($("#weight-graph"), 
    [{  color: "rgb(32, 140, 47)", label: 'Weight', data: weightArray }] , 
    { xaxis: { mode: "time", timeformat: "%a" ,minTickSize: [1, "day"] } });
});

: http://jsfiddle.net/ryleyb/yZuZb/

+14
0

All Articles