Mobile app version of vmapp.org
Login or Join
Fox8063795

: Break SVG file into multiple files I'm a programmer with almost zero knowledge of graphics and svg structure. But I would like to know if it is possible to break this kind of svg file into

@Fox8063795

Posted in: #Javascript #Svg

I'm a programmer with almost zero knowledge of graphics and svg structure. But I would like to know if it is possible to break this kind of svg file into multiple ones. Or at least access only one image at a time. (I'm using javascript and FabricJS if it matters in this case).

I did open the svg file and saw there are multiple path's and each one correspond to one sillhoute. But they have no identification as long as I see.

The question is: Is there simpler/automatic way to separate this file into multiple ones, or I would have to write a script to break each path into a separate file?

10.01% popularity Vote Up Vote Down


Login to follow query

More posts by @Fox8063795

1 Comments

Sorted by latest first Latest Oldest Best

 

@Caterina889

SVG is merely a collection of XML data. Like any XML data, it can be broken apart and separated.

The ease of separating things depends a great deal upon original construction and available tools.

The XML is basically a set of declared path objects:

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<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="643.399px" height="478.702px" viewBox="0 0 643.399 478.702" enable-background="new 0 0 643.399 478.702"
xml:space="preserve">

<path fill-rule="evenodd" clip-rule="evenodd" d="M122.758,217.206c0.74,0.16,1.479,0.314,2.218,0.474
c0.827-0.546,1.652-1.09,2.481-1.635c0.033-0.053,0.071-0.106,0.103-0.158c-0.277-0.303-0.703-0.461-0.894-0.845
c-0.255-0.444,0.246-1.409-0.583-1.688c-0.095,0.214-0.204,0.328-0.422,0.421c-0.173,0.019-0.352,0.035-0.528,0.053
c-0.258-0.326-0.491-0.559-0.314-1.056c-0.267-0.178-0.53-0.352-0.794-0.527c-0.003-0.492,0.082-0.633,0.264-0.896
c-0.345-0.098-0.513-0.101-0.685-0.37c0-0.017,0-0.035,0-0.053c0.158,0.053,0.316,0.105,0.473,0.156
c0.309-0.145,0.342-0.331,0.53-0.577c-0.088-0.282-0.177-0.564-0.265-0.848c-0.251,0.067-0.39,0.191-0.634,0.108
c-0.156-0.102-0.087-0.01-0.156-0.213c-0.055-0.282,0.4-0.814,0.581-1.106c-0.314-0.286-0.675-0.289-0.793-0.792
c0-0.089,0-0.177,0-0.264c0.234-0.113,0.468-0.102,0.737,0c0.125-0.211,0.249-0.423,0.371-0.634
c-0.14-0.246-0.281-0.493-0.423-0.739c0.03-0.47,0.277-0.664,0.635-0.79c0.235-0.068,0.974,0.277,1.318,0.421
c0.125-0.176,0.247-0.352,0.371-0.528c0.653,0.049,0.663,0.38,1.319,0.475c0.247-0.245,0.492-0.49,0.739-0.737
c0.071,0,0.142,0,0.212,0c0.052,0.036,0.104,0.068,0.156,0.104c0.019,0.052,0.035,0.106,0.054,0.158
c-0.577-0.007-0.69,0.141-0.951,0.423c-0.017,0.052-0.035,0.105-0.055,0.158c0.161,0.105,0.32,0.212,0.478,0.316
c0.191-0.264,0.385-0.526,0.58-0.79c0.246,0.034,0.493,0.069,0.739,0.104c0.285,0.147,0.557,0.662,0.633,1.005
c0.546-0.723,1.091-1.442,1.637-2.166c-0.158-0.313-0.441-0.665-0.212-1.055c0.209-0.313,0.817-0.127,1.057,0
c0.035-0.068,0.071-0.141,0.106-0.212c0.108-0.378-0.188-0.853-0.264-1.212c-0.303-1.403-0.293-3.493,0-4.329
c1.782-0.485,4.136,2.588,5.33,3.377c0.615-0.543,1.233-1.09,1.847-1.636c1.163-0.934,2.078-2.28,3.482-2.954
c1.355,0.038,4.566,2.284,5.7,2.954c1.53,0.904,2.999,1.995,4.223,3.222c0.511,0.596,1.022,1.193,1.53,1.793
c0.422,0.229,0.843,0.457,1.266,0.685c0.229,0.317,0.459,0.633,0.686,0.951c1.04,1.005,3.245,1.764,4.012,2.957
c0.263,0.897,0.529,1.794,0.792,2.688c0.527,1.128,1.055,2.251,1.583,3.379c0.124,1.177,0.246,2.357,0.368,3.536
c0.575,3.255,0.644,7.449,1.796,10.134c0.377,0.221,0.932,0.062,1.423,0.262c0.178,0.141,0.354,0.281,0.528,0.424
c0.018,0.053,0.035,0.107,0.053,0.158c-0.316,0.51-0.635,1.02-0.948,1.528c0.088,0.614,1.269,1.168,1.688,1.69
c0.59,0.742,1.546,1.723,1.899,2.587c0.146,0.357-0.132,0.609,0,0.949c0.094,0.241,0.495,0.355,0.634,0.635
c0.219,0.598-0.336,4.275-0.686,4.484c-0.177-0.087-0.353-0.175-0.527-0.264c-0.409,0.929-0.43,1.196-1.531,1.425
c-0.625,4.173-1.804,7.799-2.746,11.823c-0.334,1.424-0.206,3.773-1.267,4.487c-1.021,0.684-2.509,0.694-3.903,0.999
c-6.173,1.36-13.677-2.308-18.05-4.328c-0.632,1.831-1.265,3.659-1.899,5.49c-1.818,4.687-3.376,9.218-5.226,13.825
c-0.598,1.234-1.196,2.465-1.793,3.696c-0.178,0.266-0.354,0.528-0.527,0.792c-0.139,0.557,0.282,1.26,0.159,1.794
c-0.296,1.249-1.271,2.207-1.691,3.325c-0.986,0.281-2.162,0.248-3.166,0c-0.399,1.457-1.558,3.019-2.852,3.591
c-0.052,0.067-0.104,0.14-0.156,0.208c1.421,0.003,2.577,0.626,3.166,1.478c0.248,0.477,0.493,0.951,0.74,1.425
c0.301,0.324,0.895,0.261,1.161,0.634c0.247,0.562,0.491,1.126,0.737,1.688c0.034,0.044,1.32,1.281,1.371,1.319
c0.668,0.481,1.439,0.754,1.904,1.427c0.21,0.438,0.421,0.878,0.634,1.318c0.666,0.845,1.334,1.688,2.003,2.533
c3.621,4.518,6.819,9.417,10.185,14.195c1.259,1.785,4.088,5.352,4.486,7.651c0.302,1.732-0.47,3.229-0.845,4.436
c-0.457,1.653-0.914,3.306-1.371,4.963c-1.445,4.874-2.547,9.927-4.012,14.566c-0.403,1.334-0.809,2.671-1.213,4.008
c-0.703,0.932-1.408,1.865-2.111,2.796c-0.387,0.722-0.773,1.444-1.16,2.167c-0.247,0.418-0.493,0.844-0.739,1.264
c0.104,0.405,0.211,0.812,0.317,1.214c-0.317,0.653-0.633,1.302-0.95,1.955c0,0.614,0,1.23,0,1.848
c-0.62,3.059-1.629,7.848-0.318,10.871c0.057,0.264-0.146,0.401-0.209,0.633c0.017,0.649,0.034,1.3,0.051,1.954
c0.335-0.107,0.669-0.213,1.001-0.316c0.09,0.753,0.178,1.51,0.265,2.266c0.278,1.549,0.403,3.165,1.162,4.275
c0.298,0.214,0.599,0.423,0.896,0.634c0.354,0.422,0.704,0.846,1.056,1.267c1.985,1.425,3.461,1.865,4.803,4.012
c-0.421,0.737-0.844,1.478-1.268,2.216c-0.973,0.801-6.536,1.514-8.338,0.949c-1.981-0.615-5.729-3.172-6.913-4.643
c-0.949-1.179-1.901-2.358-2.852-3.537c-0.632-0.088-1.265-0.175-1.898-0.264c-2.603-0.537-5.226-0.604-8.497-0.58
c-0.072,0.211-0.141,0.424-0.212,0.633c-0.915,0.123-1.83,0.246-2.745,0.369c-2.889,0.489-4.605,0.072-5.225-2.109
c-0.016-0.474-0.034-0.951-0.052-1.425c-0.264-0.827-1.153-1.543-1.426-2.483c-0.367-1.262,0.437-2.097,0.422-3.06
c-0.015-1.049-1.285-2.442-1.952-2.956c0.033-1.257,0.7-1.45,0.896-2.426c0.325-1.6-0.534-2.624-0.739-3.747
c-0.093-0.515,0.111-0.724-0.051-1.162c0.635-0.837,2.201-5.308,1.74-6.387c-0.334-0.367-0.667-0.737-1.001-1.109
c-0.875-1.379-2.409-4.483-2.007-6.965c0.575-3.517,0.169-7.727,0.739-11.293c0.055-1.214,0.107-2.429,0.16-3.643
c0.189-0.996,1.338-3.224,1.107-4.168c-0.298-1.224-0.992-2.412-1.268-3.852c-0.201-1.063,0.072-2.362,0.373-3.062
c0.128-0.31,0.599-0.652,0.525-1.109c-0.282-0.704-0.562-1.408-0.843-2.109c-0.177-0.809-0.354-1.618-0.527-2.429
c-0.267-2.514-0.528-5.031-0.794-7.546c-0.035-1.075-0.069-2.147-0.105-3.22c-0.125-1.04-0.247-2.078-0.369-3.114
c-0.104-0.466-0.595-0.942-0.422-1.584c0.141-0.316,0.284-0.631,0.422-0.948c-0.262-0.124-0.527-0.25-0.789-0.37
c-0.655-0.932-0.799-2.438-1.374-3.377c-1.39-2.273-2.716-4.501-3.483-7.496c-0.457-1.781-0.011-3.941,0.263-5.594
c0.071-0.948,0.141-1.899,0.212-2.85c0-0.527,0-1.058,0-1.584c0.382-1.555,0.537-3.406,1.001-4.906
c0.438-0.968,0.879-1.937,1.321-2.902c0.193-0.196,0.386-0.388,0.581-0.581c0.069-0.915,0.138-1.83,0.211-2.746
c0.175-0.669,0.351-1.336,0.527-2.008c-1.046,1.071-1.194,3.147-2.902,3.54c-0.803-3.127,2.154-6.727,3.375-8.708
c-0.117-1.333-0.843-2.21-1.16-3.272c-0.363-1.222-0.353-2.345-0.581-3.694c-0.053-0.546-0.106-1.089-0.158-1.635
c0.368-1.215,0.738-2.428,1.107-3.644c0.348-1.175,0.364-2.39,0.581-3.747c0.371-2.306-0.885-3.557-1.268-5.173
c-0.315-1.336,1.288-3.975,1.796-4.801c1.628-2.648,3.983-4.987,5.91-7.39c0.582-0.668,1.163-1.336,1.743-2.002
c1.576-1.192,4.908-2.122,5.752-3.855c0.158-1.426,0.316-2.85,0.474-4.275C119.408,216.607,121.167,216.832,122.758,217.206z
M131.89,203.379c-0.03,0.203-0.042,0.251,0.052,0.422c0,0.033,0,0.068,0,0.105c0.036,0.018,0.07,0.032,0.104,0.05
c0.159-0.227,0.317-0.456,0.477-0.684c-0.037-0.018-0.072-0.036-0.107-0.053C132.241,203.273,132.066,203.324,131.89,203.379z
M126.137,205.752c0.14,0.071,0.281,0.142,0.422,0.211c0.124-0.088,0.246-0.177,0.37-0.264c0-0.018,0-0.034,0-0.053
c-0.052-0.089-0.106-0.176-0.16-0.264C126.335,205.382,126.277,205.475,126.137,205.752z M128.513,205.912c0,0.021,0,0.035,0,0.052
c0.784-0.214,1.104,0.066,1.53,0.475c-0.059-0.544-0.277-0.68-0.528-1.004C128.976,205.433,128.733,205.607,128.513,205.912z
M124.552,205.593c-0.034,0.072-0.071,0.144-0.104,0.212c-0.125,0.285-0.007,0.658,0.053,0.898c0.173-0.126,0.21-0.207,0.475-0.266
c-0.096-0.363-0.081-0.415,0.104-0.686c-0.035-0.053-0.07-0.105-0.104-0.159C124.835,205.593,124.694,205.593,124.552,205.593z
M123.762,207.653c-0.017,0.034-0.034,0.069-0.054,0.105c0.066,0.387,0.249,0.425,0.581,0.527c-0.087-0.209-0.175-0.422-0.264-0.633
C123.938,207.653,123.85,207.653,123.762,207.653z M123.708,209.448c0.242,0.023,0.214,0.057,0.369-0.052
c-0.035-0.037-0.068-0.072-0.103-0.108C123.887,209.342,123.797,209.396,123.708,209.448z M124.289,211.611c0,0.177,0,0.353,0,0.525
c0.141,0.293,0.334,0.31,0.582,0.476c0.051,0.021,0.105,0.038,0.157,0.054c0.018-0.14,0.037-0.279,0.053-0.422
c-0.231-0.234-0.443-0.341-0.58-0.686C124.43,211.576,124.36,211.593,124.289,211.611z M124.922,213.406
c0.106,0.071,0.211,0.138,0.318,0.211c0.158-0.052,0.315-0.106,0.475-0.16c0.019-0.034,0.037-0.068,0.051-0.104
c-0.419,0.001-0.608-0.078-0.738-0.369C124.935,213.101,124.924,213.166,124.922,213.406z M155.69,215.833
c0.177,0.087,0.353,0.177,0.529,0.265c0.609-0.01,1.25-0.171,1.583-0.477c-0.23-0.386-0.457-0.772-0.686-1.159
C156.515,214.54,155.966,215.413,155.69,215.833z M152.736,220.53c0.033,0.945,0.35,1.506,0.526,2.216
c0.124,1.581,0.248,3.168,0.371,4.751c-0.123,0.157-0.247,0.315-0.371,0.476c-0.974-0.103-0.86-0.981-1.793-1.109
c-0.329,0.232-0.645,0.411-1.107,0.528c0.121,0.455,0.31,0.637,0.158,1.161c-0.331,0.209-0.578,0.415-1.109,0.424
c-0.404-0.371-0.81-0.74-1.213-1.111c-0.455,0.771-1.381,0.337-1.849-0.053c-0.169,0.233-0.299,0.766-0.527,0.951
c-0.663,0.322-1.633-0.128-2.108-0.369c-0.796,0.502-0.631,1.397-1.849,1.213c0.088,0.211,0.176,0.422,0.264,0.633
c-0.053,0.122-0.104,0.249-0.159,0.37c-0.686,0.115-1.327,0.018-1.899,0.317c-0.156,0.088-0.158,0.142-0.265,0.264
c-0.017,0.051-0.036,0.104-0.052,0.159c1.73,1.075,3.2,2.288,4.011,4.274c0.156,0.615,0.315,1.229,0.475,1.847
c0.232,0.338,0.917,0.397,1.214,0.686c0.281,0.275,0.715,1.301,0.895,1.425c0.652,0.211,1.303,0.423,1.952,0.633
c1.179,0.721,2.358,1.443,3.537,2.163c0.986,0.987,1.971,1.97,2.954,2.957c1.054-2.731,1.585-5.548,2.219-8.708
c0.249-1.248,0.049-2.641,0.422-3.96c0.227-0.475,0.457-0.95,0.685-1.425c0.018-0.737,0.036-1.477,0.055-2.214
c0.14-0.071,0.281-0.142,0.423-0.212c0.114-0.913-0.635-2.007-0.952-2.746c-0.604-1.408-1.263-2.626-1.954-3.904
c-0.333-0.686-0.667-1.372-1.002-2.059c-0.314-0.229-0.633-0.455-0.949-0.688C153.404,219.79,153.069,220.16,152.736,220.53z
M146.613,225.806c-0.053,0.387-0.106,0.772-0.158,1.163c0.036,0.032,0.072,0.069,0.105,0.105c0.304-0.416,0.881-0.804,0.264-1.269
C146.755,225.806,146.684,225.806,146.613,225.806z M147.563,226.916c-0.035,0.019-0.07,0.035-0.105,0.054c0,0.088,0,0.174,0,0.264
c0.176,0.141,0.354,0.282,0.529,0.421c0.238-0.041,0.229-0.056,0.371-0.157c-0.072-0.248-0.144-0.495-0.213-0.739
C147.95,226.809,147.757,226.863,147.563,226.916z M146.72,227.179c0,0.124,0,0.245,0,0.369c0.266,0.383,0.452,0.547,1.054,0.476
c-0.27-0.355-0.529-0.659-0.79-1.055C146.895,227.039,146.808,227.109,146.72,227.179z M148.513,227.865c0,0.019,0,0.036,0,0.053
c0.23,0.176,0.458,0.354,0.687,0.529c0.087,0,0.176,0,0.262,0c0-0.021,0-0.035,0-0.053c-0.153-0.32-0.357-0.4-0.579-0.635
C148.761,227.794,148.635,227.831,148.513,227.865z M149.886,228.18c-0.105,0.091-0.212,0.18-0.316,0.267c0,0.069,0,0.14,0,0.21
c0.069,0.019,0.14,0.036,0.211,0.052c0.193-0.134,0.272-0.225,0.581-0.262c0.016-0.035,0.034-0.071,0.052-0.106
c-0.088-0.051-0.177-0.104-0.265-0.16C150.061,228.18,149.974,228.18,149.886,228.18z M123.815,320.697
c0,2.329,0.075,4.927-0.369,7.018c-0.229,0.882-0.459,1.762-0.689,2.641c-0.843,1.057-1.687,2.111-2.533,3.168
c-0.121,0.845-0.247,1.688-0.369,2.531c-0.123,0.439-0.246,0.879-0.37,1.32c0.159,0.491,0.318,0.984,0.477,1.479
c0.053,0.614,0.104,1.23,0.158,1.847c0.306,1.942-0.59,4.063-0.423,5.646c0.21,0.984,0.423,1.97,0.634,2.955
c0.446,2.444-1.065,5.719-1.741,7.23c0.546,0.715,1.532,1.288,1.689,2.375c-0.124,0.458-0.248,0.915-0.371,1.372
c0.247,0.424,0.494,0.843,0.741,1.268c0.104,0.508,0.21,1.02,0.316,1.529c0,0.792,0,1.585,0,2.375
c0.276,1.721,0.611,3.259,1.583,4.275c0.017,0.036,0.036,0.067,0.052,0.105c0.229-0.581,0.458-1.162,0.688-1.741
c0.351-0.457,0.704-0.916,1.054-1.372c-0.455-0.511-0.914-1.022-1.372-1.532c1.198-1.636,2.836-3.288,3.431-5.486
c-0.035-0.722-0.071-1.443-0.105-2.166c0.227-1.061,0.602-2.197,1.056-3.113c0.879-0.933,1.759-1.865,2.64-2.796
c0.052-0.652,0.103-1.302,0.158-1.954c0.299-1.41,0.528-3.07,0.789-4.75c0.353-2.254-0.162-4.647,0.161-6.754
c0.017-1.337,0.036-2.676,0.052-4.011c0.352-1.231,0.703-2.464,1.055-3.694c0.043-0.674-0.861-1.337-0.582-2.322
c0.331-1.149,1.609-1.56,2.062-2.585c-0.34-0.245-0.453-0.426-0.583-0.899c-2.982-0.85-4.812-3.486-6.966-5.224
c-0.755-0.704-1.512-1.409-2.271-2.111C123.85,318.445,123.831,319.572,123.815,320.697z"/>
</svg>


This is the path data for 1 shape in the file.



You can copy/paste the paths to individual files the same as you would any code or markup structure.

Using a "what-you-see-is-what-you-get" editor such as Adobe Illustrator or Inkscape often makes things easier though.

10% popularity Vote Up Vote Down


Back to top | Use Dark Theme