Greetings everyone,
I’m currently having trouble trying to generate objects from svg pathData instead of width/height. Let’s say I’m trying to create a rectangle, refeering to the pathData instead of width/height, like the following example:
let rect = new Rectangle();
rect.pathData = ‘M 0 0 L 325 0 L 325 55 L 0 55 Z’;
rect.fill = 4278217177;
rect.stroke = 4278217177;
documentRoot.addChild(rect);
I get the following feedback:
“Plugin TypeError: Cannot set property pathData of [object Object] which has only a getter at functionName.”
Am I missing something? Is object.pathData a read-only parameter?
Representation of the path outline in SVG <path> syntax. Unlike other node types, pathData is writable here. Syntax is automatically normalized, so the getter may return a slightly different string than what you passed to the setter.
Therefore, path data is only “writeable” for Path nodes (not for rectangles – for everything but paths, they’re read-only). See also the pathData docs for GraphicsNode (scenegraph · Adobe XD Plugin Reference):
Returns a representation of the node’s outline in SVG <path> syntax. Note that only nodes with strokePosition == GraphicNode.CENTER_STROKE can be faithfully rendered in actual SVG using the exact pathData shown here. Kind : instance property of GraphicNodeRead only : true
The problem is that for my particular case I wish to create specifically a Rectangle object instead of a Path one, as in a Rectangle you’re able to set certain stuff like border-radius. I was able to visually simulate it by using a Path instead, but I lose some functionality on the result object. But it is what it is, and I can see why other objects can’t be built by simply feeding some pathData. I guess I was just testing my luck.
Maybe I’m not understanding correctly, but creating a Path and a Rectangle it’s not the same thing, regarding how the user is able to manipulate the two objects, some parameters like “border-radius” are only available for Rectangle objects. As in my particular case I need to generate them only by providing the pathData, I’m not able to create a Rectangle, but instead a Path. Or am I missing something?
The problem here is creating a new Rectangle using only the pathData parameter, and not the width/height.
Something like the following:
let rect = new Rectangle();
rect.pathData = ‘M 0 0 L 325 0 L 325 55 L 0 55 Z’;
rect.fill = 4278217177;
rect.stroke = 4278217177;
documentRoot.addChild(rect);
This is not possible apparently, so I need to figure out another solution eventually. But thanks everyone for trying to help!