Convert Photoshop Selection to Polygon Points. ("x,y,x,y,x,y")

Issue

For example, I can open this image to Photoshop and select, let’s say, Europe, with any selection tool. Then I need to export/save/see that selection as coordinates. As in the, <polygon points="343,754,274,725,314,709,374,702" />. Please, any tips?

worldMap

Solution

Found a way to do this quite quickly actually.

  1. Downloaded GIMP. From there I made my selection and convert my selection to path. There is a little button for that down to the right.
  2. Then exported the path (right click it) and open it with a text editor like Notepad++.
  3. Copy the <path … />. Delete any Id and other unnecessary styles it has in it. Usually, its a lot of lines of code. You can use this instead of .

And that’s it. If you want to make it even more flashy you can use something like

    `path {
         fill: transparent;
         transition: all .3s ease-in-out;
         box-shadow: rgba(0, 0, 0, 0.06) 0px 2px 4px;
     }
     path:hover {
         stroke-width: 2;
         stroke: black;
         box-shadow: rgba(0, 0, 0, 0.22) 0px 20px 65px;
         transform: translate3d(0px, -3px, 0px);
     }`

to your CSS files.

Answered By – Cain

This Answer collected from stackoverflow, is licensed under cc by-sa 2.5 , cc by-sa 3.0 and cc by-sa 4.0

Leave a Reply

(*) Required, Your email will not be published