Interpreting Inkscape SVG path coordinates for HTML map

Posted by tovare on Super User See other posts from Super User or by tovare
Published on 2010-07-12T19:56:51Z Indexed on 2011/11/25 2:01 UTC
Read the original article Hit count: 570

Filed under:
|
|

I needed some coordinates for a HTML MAP and tried to use inkskape by opening the image and just draw a path with my polygon coordinates.

My document properties are set to 256 x 256 pixels and units: px

When opening the svg file i get coordinates which are not immediately apparent.

 <path
   style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;
          stroke-linejoin:miter;stroke-opacity:1"
   d="m 23.864407,126.91525 3.254237,
                   44.47458 35.79661,
                   44.47458 71.593216,
                   19.52542 71.59322,
                   -37.9661 22.77967,
                   -72.67797 L 218.0339,
                   64 192,49.898305 l -32.54237,
                   8.677966 -18.44068,
                   -35.79661 1.08474,
                  -17.3559322 -71.593215,0 L 45.559322,34.711864 35.
                   79661,57.491525 5.4237288,
                   74.847458 6.5084746,101.9661 23.864407,126.91525 z"
                   id="path2840" />

How can I get coordinates I can use ?

The original image

alt text

The SVG file from inkscape

Link to SVG


Progress:

I tried a tool called InkscapeMap which looks promising and simple, but unfortunately it looks like it didn't work with this particular svn file.

alt text


Solved!

Saving the file as a Plain SVG solved the problem and InkscapeMap worked perfectly.

(Btw. saving as an optimized svg caused a parsing error)

Update 13.11

Using inkscapeMap 0.6 and Inkscape 0.48 i needed to uncheck relative coordinates in SVG output preferences. Also if you get a C error message, hunt down the polygon with a C in it, and redraw the polygon using the XML editor in inkscape.

Update 25.11.2011

I modified the source to improve parsing.

http://tovare.com/articles/createhtmlimagemapsusinginkscape/

© Super User or respective owner

Related posts about html

Related posts about inkscape