SVG Code Issue - Need help badly

[Paul33502301fo9n]

Hello, I been working for a client for over 10 years but have recently had to switch companies that I work for and they have a whole different way of doing things. This has caused me to run into an issue that I have never encountered before.

Our client sent us a group of engineering drawings in .blob format. We are tasked with converting these files in to .svgz files because they will be displayed on the client server on a client website. Our job is to also create a layer called "LINKS" on every drawing where we will place 0% opacity filled rectangles over the components in the drawings. These rectangles will become a clickable area for the client end user to click on components on the drawing that will bring up a popup menu that will display the engineering data for the component among other things.

The issue that I am having is that these drawings often have multiple instances of the same component on them, especially on drawings that are several pages long. For example, on my LINKS layer, I have a component labeled as COMP:D6637. This component is on the drawing 3 times. When I go to save the file as a .svgz, I use the following save settings:

When I click on the SVG CODE... button and look at the code Illustrator is adding random characters to the end of the component to make each component have a unique identifier which you can see in the image below, there is a COMP:D6637, a COMP:D6637V, anda COMP:D6637V underscore a long string of numbers.

If the drawing gets uploaded to the client server these components are unclickable because the SVG code no longer matches what I labeled the components in my LINKS layer. I really need these components to not have unique identifiers and to be able to have multiple instances of the same component labeled in my LINKS layer so each can be clicked on once the file is uploaded to the client site.

At my previous employer, we could do this without issue but we never started with .blob files, we had .svg files to start with. I don't know if that could be the cause of the issue, or do I have a Save setting wrong, or if there is some setting inside of Illustrator that will allow for duplicate instances of the same component inside of a layer.

I am not a programmer, nor do I have a great understanding of coding so any help or advice would be greatly appreciated.

[Bobby Henderson]

I can't help much on the SVG code issue. But if your artwork features unnecessary duplicates of objects it would be a good idea to fix that. The issue sounds similar to the technical problems that arise when placing PDF files into Illustrator. It's common to have lots of duplicates of objects as unfilled and unpainted paths. Third party plugins such as Vector First Aid can eliminate most of those problems automatically.

[m1b]

HI @Paul33502301fo9n, did you get anywhere with this? I had a play and discovered that if you do the "Export for Screens" SVG, you can choose "Minimal" or "Unique" Object IDs, which will output the layer name "COMP:D6637" to each rectangle, as the "data-name" attribute, not the id. See screen shots below.

I think this would be perfect for you if you can configure the downstream tool—the one that generates the clickable html—to use the "data-name" attribute rather than the "id" attribute. It probably isn't technically difficult to make that change, but not sure if you have that kind of access. Would that be possible?

- Mark

[Paul33502301fo9n]

Hello Mark,

Thank you so much for taking the time to review my post and to play around with it. I have never used Export For Screens before. I tried doing your method, and this is what I got:

It didn't quite work the same for me as it did for you but I am sure that it is an error on my part. Also, it made all 5 of my Layers sub layers of Layer 1 which was not there before. This makes selecting and editing my diagram components much harder.

[m1b]

Hmm.

1. The first screenshot shows three rectangles in a group which is named "COMP:D6637". Is that a correct reflection of your document? If so, then that is not what I understood from your description.

2. Have you tried all the different options when exporting? Each option will make differences—often large ones—to the svg markup.

3. The second screenshot showing sublayers... I'm talking about *exporting* the svg. Once the svg is exported, you shouldn't be opening it in Illustrator ever again. Perhaps you could explain your workflow a bit more?

Additionally, it would help a lot to post a small demo file that shows the issue. You can remove sensitive data, but make sure it still shows the problem, and make sure any subsequent screen shots refer to that demo file. (Also, because the forum software doesn't like .ai files (!) you can save as a pdf with Illustrator compatibility on.)

- Mark