I want to use charts and graphs for visualizing data.Need some recommendation as D3js that I am using is not responsive

Question

Are there any open source frameworks to visualize data in mostly Bullet charts/Gantt charts/ Bar charts and line charts. I am using d3.js right now but it is not responsive. Is there any other frameworks which can give me all above charts and also need to be responsive or is there any way to make D3 responsive.

Answer 1

I know 2 ways to make D3 responsive:

1) check the window resize event. Basically, when the window resizes, you delete your charts and you redraw them based on the new dimensions.

d3.select(window).on("resize",resize);

        function resize() {
            /* resetting the entire visualisation, the svg's and other added elements */
            d3.selectAll("svg").remove();
            d3.selectAll(".graphline").remove();
            d3.select("#namerow").remove();

            *function to redraw everthing*
        }

In your draw function, you can capture the width of the window as following:

var chartWidth = parseInt(divParentContainer.style("width"),10);
var chartHeight = chartWidth * 0.8; // 0.8 can be seen as width-height ratio

2) check the answer on this page . In my personal opinion, that way is the easiest one.