Remove SVG Whitespace and make square
Removes the whitespace around an svg
by jessuni
HTML
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 23.0.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 560 288" style="enable-background:new 0 0 560 288;" xml:space="preserve">
<!--<style type="text/css">
.st0{clip-path:url(#SVGID_2_);fill:none;stroke:#FFFFFF;stroke-width:11.728;}
.st1{fill:#FFFFFF;}
.st2{clip-path:url(#SVGID_4_);fill:#FFFFFF;}
</style>-->
<g>
<defs>
<rect id="SVGID_1_" x="182" y="88.71" width="86.57" height="97.29"/>
</defs>
<clipPath id="SVGID_2_">
<use xlink:href="#SVGID_1_" style="overflow:visible;"/>
</clipPath>
<path class="st0" d="M225.28,169.41c20.67,0,37.42-16.75,37.42-37.42c0-20.67-16.75-37.42-37.42-37.42s-37.42,16.75-37.42,37.42
C187.86,152.65,204.62,169.41,225.28,169.41z"/>
</g>
<polygon class="st1" points="212.67,171.49 225.29,186 237.91,171.49 "/>
<g>
<defs>
<rect id="SVGID_3_" x="182" y="88.71" width="86.57" height="97.29"/>
</defs>
<clipPath id="SVGID_4_">
<use xlink:href="#SVGID_3_" style="overflow:visible;"/>
</clipPath>
<path class="st2" d="M221.22,144.22v-13.39c-0.29-0.16-0.44-0.29-0.6-0.33c-1.35-0.32-3.76-0.41-3.88-0.98
c-0.47-2.26-0.34-4.68-0.15-7.02c0.03-0.39,1.45-0.92,2.24-0.95c3.28-0.11,6.57,0.01,9.86-0.06c1.98-0.04,2.74,0.75,2.71,2.77
c-0.09,5.93,0.03,11.87-0.07,17.8c-0.03,1.9,0.58,2.76,2.5,2.48c2.46-0.35,3.13,0.78,3.06,3.13c-0.18,5.94,0.59,5.22-5.32,5.25
c-4.29,0.02-8.58-0.06-12.87,0.03c-1.76,0.04-2.59-0.55-2.4-2.35c0.02-0.18,0-0.37,0-0.55
C216.23,145.03,216.23,145.03,221.22,144.22"/>
<path class="st2" d="M226.22,115.57c-1,0-2.04,0.16-2.99-0.06c-0.66-0.15-1.66-0.78-1.71-1.29c-0.21-1.89-0.21-3.82-0.02-5.71
c0.05-0.5,1.03-1.12,1.68-1.28c0.95-0.22,1.99-0.08,2.99-0.07c6,0.05,5.02-0.61,5.26,5.26c0.11,2.6-0.83,3.51-3.3,3.17
c-0.62-0.09-1.27-0.01-1.91-0.01V115.57z"/>
</g>
</svg>
JavaScript
var svg = document.getElementsByTagName("svg")[0];
var bbox = svg.getBBox();
console.log('bbox', bbox)
var viewBox;
if(bbox.width > bbox.height){
viewBox = [bbox.x, bbox.y - (bbox.width - bbox.height)/2, bbox.width, bbox.width].join(" ")
} else if (bbox.width < bbox.height){
viewBox = [bbox.x - (bbox.height - bbox.width)/2, bbox.y, bbox.height, bbox.height].join(" ")
} else {
viewBox - [bbox.x, bbox.y, bbox.width, bbox.height].join(" ");
}
svg.setAttribute("viewBox", viewBox);
console.log("Copy to clipboard: Ctrl+C, Enter", svg.outerHTML);