Solved

Imported SVG shape preview appears slanted/tilted ??


Badge +2

I have a family of SVG images that I attempted to import as a Shape Library. 
5 out of 26 appear tilted in the preview

What gives?

 



 

icon

Best answer by Amelia W 15 May 2024, 20:08

View original

Comments

Badge +2

I checked the SVG files there are no rotate statements in there.
I also checked with a couple of browsers. All look good. 

Userlevel 4
Badge +6

Hi @ferhatsf, thanks for posting in the Lucid Community! To confirm, when you checked additional browsers, were you looking at the SVG file alone, or the preview in the Lucidchart shape library? Would you be willing to post this SVG file here so that I can do some additional testing on my end? 

Badge +2

SVG file itself alione in the browsers is looking fine. 

 Let me see if I can include the SVG here.

 

<svg width="197" height="175" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" overflow="hidden"><defs><image width="512" height="512" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAgAAAAIACAYAAAD0eNT6AAAAAXNSR0IArs4c6QAAAIRlWElmTU0AKgAAAAgABQESAAMAAAABAAEAAAEaAAUAAAABAAAASgEbAAUAAAABAAAAUgEoAAMAAAABAAIAAIdpAAQAAAABAAAAWgAAAAAAAACQAAAAAQAAAJAAAAABAAOgAQADAAAAAQABAACgAgAEAAAAAQAAAgCgAwAEAAAAAQAAAgAAAAAAGcBUEAAAAAlwSFlzAAAWJQAAFiUBSVIk8AAAGSpJREFUeAHt2bGqndUWBeC9d44k6BF8CHsfIT6CYKFY28XCPo2+gYXpLFKJdj5BOK9gn0KwsREsoiji3uaAKRSrZM3FnIzP5l7vxfXP8Y0td3A9HPxBgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAr0Ejr3OcQ0BAv8n8MGXv31653h+7//+u27/2V+X03fffvL6F93ucg8BAv8WuPr3n/ozAgQ6Ctz+j//1vdP9jrf996Znv59v/yMD4L8w/pxAM4FTs3ucQ4AAAQIECGwQMAA2IPsEAQIECBDoJmAAdGvEPQQIECBAYIOAAbAB2ScIECBAgEA3AQOgWyPuIUCAAAECGwQMgA3IPkGAAAECBLoJGADdGnEPAQIECBDYIGAAbED2CQIECBAg0E3AAOjWiHsIECBAgMAGAQNgA7JPECBAgACBbgIGQLdG3EOAAAECBDYI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AZDavNwECBAgEC1gAETXLzwBAgQIpAoYAKnNy02AAAEC0QIGQHT9whMgQIBAqoABkNq83AQIECAQLWAARNcvPAECBAikChgAqc3LTYAAAQLRAgZAdP3CEyBAgECqgAGQ2rzcBAgQIBAtYABE1y88AQIECKQKGACpzctNgAABAtECBkB0/cITIECAQKqAAZDavNwECBAgEC1gAETXLzwBAgQIpAoYAKnNy02AAAEC0QIGQHT9whMgQIBAqoABkNq83AQIECAQLWAARNcvPAECBAikChgAqc3LTYAAAQLRAgZAdP3CEyBAgECqgAGQ2rzcBAgQIBAtYABE1y88AQIECKQKGACpzctNgAABAtECBkB0/cITIECAQKqAAZDavNwECBAgEC1gAETXLzwBAgQIpAoYAKnNy02AAAEC0QIGQHT9whMgQIBAqoABkNq83AQIECAQLWAARNcvPAECBAikChgAqc3LTYAAAQLRAgZAdP3CEyBAgECqgAGQ2rzcBAgQIBAtYABE1y88AQIECKQKGACpzctNgAABAtECBkB0/cITIECAQKqAAZDavNwECBAgEC1gAETXLzwBAgQIpAoYAKnNy02AAAEC0QIGQHT9whMgQIBAqoABkNq83AQIECAQLWAARNcvPAECBAikChgAqc3LTYAAAQLRAgZAdP3CEyBAgECqgAGQ2rzcBAgQIBAtYABE1y88AQIECKQKGACpzctNgAABAtECBkB0/cITIECAQKqAAZDavNwECBAgEC1gAETXLzwBAgQIpAoYAKnNy02AAAEC0QIGQHT9whMgQIBAqoABkNq83AQIECAQLWAARNcvPAECBAikChgAqc3LTYAAAQLRAgZAdP3CEyBAgECqgAGQ2rzcBAgQIBAtYABE1y88AQIECKQKGACpzctNgAABAtECBkB0/cITIECAQKqAAZDavNwECBAgEC1gAETXLzwBAgQIpAoYAKnNy02AAAEC0QIGQHT9whMgQIBAqoABkNq83AQIECAQLWAARNcvPAECBAikChgAqc3LTYAAAQLRAgZAdP3CEyBAgECqgAGQ2rzcBAgQIBAtYABE1y88AQIECKQKGACpzctNgAABAtECBkB0/cITIECAQKqAAZDavNwECBAgEC1gAETXLzwBAgQIpApcpQZ/kfvpT+cX/7b7v37f/cAX9/348/n21vsv/ty/vrrAT79cbg6H8xDT21tn/OHv//U9+ft/vWnVi/4fgCpZ7xIgQIAAgcYCBkDjcpxGgAABAgSqBAyAKlnvEiBAgACBxgIGQONynEaAAAECBKoEDIAqWe8SIECAAIHGAgZA43KcRoAAAQIEqgQMgCpZ7xIgQIAAgcYCBkDjcpxGgAABAgSqBAyAKlnvEiBAgACBxgIGQONynEaAAAECBKoEDIAqWe8SIECAAIHGAgZA43KcRoAAAQIEqgQMgCpZ7xIgQIAAgcYCBkDjcpxGgAABAgSqBAyAKlnvEiBAgACBxgIGQONynEaAAAECBKoEDIAqWe8SIECAAIHGAgZA43KcRoAAAQIEqgQMgCpZ7xIgQIAAgcYCBkDjcpxGgAABAgSqBAyAKlnvEiBAgACBxgIGQONynEaAAAECBKoEDIAqWe8SIECAAIHGAgZA43KcRoAAAQIEqgQMgCpZ7xIgQIAAgcYCBkDjcpxGgAABAgSqBAyAKlnvEiBAgACBxgIGQONynEaAAAECBKoEDIAqWe8SIECAAIHGAgZA43KcRoAAAQIEqgQMgCpZ7xIgQIAAgcYCBkDjcpxGgAABAgSqBAyAKlnvEiBAgACBxgIGQONynEaAAAECBKoEDIAqWe8SIECAAIHGAgZA43KcRoAAAQIEqgQMgCpZ7xIgQIAAgcYCBkDjcpxGgAABAgSqBAyAKlnvEiBAgACBxgIGQONynEaAAAECBKoEDIAqWe8SIECAAIHGAgZA43KcRoAAAQIEqgQMgCpZ7xIgQIAAgcYCBkDjcpxGgAABAgSqBAyAKlnvEiBAgACBxgIGQONynEaAAAECBKoEDIAqWe8SIECAAIHGAgZA43KcRoAAAQIEqgQMgCpZ7xIgQIAAgcYCBkDjcpxGgAABAgSqBAyAKlnvEiBAgACBxgIGQONynEaAAAECBKoEDIAqWe8SIECAAIHGAgZA43KcRoAAAQIEqgQMgCpZ7xIgQIAAgcYCBkDjcpxGgAABAgSqBAyAKlnvEiBAgACBxgIGQONynEaAAAECBKoEDIAqWe8SIECAAIHGAgZA43KcRoAAAQIEqgQMgCpZ7xIgQIAAgcYCBkDjcpxGgAABAgSqBAyAKlnvEiBAgACBxgIGQONynEaAAAECBKoEDIAqWe8SIECAAIHGAgZA43KcRoAAAQIEqgQMgCpZ7xIgQIAAgcYCBkDjcpxGgAABAgSqBAyAKlnvEiBAgACBxgIGQONynEaAAAECBKoEDIAqWe8SIECAAIHGAgZA43KcRoAAAQIEqgQMgCpZ7xIgQIAAgcYCBkDjcpxGgAABAgSqBAyAKlnvEiBAgACBxgIGQONynEaAAAECBKoEDIAqWe8SIECAAIHGAgZA43KcRoAAAQIEqgQMgCpZ7xIgQIAAgcYCBkDjcpxGgAABAgSqBAyAKlnvEiBAgACBxgIGQONynEaAAAECBKoEDIAqWe8SIECAAIHGAgZA43KcRoAAAQIEqgSuqh72brTA48PhchMtIPwQgcvnMw49/jDjTldOEjAAJrU15NYnD68fDznVmeECTx6++Vk4gfjBAv4RQHD5ohMgQIBAroABkNu95AQIECAQLGAABJcvOgECBAjkChgAud1LToAAAQLBAgZAcPmiEyBAgECugAGQ273kBAgQIBAsYAAEly86AQIECOQKGAC53UtOgAABAsECBkBw+aITIECAQK6AAZDbveQECBAgECxgAASXLzoBAgQI5AoYALndS06AAAECwQIGQHD5ohMgQIBAroABkNu95AQIECAQLGAABJcvOgECBAjkChgAud1LToAAAQLBAgZAcPmiEyBAgECugAGQ273kBAgQIBAsYAAEly86AQIECOQKGAC53UtOgAABAsECBkBw+aITIECAQK6AAZDbveQECBAgECxgAASXLzoBAgQI5AoYALndS06AAAECwQIGQHD5ohMgQIBAroABkNu95AQIECAQLGAABJcvOgECBAjkChgAud1LToAAAQLBAgZAcPmiEyBAgECugAGQ273kBAgQIBAsYAAEly86AQIECOQKGAC53UtOgAABAsECBkBw+aITIECAQK6AAZDbveQECBAgECxgAASXLzoBAgQI5AoYALndS06AAAECwQIGQHD5ohMgQIBAroABkNu95AQIECAQLGAABJcvOgECBAjkChgAud1LToAAAQLBAgZAcPmiEyBAgECugAGQ273kBAgQIBAsYAAEly86AQIECOQKGAC53UtOgAABAsECBkBw+aITIECAQK6AAZDbveQECBAgECxgAASXLzoBAgQI5AoYALndS06AAAECwQIGQHD5ohMgQIBAroABkNu95AQIECAQLGAABJcvOgECBAjkChgAud1LToAAAQLBAgZAcPmiEyBAgECugAGQ273kBAgQIBAsYAAEly86AQIECOQKGAC53UtOgAABAsECBkBw+aITIECAQK6AAZDbveQECBAgECxgAASXLzoBAgQI5AoYALndS06AAAECwQIGQHD5ohMgQIBAroABkNu95AQIECAQLHAVnP2f6JfPZxgcf5hxpysJEAgXeHw4XG7CDUbEjx8ATx6++dmIphxJgACBAQJPHl4/HnCmE58L+EcAfgYECBAgQCBQwAAILF1kAgQIECBgAPgNECBAgACBQAEDILB0kQkQIECAgAHgN0CAAAECBAIFDIDA0kUmQIAAAQIGgN8AAQIECBAIFDAAAksXmQABAgQIGAB+AwQIECBAIFDAAAgsXWQCBAgQIGAA+A0QIECAAIFAAQMgsHSRCRAgQICAAeA3QIAAAQIEAgUMgMDSRSZAgAABAgaA3wABAgQIEAgUMAACSxeZAAECBAgYAH4DBAgQIEAgUMAACCxdZAIECBAgYAD4DRAgQIAAgUABAyCwdJEJECBAgIAB4DdAgAABAgQCBQyAwNJFJkCAAAECBoDfAAECBAgQCBQwAAJLF5kAAQIECBgAfgMECBAgQCBQwAAILF1kAgQIECBgAPgNECBAgACBQAEDILB0kQkQIECAgAHgN0CAAAECBAIFDIDA0kUmQIAAAQIGgN8AAQIECBAIFDAAAksXmQABAgQIGAB+AwQIECBAIFDAAAgsXWQCBAgQIGAA+A0QIECAAIFAAQMgsHSRCRAgQICAAeA3QIAAAQIEAgUMgMDSRSZAgAABAgaA3wABAgQIEAgUMAACSxeZAAECBAgYAH4DBAgQIEAgUMAACCxdZAIECBAgYAD4DRAgQIAAgUABAyCwdJEJECBAgIAB4DdAgAABAgQCBQyAwNJFJkCAAAECBoDfAAECBAgQCBQwAAJLF5kAAQIECBgAfgMECBAgQCBQwAAILF1kAgQIECBgAPgNECBAgACBQAEDILB0kQkQIECAgAHgN0CAAAECBAIFDIDA0kUmQIAAAQIGgN8AAQIECBAIFDAAAksXmQABAgQIGAB+AwQIECBAIFDAAAgsXWQCBAgQIGAA+A0QIECAAIFAAQMgsHSRCRAgQICAAeA3QIAAAQIEAgUMgMDSRSZAgAABAlcICBDoL3A6H27Op0v/Q59feHvriEMdSYAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBBoJfA3JX5ZBwUtgj4AAAAASUVORK5CYII=" preserveAspectRatio="none" id="img0"></image><clipPath id="clip1"><rect x="0" y="0" width="468283" height="468283"/></clipPath></defs><g transform="translate(-238 -1035)"><g><g transform="matrix(0.000360892 0 0 0.000360892 240 1039)"><g clip-path="url(#clip1)" transform="matrix(1.13018 0 0 1 -0.0245916 -0.0277211)"><use width="100%" height="100%" xlink:href="#img0" opacity="1" transform="scale(914.615 914.615)"></use></g></g></g></g></svg>

Userlevel 4
Badge +6

Hi @ferhatsf, thanks for following up! To make it easier to share files, I’m going to move your post into a support ticket so we can continue testing to see what might be causing this odd behavior. Please keep an eye on your email inbox for more updates.

In the meantime, it may be worth trying to open Lucidchart in other browsers and incognito mode, to see if the shape preview still appears crooked in each of those environments. I appreciate your help and patience!

Reply