jQuery Mobile mit flot und AJAX-navigation

Ich versuche, die Anzeige einer flot erstellte Diagramme in einer jQuery-Mobile-Projekt.
Wenn ich den Aufruf der jQuery-Mobile-Seite, indem Sie den absoluten Pfad (sth. wie: http://server.com/graph/fancy.php) funktioniert alles einwandfrei, aber sobald ich mit dem jQM integrierten AJAx-navigation sieht das Diagramm verschlüsselt.

Fand ich auch das andere Thema jquery mobile und flot-Bibliothek, aber keine der hier beschriebenen Lösungen haben bei mir funktioniert.

Gibt es einen Weg, um jQM und flot arbeiten Sie zusammen? Leider die Deaktivierung von AJAX ist auch keine option.

Diagramm Erzeugung:

<script type="text/javascript">
var data = [[0, 3], [4, 8], [8, 5], [9, 13]];
$(function () {
    var plot = $.plot($("#chart"), [
        {
            label: "Oh hai",
            data: data,
            bars: { show: true }
        }
    ]);
});
</script>
<div id="chart" style="width: 600px; height: 350px;"></div>
  • Kannst du ein Beispiel auf jsfiddle.net bitte?
  • Hier gehen Sie: jsfiddle.net/MT22y/5 Bitte beachten Sie, dass in meiner Anwendung der graph-Seite tatsächlich in eine separate Datei, aber der Fehler hält an, zeigt sich sowieso (man beachte das y-Achse)
InformationsquelleAutor Max | 2011-06-16
  1. 12

    Was Sie tun müssen, ist, bewegen Sie Ihre plot-Funktion in eine pageshow Veranstaltung. Dies ist, weil flot funktioniert nicht gut in Platzhalter, die nicht sichtbar sind. Versuchen Sie es so:

    $('#graph').bind('pageshow', function() {
    var plot = $.plot($("#chart"), [
        {
        label: "Oh hai",
        data: data,
        bars: {
            show: true
        }}
    ]);
});

    In Aktion hier: http://jsfiddle.net/MT22y/8/

    • Nette Antwort, das wusste ich nicht.
    InformationsquelleAutor Ryley
  2. 0

    Ich denke du bist am besten dran, nur das überschreiben der Stile der Diagramm-Elemente. Zum Beispiel zog ich das Diagramm auf der Seite durch hinzufügen Polsterung: http://jsfiddle.net/MT22y/7/ so, dass es nicht abdecken der Achse nicht mehr.

    Könnten Sie brauchen, um zu spielen mit den Stilen und breiten, ein wenig, aber das ist wohl die einfachste Methode.

    InformationsquelleAutor Jivings
Schreibe einen Kommentar