J'ai créé un graphique Barg à l'aide de SVGS. Je tente actuellement d'avoir mes valeurs de tiques comme des chaînes le long de mon axe X. Dans mon cas, l'axe des x représentera des couleurs (représentées comme des chaînes). J'ai des balances et j'ai des axes. Je veux un axe X qui affiche des valeurs de chaîne correspondant à chaque barre. Comment puis-je y aller?
3 Réponses :
Je pense que le problème est avec votre Je ne sais pas ce que le champ ticFormat , pas le bandeau . La fonction de format devrait être quelque chose comme: num dans vos données est censé représenter, le cas échéant. Peut-être que vous devez nettoyer votre représentation de données pour mieux d3.
Le problème réside ici:
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/5.7.0/d3.min.js"></script> <svg width="500" height="100"></svg>
pour 2021+ lecteurs qui jouent avec une mise en forme de tick sur certaines données avec plusieurs champs le précédent La solution TickFormat est la voie à suivre. C'est une mauvaise idée (TM) de lier votre domaine de données à un champ d'étiquettes / texte comme dans la solution acceptée.
Dans l'exemple donné, c'est bien, car il n'y a pas d'étiquettes de duplicités, mais cela ne peut être garanti dans d'autres scénarios. Par exemple, si vos données décrivaient des comtés américaines - vous devez gérer les 31 instances de "Washington County". P>
Le domaine code> de l'axe doit être l'identifiant. Champ avec le TickFormat Code> Manipulation de l'écran. P> import { scaleBand } from "d3-scale";
import { axisBottom } from "d3-axis";
xLabels = [{id: 0001, label: somelabel}, ...]
const xScale = scaleBand()
.domain(xLabels.map((d) => d.id))
.rangeRound([0, 500])
.paddingInner(0.1);
const xAxis = axisBottom(xScale)
.tickFormat(
(d) => xLabels.find((l) => l.id === d).label
)
Quelle est exactement votre question?
"Domaine de la bande d'échelle n'acceptera pas un tableau comme entrée" ... une échelle seulement Accepte un tableau comme entrée.
Ma question est de savoir comment puis-je obtenir mes tiques sur les axes X pour présenter des cordes? Quelles modifications dois-je apporter à mon travail? Pourquoi ces modifications sont-elles nécessaires? @Azmisov
@Michaelramagemikeramage D3 Les tiques sont toujours des cordes, donc ce n'est pas clair, quel est le problème ici. Comment est votre axe? Quelles valeurs avez-vous maintenant et quelles valeurs voulez-vous montrer?
J'aimerais que chaque coche sur mon axe X représente une couleur, qui est une chaîne dans mon jeu de données. Par conséquent, chaque tique doit avoir la couleur étiquetée pour sa barre correspondante. @Gerardofurtado