我想使用图表来可视化数据。由于我使用的D3js没有响应，因此需要一些建议

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.