Selecting duplicate id from SVG exported from Illustrator in d3.js

I am currently trying to work with a fairly complex SVG created in Illustrator with d3.js. An SVG is a floor plan, each floor of which is its own layer. To show one floor, I just need to show this layer and hide the others, which is very convenient to store in one SVG.

The problem I am having is that when exporting from Illustrator, there are multiple items with the same name. For example, I have an item Elevator A

at each floor level. When I export to SVG it will remove the duplicate ID by renaming it to something like id = "elevator_a_1"

and id = "elevator_a_2"

(but not necessarily ok). I suppose one way to solve the problem in Illustrator would be to name each element uniquely, but I think it spoils my organization a little.

My questions:

  • Is it a strict rule that an identifier cannot be repeated in SVG, even if it is inside a hierarchy? For example. 1st_floor->elevator_a

    . 2nd_floor->elevator_a

    , which will never be visible at the same time.
  • Is there a way to select id in d3 only at the beginning of the id (perhaps via regex or jquery-like )? For example.d3.select("[id^='elevator_a']")

+3


source to share


1 answer


  • IDs must not be duplicated - they must be unique no matter where they appear.

  • Selectors D3 CSS selectors . You can use regular expressions for attribute names using exactly the syntax in your question.



+1


source







All Articles