2015-06-26 9 views
10

Die Verwendung der folgenden Optionen hilft mir nicht, zu verhindern, dass sich meine CategoryAxisLabels im Liniendiagramm überlappen, wenn die Größe meines Browsers geändert wird.Verhindern, dass sich Kategorie-Beschriftungen in LineChart überlappen

categoryAxis.autoGridCount = true; 
categoryAxis.minHorizontalGap = 100; 
categoryAxis.gridPosition = "start"; 
categoryAxis.equalSpacing = false; 
categoryAxis.parseDates = false; 
chart.validateNow(); 

Ich trigne diese Funktionen auf dem $(wndow).on('resize', function() {...}); Ereignis.

Bitte beachten Sie, dass ich auch eine benutzerdefinierte labelFunction habe, um die Achsenbeschriftungen zu formatieren.

Mein Ergebnis: Es autoGridCounts von 476px zu niedrigeren, aber darüber, alle KategorieAxis Label Werte erscheinen auf der X-Achse und überlappen sich in einer schändlichsten Weise. :(

Kann jemand bitte helfen Sie mir. Wirklich stecken !! :(

+5

Können Sie Ihren gesamten Code und Daten schreiben? – martynasma

+0

@martynasma Ich benutze Objektmodell, wie X-Achsenwerte nicht überlappt. Angenommen, es enthält viele Alphabete. Gibt es irgendeine Methode, um zusätzlichen Text zu beschneiden oder zu verbergen oder um Text oder sogar Sland nach oben zu machen? – Santhucool

+0

Sie können die 'minHorizontalGap' (http://docs.amcharts.com/3/javascriptcharts/CategoryAxis#minHorizontalGap) erhöhen oder Beschriftungen mit verwenden 'labelRotation' (http://docs.amcharts.com/3/javascriptcharts/CategoryAxis#labelRotation) – martynasma

Antwort

0

auf über dieses Problem zu kommen, können Sie Kategorie Achsenbeschriftungen drehen. Sie drehen Winkel einstellen müssen und drehen cout für Kategorieachse.

"autoRotateAngle": 90,

"autoRotateCount": 1

(1) autoRotateAngle => Winkel von Etikettendrehung, wenn die Anzahl der in Reihe überschreitet autoR otateCount und parseDates werden auf false gesetzt.

(2) autoRotateCount => Wenn die Anzahl der Elemente der Kategorieachse den Wert von autoRotateCount überschreitet, werden die Beschriftungen um autoRotateAngle degree gedreht. Funktioniert nur, wenn parseDates falsch ist.

Weitere Informationen finden Sie in dieser URL. https://docs.amcharts.com/3/javascriptcharts/CategoryAxis

Demo