Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Fit to viewer does not fit all image inside

See original GitHub issue

Hi: I’ve met this case when the viewer is square and a portait svg such as 500px * 800px, I invoke fitToViewer but only got its width fitted. Could I fit entire svg inside the viewer? Thanks.

Issue Analytics

  • State:closed
  • Created 7 years ago
  • Reactions:2
  • Comments:7 (7 by maintainers)

github_iconTop GitHub Comments

otakecommented, Jun 8, 2017

I moved the <rect> x property over to 500 because my situation was more about the elements inside the SVG being cut off and not the SVG tag itself. In other cases your default fitToViewer() seems to work well.

otakecommented, Jun 8, 2017

I also needed this feature. I wrote some “hacky” code using this.Viewer.fitSelection(). Its not pretty but it gets the job done. Run this after the component is mounted (you need a reference to the Viewer).

// Find the inner container that wraps all the diagram components
let innerContainer = this.Viewer.ViewerDOM.querySelector('g > g');
let bbox = innerContainer.getBBox();

// only resize if it runs outside the main viewport
if (bbox.height > this.height || bbox.width > this.width || bbox.x < 0 || bbox.y < 0) {
    // give it some padding on the left and top
    const padding = 20;
    const topPadding = (this.height / 2) - (bbox.height / 2);
    let pointX = bbox.x - padding;
    let pointY = bbox.y - topPadding;
    let width = bbox.width + (padding * 2);
    let height = bbox.height + topPadding + padding;

    this.Viewer.fitSelection(pointX, pointY, width, height);
} else {
Read more comments on GitHub >

github_iconTop Results From Across the Web

react-native - Fit Image in containing View, not the whole ...
The problem is that resizeMode='contain' seems to fit to the width of the screen or at least some higher level container, I need...
Read more >
problem re-sizing a photo to fit in the viewer panel
can anybody help me to re-size a photo to fit, the videos are fine, but not the photos. when I drag and drop...
Read more >
gpicview doesn't fit image to window size - Launchpad Bugs
gpicview has a button to 'fit image to window size'. It does nothing. Big windows, small windows, images always displayed original size.
Read more >
can photo viewer fit to screen? - Microsoft Community
No photo viewer Microsoft has ever built will show an image higher than the images actual true size. They all will "fit down"...
Read more >
image viewer resize and fit to window size - Google Groups
When i resize the window canvas size has to be change and fit to current window and the look should be same in...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Post

No results found

github_iconTop Related Hashnode Post

No results found