Comment puis-je définir un montant maximal de tiques dans un d3.svg.axe

J'ai le problème que les étiquettes de mes d3.svg.axis sont parfois se chevauchent. À cet effet, je voudrais réduire le montant maximal des tiques et des étiquettes à un certain montant.

Je n'arrive pas à trouver une solution dans le La documentation de l'API.

Je ne peux pas utiliser axis.tickValues() car la plage est dynamique et peut aller de quelques heures à plusieurs années.

J'ai essayé d'utiliser axis.ticks(9) mais il ne semble pas avoir un effet. Vous pouvez voir un exemple sur bl.ocks.org/3181719.

  • Ce qui s'est passé lorsque vous avez utilisé ticks()? Aussi, avez-vous pensé à utiliser tickValues()?
InformationsquelleAutor Pierre Spring | 2012-07-25
  1. 32

    L'une de ces deux devraient le faire pour vous. Il suffit de spécifier axis.ticks(10) pour spécifier le nombre de graduations ou axis.tickValues([1,2,4]) pour spécifier la graduations qui doit apparaître.

    Puisque vous êtes à l'aide de dates, vous aurez besoin de faire quelque chose comme ceci:

     .ticks(d3.time.weeks, 2)

    Vous pouvez en savoir plus sur les intervalles de temps à https://github.com/mbostock/d3/wiki/Time-Intervals. Vous pouvez voir un exemple sur la façon dont je le fais à http://bl.ocks.org/1962173 pour mettre à jour les tiques en fonction de la durée de temps d'être montré.

    if ((maxExtent - minExtent) > 1468800000) {
    x1DateAxis.ticks(d3.time.mondays, 1).tickFormat(d3.time.format('%a %d'))
    x1MonthAxis.ticks(d3.time.mondays, 1).tickFormat(d3.time.format('%b - Week %W'))        
}
else if ((maxExtent - minExtent) > 172800000) {
    x1DateAxis.ticks(d3.time.days, 1).tickFormat(d3.time.format('%a %d'))
    x1MonthAxis.ticks(d3.time.mondays, 1).tickFormat(d3.time.format('%b - Week %W'))
}
else {
    x1DateAxis.ticks(d3.time.hours, 4).tickFormat(d3.time.format('%I %p'))
    x1MonthAxis.ticks(d3.time.days, 1).tickFormat(d3.time.format('%b %e'))
}
    • J'ai essayé d'utiliser axis.ticks() mais ne semble pas fonctionner. J'ai mis à jour la question avec un exemple. Je ne peux pas utiliser axis.tickValues() car la plage est dynamique et peut aller de quelques heures à severa ans.
    • Ah, c'est de l'information utile. J'ai mis à jour ma réponse.
    • .les tiques(d3.temps.lundi, 1) sauver ma vie. Parfait pour passer d'fixe les tiques de la valeur à la vue Semaine. Merci !!
    • C'est génial. Merci beaucoup. Avoir été coincé avec ce problème depuis un certain temps maintenant.
    • Comment utiliserez-vous cette avec axe Linéaire/échelle?
    InformationsquelleAutor Bill