Feature to add/remove node in `EdgeDraw` widget

[Shnku]

work in progress........

trying from python side it not working

so, planning to add a text-field and button into that widget canvas.

[Shnku]

is the js code in wigglystuff/static/edgedraw.js automatically generated using js/edgedraw.js??
how?

or editing tail of this wigglystuff/static/edgedraw.js big file is ok?

[koaning]

In the future, let's wait and discuss the feature before implementing. I agree with the idea here so I'll continue this discussion in the PR but it's better to agree on the direction of a feature in the GitHub issue first.

[Shnku]

Thanks for the idea/PR. This feature could work but before diving deeper into the code I would first like to discuss the experience.

I don't mind the feature, but as is, it looks a little bit ugly. I would like the buttons to actually look like buttons.

I also think we should make this configurable. The default behavior was fine, where you only have a static set of nodes to work with. But if you want to have something interactive I'm open to it but there should be some sort of setting. Maybe add_interface?

I also notice that when I remove a node that it can remove all connections that have been drawn.

I am testing this by implementing this into a web page
check this https://shnku.github.io/web_tech/Graph_anywidget/viewgraph.html

Actually the long code of d3 is included in edgedraw.js i just edit extra parta without touching other things. Thats why i am asking

is the js code in wigglystuff/static/edgedraw.js automatically generated using js/edgedraw.js?? how?

or editing tail of this wigglystuff/static/edgedraw.js big file is ok?

[koaning]

I wonder if perhaps it's easier to remove a node by double-clicking it. Open to suggestions though. And yeah, to build the javascript you can run make js. This runs the Makefile.

There's a tutorial here if you're new to Makefiles.

[Shnku]

Thanks, I will try that out.

[Shnku]

I wonder if perhaps it's easier to remove a node by double-clicking it.

I am thinking about,
by clicking the node it will be selected .. then clicking the remove button will remove the node

will it be better?

[koaning]

That sounds good, feel free to make a demo for it!

[Shnku]

That sounds good, feel free to make a demo for it!

Checkout the html demo.

https://shnku.github.io/web_tech/Graph_anywidget/viewgraph.html

[Shnku]

@koaning , sir, you have any plan to make the Edgedraw widget a complete graph-network visualization tool?

• adding-removing node is ready. fix all
• can be select node and remove it.

besides this I'm trying to add the edge weights functionality. Check the demo. with this it will be helpful to work with more graph related functions.

but in the demo .. for adding new edge weight i use prompt(). I think it will be better if it is possible to use an input box instead full-screen prompt popup.

what about the idea? give me a review.
i have to sync the changes with new code structure.

[koaning]

I think for this library I would prefer not to do anything with edge weights. It would make the ui more complex and the main feature of the widget should be to "drag edge". The remove node functionality feels fine though. Just needs a bit of css/styling.

Long term I'm considering to use radix for this because that's the default for marimo as well.

[Shnku]

I think for this library I would prefer not to do anything with edge weights. It would make the ui more complex and the main feature of the widget should be to "drag edge". The remove node functionality feels fine though. Just needs a bit of css/styling.

Ok, then should i commit the add-remove node feature ?

[Shnku]

#29