Tại sao nhãn trục Y của tôi xuất hiện trên trục? JQM

Question

Tôi đã làm việc để thiết lập một trang web sử dụng JQuery Mobile và Flot. Ý tưởng là nó có thể hiển thị đồ thị mà bạn có thể vuốt giữa.

Cho đến nay tôi đã nhận điều này: http://lasmit.co.uk/tmm-graphs/graph2.php

Biểu đồ đầu tiên hoạt động tốt, nhưng nếu bạn swipe sang một bên các nhãn xuất hiện trên đường trục và tìm ra.

Tôi chắc rằng tôi thiếu một số điều hiển nhiên ở đây nên mọi trợ giúp sẽ được đánh giá cao.

Answer 1

Flot không hoạt động tốt khi bạn gọi $.plot trên thứ gì đó hiện không hiển thị. Tốt nhất là sẽ được di chuyển trang của bạn 2 và 3 biểu đồ vào pageshow sự kiện:

$('#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"] } }); 
}); 

tôi đã thực hiện một ví dụ làm việc ở đây: http://jsfiddle.net/ryleyb/yZuZb/

Answer 2

Có vẻ như đã xảy ra lỗi khi trượt, vì biểu đồ hiển thị chính xác khi trang được truy cập trực tiếp, ví dụ: mở URL sau: http://lasmit.co.uk/tmm-graphs/graph2.php#device2, nhưng sau đó các trang khác được hiển thị không chính xác.

Bạn đặt kích thước của các phần tử DIV, bạn có thể thử đặt kích thước chính xác cho ô không?