Gnik
Gnik

Reputation: 7426

How to remove unwanted lines in Axis scale of a graph when using D3.js?

I have Logarthmic values in my Graph using D3.js. But here I have more number of lines which I don't need actually. how can I remove it. Please find the attached screenshot for reference..

enter image description here

Upvotes: 0

Views: 391

Answers (1)

minikomi
minikomi

Reputation: 8503

Pass the values you want to see strictly using tickvalues:

var s = d3.scale.log().domain([1, 100]).range([300, 0])

var axis = d3.svg.axis();

axis.scale(s).tickFormat(
    function (d) {
        return s.tickFormat(3,d3.format(",d"))(d)
}).tickValues([1,10,100])

d3.select("body").append("svg")
    .attr("class", "axis")
    .attr("width", 400)
    .attr("height", 300)
    .append("g")
        .attr("transform", "translate(30,30)")
        .call(axis);

Example: http://jsfiddle.net/2hvxc/2/

Upvotes: 2

Related Questions