Problem (objects do not turn green/red)

Submitted by LvivGeographer on July 9, 2025
Recently, I got the idea to make a map of all the communities (municipalities) in Ukraine. Initially, I wanted to create a quiz of Lviv region only.

I have no experience in creating high-quality maps at all. But I realized that I could extract the data on communities (and rayons) from overpass-turbo.eu (as a json file), and then reformat it into a svg format on mapshaper.org. Then I edited it in Indscape to add colors for the communities and rayons. Thanks to Python, I was able to extract the necessary id's and find their corresponding names in osm. Everything worked and looked great (which surprised me), the names of the communities were accepted, but their objects did not turn green. Please let me know what the problem might be, thank you

10/07/25 - solved!!!

9 Comments
+1
Level 83
Jul 10, 2025
Did you give the paths/objects class names?
+1
Level 83
Jul 10, 2025
Also, what type of quiz is it? Text with an SVG?
+1
Level 18
Jul 10, 2025
I didn't give classes to objects/paths (I don't know how to do this in the Indscape and for what). And yes, I use text with an SVG
+1
Level 83
Jul 10, 2025
JetPunk turns objects green based on their classes. In Inkscape’s code tab, where you see things like id="path148", you can also add classes (something like class|="path148" except without the | would work fine, but you can put whatever you like). On an SVG quiz, your hint column should line up to the classes of the objects in your quiz. For instance, if you have Italy as an answer, make sure your object for Italy has and that the hint column in JetPunk says italy for that answer.
+2
Level 18
Jul 10, 2025
Thank you, but I still don't understand the difference between classes and id, and why classes are needed if there is an id).

But, I did solve my problem, purely by chance, I was very lucky! It turns out that the paths were not turning green because the id contained “/”, so I replaced them with “_” and the quiz worked, that's it!

+2
Level 83
Jul 10, 2025
Oh nice! I guess / isn’t a valid character in a path id.
+2
Level 18
Jul 10, 2025
I have solved this issue. It turns out that the path id cannot contain “/” in the name, otherwise it will not turn green/red. Perhaps this will help someone someday, I have not read about this anywhere
+1
Level 58
Jul 10, 2025
I think a simple explanation for ids and classes could be as follows:

Ids can be added for single elements: so basically if you have an individual path on its own, you can set an id for it.

Classes, on the other hand, can be added for multiple elements grouped together.

So like if you want multiple paths to light up with a single answer, you can set the same class for all of them..something you can't do with ids.

+2
Level 83
Jul 10, 2025
Yes. You can’t have more than one thing ever using an id or it’ll trip an error. Classes can be reused. If you, say, have a path for Britain and another path for Northern Ireland, you can give them both the same class to make them work.