Question

我试图制作一张响应式图表。

这是我的代码：

var width = (parseInt(d3.select('#'+chartID).style('width'), 10));

...

d3.select(window).on('resize', function() {
    // Recalculate
    width = parseInt(d3.select('#'+chartID).style('width'), 10);
    d3.select(svg.node().parentNode).style('width', (width) + 'px');
});

它没有为SVG设置样式属性。我错过了什么？

Answer 1

很抱歉＆＃34;回答＆＃34;，我没有评论点。我读完之后可以删除它：

检查你的＆＃34; svg＆＃34;是一组（g）元素。也许是这样的：

var svg = d3.select('#chart').append('svg')
    .style('width', (width + margin.left + margin.right) + 'px')
    .append('g')
    .attr('transform', 'translate(' + [margin.left, margin.top] + ')');

在这种情况下，您需要parentNode来获取实际的svg，即您组的父级。

但如果你的＆＃34; svg＆＃34;不是g，删除parentNode。

d3图表调整大小没有按预期工作

1 个答案: