Ajout de l'axe des x et de l'axe des y à l'histogramme dans gRaphael?

Question

Je souhaite créer un diagramme en utilisant la bibliothèque javascript gRaphael. GRaphael prend-il en charge les axes étiquetés?

Answer 1

Je vois certains axes bien que sans étiquettes dans ce example. Je pense que vous pouvez ajouter du texte à une position désirée en utilisant la fonction Raphael text().

var t = paper.text(50, 50, "X Label"); 

Answer 2

Vous pouvez travailler avec la classe de l'axe et pour cela:

  var chart = r.g.barchart(50,15,gW,167, [ this.chart.Value ], { }).hover(fin, fout); 
      var aX = chart.bars[0][0].x; 
      var aW = chart.bars[0][chart.bars[0].length -1].x - aX; 
      var axis = r.g.axis(aX,180,aW ,null,null,this.chart.Labels.length - 1 ,2, this.chart.Labels , "|", 0); 
      axis.text.attr({font:"12px Arial", "font-weight": "regular", "fill": "#FFFFFF"}); 

Answer 3

[Je sais que cette question est vieux, mais voici ma solution -]

je n'ai pas réussi à utiliser les rgaxis, mais je l'aX -

var x, y = 250; 
    for (i = 0; i < MAX_ITEMS; i++) { 
    x = chart.bars[0][i].x; 
    r.text(x, y, "[" + i + "]").attr(txtattr); 
    } 

Answer 4

et pour l'axe Y, j'ai ajouté une autre barre, les étapes que je veux marquer . Je suppose que vous pouvez définir sa couleur à "transparent".

var myArrY = new Array();     // original values      
// TODO: fill its values as before . . . 

var myArrY_steps = new Array(0, 10, 20, 30); // the steps I want to mark 

var myData = new Array();      
myData[0] = myArrY; 
myData[1] = myArrY_steps; 
var chart = r.barchart(10, 10, 600, 300, myData, 0, {type: "sharp"}); 
. . . 
var x = 10; 
var y; 
for (i = 0; i < myArrY_steps.length; i++) { 
    // Note: In this loop I use chart.bars[1], the steps array! 
    y = chart.bars[1][i].y;     // calculated by gRaphael ! 
    r.text(x, y, chart.bars[1][i].value).attr(txtAttr); 
}