Resizing choropleth datamaps into container in datamaps

Question

I am trying to create a dashbord and I have used choropleth datamap which I got from here.

My problem is that when I try to resize the datamap graph to fit into my container,it is not getting scaled properly.

So how to scale the map,to a container of

width=100% and height = 450px.

hope you can help me out here

Answer 1

Use d3 to get the size of the container:

var containerw = d3.select(".containerclass").style("width');
var containerh = d3.select(".containerclass").style("height');

Now use those values on your svg:

var map = d3.select('.containerclass').append("svg").attr('class','map');

map.style('width',parseInt(containerw) + 'px').style('height',parseInt(containerh) + 'px');