DragCreatingTool - Change the figure in the shape dynamically

I am trying to use DragCreatingTool.js in GoJs.

default I am able to draw as rectangle shape via mouse click.

But I want to change shape into circle/rectangle dynamically outside the Go Js Button Click event.

If I execute the below code, in the tool box it change to circle.

myDiagram.startTransaction(“Update Tool Shape Figure”);
var tool = myDiagram.toolManager.findTool(“DragCreating”);
var _box = tool.box;
var _boxShape = _box.findObject(‘SHAPE’);
_boxShape.figure = “Circle”;
myDiagram.commitTransaction(“Update Tool Shape Figure”);

if I start drawing via mouse , it showing as a circle.

if I complete a circle it changed to rectangle.

Please help me to change the shape dynamically using DragCreatingTool.

This code:

myDiagram.toolManager.findTool(“DragCreating”);
tool.box.findObject(‘SHAPE’).figure = “Circle”;

modifies the tool and thus the appearance and behavior when the user is using that tool. (A transaction is not necessary when modifying tools.)

It does not modify the model or what is shown by data in the model. Presumably all of the nodes that you see in your diagram are representations of data in the model, so it is how the node templates are defined that affects the appearance and behavior of the nodes in the diagram.

That is why changing the appearance of the parts that are used during the operation of a tool affect the tool but not the nodes for the model data.

Do you have a way of having node data in your model that result in circular nodes in your diagram? If so, then you can customize the DragCreatingTool.archetypeNodeData object to have those properties.

1 Like

i tried with the below as default,
archetypeNodeData: { color: “white”,figure : “Rectangle” ,stroke: “cyan”,fill: “orange”},

then click event
function ChangeIntoCircle()
{
var tool = myDiagram.toolManager.findTool(“DragCreating”);
tool.archetypeNodeData.figure= “Circle”;
}
it’s working, when i draw next shape it changed into circle. is it correct ?
But Circle Position is not center positioned . need to check why ?

Yes, your model data looks OK, so the problem is in your node template. But I don’t know what that is…