inkscape - SVG | y-coordinate is different -


the svg file: http://pastebin.com/8n61vps1

enter image description here

<rect    style="fill:#000000"    id="rect3409"    width="166.39345"    height="180.32787"    x="77.049179"    y="611.37854" /> 

the rectangle "rect3409" has coordinates (x,y) = (77.049, 260.656) in inkscape 0.91 r13725.

however, tag <rect> id rect3409 has (x, y) = (77.049, 611.379). why there differences between two?

i want correct svg coordinate of rectangle. how do that?

if @ source, you'll see #rect3409 has parent g element:

<g transform="translate(0,-452.36216)">   <!-- snip -->   <rect     id="rect3409"     width="166.39345"     height="180.32787"     x="77.049179"     y="611.37854" /> </g> 

the transform=translate(tx, ty) attribute on g applied dimensions of #rect3409. vertical axis of rect goes y + ty y + h + ty, 611 - 452 == 159px 611 + 180 - 452 == 339px. i think these "correct svg co-ordinate" values want.

but inkscape not reporting these values, rather 261px 441px. seems inkscape flipping y axis: in svg (and conventionally in computer graphics) y=0 @ top of screen, , y increases move down screen. example, following svg displays red box above blue box:

<svg>   <rect x="0" y="0" width="10" height="10" fill="red" />   <rect x="0" y="10" width="10" height="10" fill="blue" /> </svg> 

in inkscape, however, have mathematical convention of y=0 @ bottom, , y increasing go upwards. therefore, co-ordinates see in inkscape modified "true" svg co-ordinates (thanks @squeamish ossifrage pointing out in comments): y_inkscape = h_image - y_svg, y_inkscape inkscape tells, you, y_svg what's in file, , h_image total image height.

your sample image 600px high, "inkscape" co-ordinates of #rect3409 are
600 - 339 == 261px, and
600 - 159 == 441px.


Comments

Popular posts from this blog

javascript - AngularJS custom datepicker directive -

javascript - jQuery date picker - Disable dates after the selection from the first date picker -