2013-02-06 6 views
8

J'ai besoin d'aide pour un problème avec les étiquettes de catégorie pour xAxis. Quand il n'y a plus de place pour toutes les étiquettes de catégorie, elles sont entassées et se chevauchent.Étiquettes de catégorie chevauchantes de type Highcharts

J'ai cherché pour voir si je pouvais trouver un moyen de m'assurer que cela n'arrive pas, d'abord j'ai cherché une solution de défilement, puis une sorte de zoom, et finalement j'ai essayé d'aller pour StaggerLines.

Le problème est que, si je dois utiliser staggerLines, je dois définir la valeur en fonction du nombre de catégories que j'ai. Si j'en ai 10 ou moins, la valeur de staggerLine est définie sur 1, 11-20, je veux qu'elle soit définie sur 2, 21-30, je veux la définir sur 3 et ainsi de suite. Je ne peux pas simplement le mettre à 3, parce que parfois ce ne sera que quelques catégories, et ça ne sera pas très bien avec staggerLines.

Quelqu'un a une bonne suggestion pour résoudre ce problème?

+0

affichant pas cela comme une solution car cela doit certainement être fixé Highcharts mais ce que nous faisons est pour toutes les catégories Tableaux de données xAxis nous avons le xAxis vertical. De cette façon, le texte est horizontal pour les étiquettes. Correctif sale, mais cela fonctionne pour nos données une fois que nous avons les dimensions du graphique définies correctement. – wergeld

+0

Drôle, j'ai le problème inverse (en utilisant 4.0.4). Les catégories sont tronquées car elles ne correspondent pas. – nilskp

Répondre

7

Vous n'avez pas à utiliser de catégories du tout. En général, les catégories sont bonnes à montrer par exemple. fruits, ou noms - comment définir quel nom devrait être affiché, et lequel ne devrait pas? La pomme est-elle plus importante que la banane?

Cependant, la solution est assez simple, en utilisant formatter étiquette axeX, jetez un oeil: http://jsbin.com/oyudan/27/edit

xAxis: { 
    labels: { 
    formatter: function(){ 
     return names[this.value]; 
    } 
    } 
}, 
+0

Merci, bourgeon. Cela m'a beaucoup aidé. –

+1

Le secret ici est de vous assurer de ne pas utiliser "categories: Names" dans la définition xAxis. Le graphique est assez intelligent pour saisir les étiquettes dont il a besoin. –

Questions connexes