J'essaie d'utiliser d3.cale.category.20b () Pour générer une échelle de couleur, le problème est le numéro de la liste que je demande, il renvoie toujours le premier élément de la liste.
console.log(d3.scale.category20b()(X);
3 Réponses :
Quelle version de D3 utilisez-vous? J'ai écrit un jsfiddle (D3 3.0.4), les couleurs sont affichées normalement:
var color = d3.scale.category20b();
var svg = d3.select('#chart').append('svg')
.attr('width', 200)
.attr('height', 100);
svg.append('rect')
.attr('width', 100)
.attr('height', 100)
.attr('fill', color(0));
svg.append('rect')
.attr('x', 100)
.attr('width', 100)
.attr('height', 100)
.attr('fill', color(1));
Ton violon est bien meilleur :)
Au début, je pensais que cela aurait été un bug avec d3.js ainsi créé ce jsfiddle qui fonctionne bien. Il avait été soulevé par d'autres personnes sur la version de D3 que vous utilisez. Cela semble peu probable d'être la cause de votre problème comme le code en question n'a guère été touché. Si le code n'a pas été touché grand chose et que d'autres n'ont pas de problème, il soulève la question du navigateur de manière compatible. I Envoyé mon jsfiddle to BrowserShots et n'a pas vu de sortie de navigateur un seul bloc de couleur au lieu des bandes de couleurs attendues attendues. Après toutes ces coutures, il n'y a pas assez d'informations pour répondre correctement à votre problème. Je suggère que vous ayez un coup d'œil à voir si X change vraiment en faisant une petite modification du code console.log ({'couleur': couleur (x), 'x': x}) . 
Ceci peut se produire car les échelles catégoriques dans D3 annexent au domaine car de nouvelles données sont entrées. Si chaque entrée () crée une nouvelle échelle catégorique, le domaine de l'échelle catégorique reste identique.
À titre d'exemple, s'il vous plaît Considérez cette jfiddle: http://jsfiddle.net/seldomawake/mv55j/1/
Ici, nous constatons que comme les données entre, nous appendons une échelle catégorique dans l'espace de noms global, ColorsCale CODE> (code spécifique ci-dessous). P> function redraw(theData) {
var localColorScale = d3.scale.category20c(); //< NOT USED HERE
var svg = d3.select("svg");
var circles = svg.selectAll("circle")
.data(theData).enter().append("circle")
var circleAttributes = circles.attr("cx", getRandomInt(50, 450))
.attr("cy", getRandomInt(50, 450))
.attr("r", function (d) { return d.value; })
.style("fill", function () { return $colorScale(getRandomInt(0, 19)); });
}
Hmm, ressemble à un bug pour moi. Vous devez déposer un problème sur le site Web D3.
Cela pourrait sembler vraiment stupide, mais qu'est-ce que X dans votre exemple? IE, si vous
console.log (x) Qu'est-ce qu'il retourne? Par exemple, si vous deviez initialiser x quelque part, dans l'espoir de mettre à jour la valeur ultérieure de sa valeur et de l'utiliser dans votre fonction là-bas, quelque chose pourrait se tromper avec la mise à jour de la valeur ... d'où il affiche systématiquement la même chose.@Joum j'ai utilisé X pour représenter des chiffres compris entre 1 et 20. On aurait dû dire.