js-sequence-diagrams icon indicating copy to clipboard operation
js-sequence-diagrams copied to clipboard

Scale SVG to fit in container?

Open markselby opened this issue 12 years ago • 3 comments

It seems to create a fixed width svg. If there isn't, how about adding an option to make it scale to the width of the container?

markselby avatar Nov 08 '13 08:11 markselby

I'm having the same issue, the images it creates are too big and don't respect the width of the container in css

mimoo avatar Jul 23 '21 09:07 mimoo

I managed to fix this issue like this:

$('svg').removeAttr('viewBox');

$('svg').each(function () { 
    let svg = $(this)[0];
    let bbox = svg.getBBox();
    svg.setAttribute("viewBox", bbox.x + ' ' + bbox.y + ' ' + bbox.width + ' ' + bbox.height);
});

$('svg').css('width', '500px');
$('svg').css('height', 'auto');

mimoo avatar Jul 23 '21 10:07 mimoo

of course this doesn't work if you run this before the SVGs have finished loading...

mimoo avatar Jul 23 '21 10:07 mimoo