Search code examples
javascriptdata-visualizationprotovis

Logarithmic bar chart using Protovis

var vis = new pv.Panel().canvas('grphLangSpeakers').height(langCount*(barWidth+barGap)).width(canvasWidth)
    .add(pv.Bar)
    .data(popCountArray)
    .bottom(0).width(function(d){ return d})
    .height(barWidth)
    .top(function() {return this.index * (barGap+barWidth)});

vis.render();

I'm using above code to generate a Bar Chart using Protovis. How to change this chart to Logarithmic Scale?

Solution

  • You should use pv.Scale.log as your function :

    http://vis.stanford.edu/protovis/jsdoc/symbols/pv.Scale.log.html

    var yScale = pv.Scale.log(0,popCountArray.length).range(0,height);

    ....

    .top(function() yScale (this.index) );

    vis.render();

    Hope this helps