svg - D3.js canvas incorrect display in Chrome -

i have created d3 canvas below.

var svg = d3.select("body")             .append("svg")             .attr("width", 500)             .attr("height", 1000)             .append("g").attr("transform", "translate(150,150)");   

and further added elements create plot.

i facing issue while rendering in google chrome browser.the graph displayed towards left expected , hence cut panel border.

the same code rendered correctly in mozilla firefox. there difference in way canvas coordinates calculated in both browser? or transform , translate misbehaving in chrome?

please suggest solution.