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

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

enter image description here

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

Любые предложения?

источник

2013-11-11 Gina

Что вы подразумеваете под ответ? Не могли бы вы создать jsfiddle или опубликовать код, с которым работаете? – THK

Я думаю, что она означает создание шкалы SVG при изменении размера контейнера. – Henrik

Вы видели [этот вопрос] (http://stackoverflow.com/questions/9400615/whats-the-best-way-to-make-a-d3-js-visualisation-layout-responsive)? –

Таким образом, решение этой проблемы было это 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");

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

источник

2013-11-12 14:54:48 Gina

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

ответ

Смежные вопросы