Ich habe einen Workaround gefunden. Es erfordert etwas Hacking, aber es funktioniert:
1) Ändern Sie zunächst Ihren Datensatz. Iteriere alle Punkte und mutiere X-Werte so, dass sie mit der neuen Position in deinem Diagramm übereinstimmen. Speichern Sie den ursprünglichen X-Wert in einer Eigenschaft für zukünftige Verwendung (in Tooltips)
2) Jetzt können Sie die Daten auf dem Diagramm zeichnen und sie richtig aussehen. Das Problem ist mit Tooltips und Ticks.
Wie mit den Zecken beschäftigen:
Die Zecken sind eine Liste von mutierten Zahlen (sie auf ihre ursprünglichen Werte entsprechen nicht). Du hast einen Hack benutzt. Überschreiben Sie vorübergehend chartController.ticks
in afterBuildTicks
Methode mit Array von Objekten (anstelle von einfachen Zahlen) mit ursprünglichen entsprechenden x-Werte. Sie müssen den ursprünglichen x-Wert für jedes Häkchen annähern. Damit können Sie diese Informationen in Ticks Callback verwenden, um korrekte Etiketten für Ticks zurückzugeben. Mit solchen mutierten Daten wird das Diagramm nicht plotten. Sie müssen es in den Zustand vor der Mutation zurückversetzen. In der Methode afterTickToLabelConversion
die Ticks wiederherstellen. Denken Sie daran, dass sie jetzt in der Eigenschaft gespeichert sind ticksAsNumbers
Der ähnliche Hack sollte mit Tooltips Callbacks erfolgen. Sie haben Zugriff auf den Dataset und den utated x -Wert. Ungefährer originaler x-Wert für mutiertes x und das ist es.
Dies ist möglicherweise ein Duplikat von: https://stackoverflow.com/questions/25284124/chart-js-gap-between-points –
@DonnyBridgen Diese Frage scheint tatsächlich das Gegenteil der verknüpften Frage zu fragen. Diese Frage fragt, wie man Lücken schafft. In dieser Frage geht es darum, Lücken zu vermeiden. –
@ArturOwczarek Haben Sie eine JSFiddle mit dem Code, den Sie gerade verwenden, den Sie teilen können? –