Short summary: pathData of Path element returns SVG data relative to Global Bounds at the moment when this element was created. And SVG data is not being changed when I move this element. I would expect it to return SVG data relative to Path element itself.
Adobe XD version: 22.7.12.3 (Starter), Creative Cloud Sync 4.3.12.14
Long Description:
Unfortunately I can’t put more than one image and two links in one post due to Adobe Forum rules. I am forced to join 5 images to one big. You can open this image by following link:[https://ibb.co/51VHvL2]. Sorry about that.
There is a Path type for some elements in Adobe XD API (https://adobexdplatform.com/plugin-docs/reference/scenegraph.html#Path). Such type of element may be created by Pen tool (as an example).
I wrote a simple plugin for demonstration purpose to show the data of Path elements. I also created two artboards and drew a grid with size 100x100 - just for better position tracking.
So I drew a simple curve with Pen.
[See Image 1]
It has following properties:
Name: Path 1
boundsInParent: {“x”:8.826140403747559,“y”:15.997379302978516,“width”:26.56603240966797,“height”:45.04535675048828}
globalBounds: {“x”:8.826140403747559,“y”:15.997379302978516,“width”:26.56603240966797,“height”:45.04535675048828}
pathData:
M 8.826140403747559 15.99737930297852 C 8.826140403747559 62.93814086914063 30.89148712158203 68.402587890625 34.75292587280273 54.06010818481445 C 38.61436462402344 39.71763229370117 23.72025108337402 15.99737930297852 23.72025108337402 15.99737930297852
Then I added one more curve.
[See Image 2]
Here are the properties of both curves:
Name: Path 1
boundsInParent: {“x”:8.826140403747559,“y”:15.997379302978516,“width”:26.56603240966797,“height”:45.04535675048828}
globalBounds: {“x”:8.826140403747559,“y”:15.997379302978516,“width”:26.56603240966797,“height”:45.04535675048828}
pathData:
M 8.826140403747559 15.99737930297852 C 8.826140403747559 62.93814086914063 30.89148712158203 68.402587890625 34.75292587280273 54.06010818481445 C 38.61436462402344 39.71763229370117 23.72025108337402 15.99737930297852 23.72025108337402 15.99737930297852Name: Path 2
boundsInParent: {“x”:111.08058166503906,“y”:23,“width”:8.886444091796875,“height”:33.65109634399414}
globalBounds: {“x”:111.08058166503906,“y”:23,“width”:8.886444091796875,“height”:33.65109634399414}
pathData:
M 111.0805816650391 23 C 131.0750885009766 53.31867980957031 111.0805816650391 56.65109634399414 111.0805816650391 56.65109634399414
So the pathData of second line starts from the point with coordinates [111, 23], which means that it’s coordinates are bound to either boundsInParent or globalBounds. The first problem is if I use pathData to export Path 2 and use it in other place (for example, in <svg> element in HTML), I will need to create large element (at least with width of 111) and the left border of this element will be far away from the line itself.
Then I moved Path 1 line to the right.
[See Image 3]
But the pathData of both element hasn’t been changed.
Name: Path 1
boundsInParent: {“x”:210.82614040374756,“y”:15.997379302978516,“width”:26.56603240966797,“height”:45.04535675048828}
globalBounds: {“x”:210.82614135742188,“y”:15.997379302978516,“width”:26.5660400390625,“height”:45.04535675048828}
pathData:
M 8.826140403747559 15.99737930297852 C 8.826140403747559 62.93814086914063 30.89148712158203 68.402587890625 34.75292587280273 54.06010818481445 C 38.61436462402344 39.71763229370117 23.72025108337402 15.99737930297852 23.72025108337402 15.99737930297852Name: Path 2
boundsInParent: {“x”:111.08058166503906,“y”:23,“width”:8.886444091796875,“height”:33.65109634399414}
globalBounds: {“x”:111.08058166503906,“y”:23,“width”:8.886444091796875,“height”:33.65109634399414}
pathData:
M 111.0805816650391 23 C 131.0750885009766 53.31867980957031 111.0805816650391 56.65109634399414 111.0805816650391 56.65109634399414
The second problem is when I export the whole artboard and use pathData of both elements - Path 1 will be located in the old position, before Path 2 (if I put both Path 1 and Path 2 pathData to singe <svg> element) or (if I create two different <svg> elements) the second element will have it left border far away from the line itself.
Then I moved Paths-Artboard to the left
[See Image 4]
and added one more curve - Path 3.
[See Image 5]
Here is the data of all three paths:
Name: Path 1
boundsInParent: {“x”:210.82614040374756,“y”:15.997379302978516,“width”:26.56603240966797,“height”:45.04535675048828}
globalBounds: {“x”:1054.826171875,“y”:15.997379302978516,“width”:26.5660400390625,“height”:45.04535675048828}
pathData:
M 8.826140403747559 15.99737930297852 C 8.826140403747559 62.93814086914063 30.89148712158203 68.402587890625 34.75292587280273 54.06010818481445 C 38.61436462402344 39.71763229370117 23.72025108337402 15.99737930297852 23.72025108337402 15.99737930297852Name: Path 2
boundsInParent: {“x”:111.08058166503906,“y”:23,“width”:8.886444091796875,“height”:33.65109634399414}
globalBounds: {“x”:955.08056640625,“y”:23,“width”:8.886474609375,“height”:33.65109634399414}
pathData:
M 111.0805816650391 23 C 131.0750885009766 53.31867980957031 111.0805816650391 56.65109634399414 111.0805816650391 56.65109634399414Name: Path 3
boundsInParent: {“x”:10.209716796875,“y”:117.74542236328125,“width”:18.8836669921875,“height”:32.88447570800781}
globalBounds: {“x”:854.209716796875,“y”:117.74542236328125,“width”:18.8836669921875,“height”:32.88447570800781}
pathData:
M 854.209716796875 117.7454223632813 C 864.2069702148438 164.3992614746094 873.0933837890625 147.7371826171875 873.0933837890625 147.7371826171875
The first point of Path 3 element in pathData has position [854, 117]. Which means it is positioned relatively to Global coordinates. If it was positioned relatively to Artboard coordinates it would have something like [10, 117]. But the pathData of two first paths hasn’t been changed. So if I export the whole artboard there is no way for me to draw all three <svg> elements with correct position - because there is no way to find out the globalBounds of element when these Path elements were created.
It would be very helpful to have pathData positioned to the Path element itself. So there will be no problems with moving elements/artboards. Or at least have pathData updated - so the Path element could be positioned correctly when exported.