Ali Nouman
Ali Nouman

Reputation: 3414

manipulating nvd3 chart attributes

I am having trouble manipulating nvd3 generated attributes. I want to have text little left. the svg text x has -3 right now. I am able to access that through d3js code but setting attribute to another value isn't working. It works just for a second and then they come back to their original location.

My code:

d3.select('#chart svg').selectAll('.nv-y .tick text')
                .each(function(d,i){
                  console.log(d3.select(this).attr('x',-100));
    });

here is fiddle A picture of what i am looking for. enter image description here

Upvotes: 0

Views: 494

Answers (1)

Lars Kotthoff
Lars Kotthoff

Reputation: 109232

It works if you chain this immediately after the call to chart:

d3.select('#chart svg')
  .datum(sinandcos())
  .transition().duration(500)
  .call(chart)
  .selectAll('.nv-y text')
  .attr('x',-15)
  ;

Note that I've changed the selector as well to also select the labels at the extreme points of the axis. Complete demo here.

Upvotes: 1

Related Questions