Добавление отступов в графики gRaphael? - PullRequest
Новая
       27

Добавление отступов в графики gRaphael?

0 голосов
/ 01 февраля 2012

Несмотря на то, что в Интернете очень мало документации, я смог разобраться, как создать показанный ниже график, используя Raphael.js и аддон gRaphael .Я довольно смущен тем, как я могу стилизовать свои теги, которые появляются при наведении на каждую точку данных.Как мне добавить отступы вокруг текста?

Вот как это выглядит сейчас:

enter image description here

Код: 

var r = Raphael("graphcontainer");
var linec = r.linechart(10,10,300,220,[1,2,3,4,5],[10,20,15,35,30], {colors:["#009933"], symbol:"circle", smooth: false}); 

linec.hoverColumn(function () {
    this.tags = r.set();
    for (var i = 0, ii = this.y.length; i < ii; i++) {          
        this.tags.push(r.tag(this.x + 10, this.y[i], this.values[i]+"tkr", 0, 0).insertBefore(this).attr([{ fill: "#fff" }, { fill: this.symbols[i].attr("fill") }]));
    }
}, function () {
    this.tags && this.tags.remove();
});

1 Ответ

0 голосов
/ 12 апреля 2012

У меня была похожая проблема с осью.

Возможно, вам понадобится получить объект Raphael и превратить его в объект jQuery, а затем применить стиль с помощью jQuery.

Примерно так: 

for (var i = 0, ii = this.y.length; i < ii; i++) {          
   this.tags.push(r.tag(this.x + 10, this.y[i], this.values[i]+"tkr", 0, 0).insertBefore(this).attr([{ fill: "#fff" }, { fill: this.symbols[i].attr("fill") }]));
   var $jQueryObject = $(this.tags.node);
   $jQueryObject.css('font-size', '30px')
}

Обратите внимание, что не все атрибуты CSS работают с этим решением. Я не уверен, почему, если у кого-то есть какие-либо комментарии по этому поводу, будет высоко ценится.

Некоторые корректировки могут потребоваться. Дайте нам знать ваш опыт;)

Надеюсь, это поможет!

...