jqPlot Gestapeltes Balkendiagramm außerhalb des Diagramms gerendert
Ich verwende jqPlot, um ein gestapeltes Balkendiagramm basierend auf Daten einer Webmethode zu erstellen.
Das Diagramm wird erfolgreich gerendert, ist jedoch leer. Wenn ich die pointLabels auf "true" setze, erscheinen sie in einem Durcheinander auf der linken Seite des Diagramms. Ich schätze, die gestapelten Balken werden auch außerhalb der Grafik gerendert, aber ich verstehe nicht warum.
Könnte jemand bitte erklären, wie das zu beheben ist?
Hier ist die Webmethode:
%Vor%Hier ist die DataPoint-Klasse, die von der Webmethode verwendet wird:
%Vor%Hier ein Beispiel für die Daten aus der Datenbank:
Hier ist das Javascript:
%Vor%1 Antwort
Ich denke, es gibt zwei Dinge, die sich zu Ihrem Problem zusammenfügen:
Erstens: Arrays nicht richtig duplizieren . Wenn Sie Ihre Daten in Typen aufteilen, setzen Sie Ihr temporäres Array mit arrType.length = 0 zurück. Dadurch wird die Array-Länge zurückgesetzt, aber es wird kein neues Array erstellt. Das bedeutet, dass tatsächlich alle Array-Referenzen, die Sie auf arr setzen, auf dasselbe Array zeigen - die letzten Daten für den letzten verarbeiteten Typ. Sie müssen arrType.length = 0; durch ersetzen:
arrType = [];
Alternativ können Sie .length = 0 beibehalten und Folgendes verwenden, wenn Sie das Array auf arr :
arr.push(arrType.slice());
Zweitens: falscher Renderer wird verwendet . Der Renderer für xaxis sollte $.jqplot.DateAxisRenderer und nicht $.jqplot.CategoryAxisRenderer sein, was Sie gerade verwenden. Der date-Renderer ist ebenfalls ein Plugin, also müssen Sie Folgendes berücksichtigen (natürlich mit einem Pfad, der an Ihre Einstellungen angepasst wurde):
<script type="text/javascript" src="plugins/jqplot.dateAxisRenderer.js"></script>
Sie möchten tickOptions für xaxis etwa so aussehen:
tickOptions: { formatString: '%b %#d', angle: -30 }
Mit diesen Anpassungen und mit einigen Beispieldaten, die von Ihrem C # -Code abgeleitet wurden, hat JS erfolgreich folgendes erzeugt:
Hoffe, dass das Problem gelöst wird!
Tags und Links javascript charts webmethod jqplot