5 Replies Latest reply on Oct 16, 2017 4:33 AM by azisher

    Expand stroke/create outline of multiple SVG

    azisher

      Hello everyone, I have more than a thousand SVG icons but unfortunately all SVG are in stroke like this image below:

      Screenshot at Oct 16 14-17-34.png

      and this one below is what I'm looking for:

      Screenshot at Oct 16 14-18-04.png

      I've tried Illustrator batch action with this step: Select - All on active artboard - Object - Expand - Save.

      BUT I need to confirm (click OK) each time expand windows pop-up appear, and it's take a lot of times.

      Screenshot at Oct 16 14-24-08.png

       

      Is there any script to replace this action without clicking any pop-up window?

       

      Thanks.

        • 1. Re: Expand stroke/create outline of multiple SVG
          itsBenMason Level 2

          Hellos,

           

          For this you can use the executeMenuCommand to run the expand options like so:

           

          app.executeMenuCommand("selectall");
          app.executeMenuCommand ('Live Outline Stroke');
          app.executeMenuCommand ('expandStyle');
          

           

          Full script that will open all SVG files within a folder then save to an output folder within the original folder.

           

          //Change this to your AI files folder (Be sure to end with a /)
          var location = "/Path/To/Folder/Containing/SVG/Files/";
          
          
          function getFiles() {
            var folder = new Folder(location);
            if (folder.exists) {
              return folder.getFiles("*.svg");
            } else {
              alert("Unable to find SVG Files Folder");
            }
          }
          
          
          function openFiles(files) {
            var documents = [];
            for (var i = 0; i < files.length; i++) {
              var file = files[i];
              documents.push(app.open(file));
            }
            return documents;
          }
          
          
          function saveFile(destination, name, document) {
            var folder = new Folder(destination);
            if (!folder.exists) folder.create();
            var destFile = new File(destination + name);
            document.saveAs(destFile);
          }
          
          
          /*
           * Run script
           */
          
          
           openAndExpand();
          
          
          function openAndExpand() {
            try {
              var files = getFiles();
              if (files.length > 0) {
                //Open Each File
                var documents = openFiles(files);
                if (documents.length > 0) {
          
          
                  //Expand Each File and Save
                  for (var i = 0; i < documents.length; i++) {
                    var document = documents[i];
                    document.activate();
                    expandFile();
                    saveFile(location + "/output/", document.name, document);
                  }
          
          
                  //Close All Documents
                  for (var i = 0; i < documents.length; i++) {
                      documents[i].close();
                  }
          
          
                }
              }
            } catch(e) {
              alert("Error Processing:");
              alert(e);
            }
          }
          
          
          function expandFile() {
            app.executeMenuCommand("selectall");
            app.executeMenuCommand ('Live Outline Stroke');
            app.executeMenuCommand ('expandStyle');
          }
          
          • 2. Re: Expand stroke/create outline of multiple SVG
            azisher Level 1

            Hi Ben, thank you for your help.

            Tested your script but its save as Ai not SVG, is there any way to keep the file as SVG?

            Screenshot at Oct 16 18-06-34.png

            • 3. Re: Expand stroke/create outline of multiple SVG
              itsBenMason Level 2

              Whoops, give us a moment ill change to SVG saving

              • 4. Re: Expand stroke/create outline of multiple SVG
                itsBenMason Level 2
                function saveFile(destination, name, document) {
                  var folder = new Folder(destination);
                  if (!folder.exists) folder.create();
                  var destFile = new File(destination + name);
                
                
                  var options = new ExportOptionsSVG();
                  document.exportFile(destFile, ExportType.SVG, options);
                }
                

                 

                Replace the old save function with this one and should save the files as SVG again.

                (Apologies, had activeDocument and not document though should work the same)

                • 5. Re: Expand stroke/create outline of multiple SVG
                  azisher Level 1

                  Thank you so much, you saved my life!