CODEWITHSUNDEEP
javascriptcsssvgd3.js
jaynp
jaynp

Reputation: 3325

d3 svg to fill screen

I am trying to get the d3 svg visualization on this page to fill the screen.

The HTML in my files is an empty div:

<div id='d3'>
</div>

When the page loads, it is populated with the following:

<svg width="1390" height="475"><g transform="translate(55,55)"> … </g></svg>

How can I tweak this width and height before hand to make it fill the page?

Upvotes: 2

Views: 3099

Answers (2)

Noelia Belen Lopez
Noelia Belen Lopez

Reputation: 91

If you want to fill the screen with you svg maybe you can do this:

  var width = $(window).width();
  var height = $(window).height(); 

  var svgContainer = d3.select("#d3").append("svg")                                  
    .attr("width", width)
    .attr("height", height);

Upvotes: 0

Dale Botha
Dale Botha

Reputation: 135

I'm very new to D3! So can't give more info..but I found this JQuery Answer which you could use to first get at the width then just plug it in.

https://stackoverflow.com/a/1038765/709872

Apparently without JQuery to help it's more complicated! Hope this points you in the right direction.

Upvotes: 0

Related Questions