Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

putting my svg code inside iconset and initializing breaks the svg #28

Open
ssuess opened this issue Sep 2, 2016 · 1 comment
Open

Comments

@ssuess
Copy link

ssuess commented Sep 2, 2016

My svg looks just fine in a web browser when added normally. But when I add it to an icon set to make it work with SVG-Morpheus, it is no longer correct. I have an X form (made of 4 rectangles).

Here is the svg code that works:

<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" width="162.984px" height="163.366px" viewBox="0 0 162.984 163.366" enable-background="new 0 0 162.984 163.366" xml:space="preserve"> <rect x="71.125" y="34.736" transform="matrix(0.7071 -0.7071 0.7071 0.7071 6.6372 98.2234)" stroke="#000000" stroke-miterlimit="10" width="101.52" height="12.728"/> <rect x="-9.66" y="115.903" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -74.4179 64.8729)" stroke="#000000" stroke-miterlimit="10" width="101.52" height="12.728"/> <rect x="-9.66" y="34.736" transform="matrix(-0.7071 -0.7071 0.7071 -0.7071 41.1004 99.2236)" stroke="#000000" stroke-miterlimit="10" width="101.52" height="12.727"/> <rect x="71.125" y="115.903" transform="matrix(-0.7071 -0.7071 0.7071 -0.7071 121.6148 294.9077)" stroke="#000000" stroke-miterlimit="10" width="101.52" height="12.727"/> </svg>

screen shot 2016-09-02 at 4 27 17 pm

but after adding the following to the iconset it shows as two horizontal lines when morphing or being morphed to:

<g id="crossicon"> <rect x="71.125" y="34.736" transform="matrix(0.7071 -0.7071 0.7071 0.7071 6.6372 98.2234)" stroke="#000000" stroke-miterlimit="10" width="101.52" height="12.728"/> <rect x="-9.66" y="115.903" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -74.4179 64.8729)" stroke="#000000" stroke-miterlimit="10" width="101.52" height="12.728"/> <rect x="-9.66" y="34.736" transform="matrix(-0.7071 -0.7071 0.7071 -0.7071 41.1004 99.2236)" stroke="#000000" stroke-miterlimit="10" width="101.52" height="12.727"/> <rect x="71.125" y="115.903" transform="matrix(-0.7071 -0.7071 0.7071 -0.7071 121.6148 294.9077)" stroke="#000000" stroke-miterlimit="10" width="101.52" height="12.727"/> </g>

screen shot 2016-09-02 at 4 26 46 pm

@ssuess ssuess changed the title putting my svg code inside <g id="somename"> breaks the svg putting my svg code inside iconset and initializing breaks the svg Sep 2, 2016
@ssuess
Copy link
Author

ssuess commented Sep 2, 2016

I am guessing this code does not work with rect. I converted to path and now it is working.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant