Как сделать потоковый граф отзывчивым (d3.js)?

Я делаю потоковый график, используя d3.js для своей компании, и мне интересно, как сделать его отзывчивым. Мой код мало чем отличается от этого примера: http://bl.ocks.org/mbostock/4060954

Я играл с настройками viewBox="0 0 height width" а также preserveAspectRatio = "xMinYMid meet" но безрезультатно.

Какие-либо предложения?

1 ответ

Решение

Итак, решение для этой проблемы было это jsfiddle:

http://jsfiddle.net/shawnbot/BJLe6/ частности, этот код:

var chart = $("#chart"),
aspect = chart.width() / chart.height(),
container = chart.parent();

$(window).on("resize", function() {
var targetWidth = container.width();
chart.attr("width", targetWidth);
chart.attr("height", Math.round(targetWidth / aspect));
}).trigger("resize");

Спасибо всем, кто помог!

Другие вопросы по тегам