skanaar / nomnoml

The sassy UML diagram renderer
https://www.nomnoml.com
MIT License
2.66k stars 208 forks source link

Request: interfaces #146

Open vanillajonathan opened 3 years ago

vanillajonathan commented 3 years ago

I would like to see the addition of provided interfaces and required interfaces. The interfaces should preferably be able to have a label. Another great thing would if the interfaces could be attached to ports. The ports should preferably be able to have a label too.

skanaar commented 3 years ago

Are you referring to the "circle" and "crescent"-shaped connectors as described here: https://www.uml-diagrams.org/component-diagrams.html

I would love to add them, it would be as new relation types in that case.

Ports are harder. I could add a port box at the start of the arrow. Please provide a visual example of what you are looking for.

vanillajonathan commented 3 years ago

Yes, I am referring to the "circle" and "crescent"-shaped connectors. I believe those are called "ball-and-socket notation" in UML.

I am trying to have a component:

And be able to have a connector between one component's required interface to another component's provided interface.

The link you provided in your post contains a diagram that shows what I am looking for.

skanaar commented 3 years ago

OK, ball-and-socket relation types are now live on nomnoml.com

Note that since they are relations you cannot express a provided interface without referencing it. So there is some room for additional features.

nomnoml

See it in action: https://www.nomnoml.com/#view/%5BService%5D%20required%20(-%3Eo%20provided%20%5BImplementation%5D%0A%5BA%5D%20--%3Eo%20%5BB%5D%0A%5BEngine%5D%20(o-%20%5BStrategy%7Capply()%5D%0A

vanillajonathan commented 3 years ago

This is good and I realize doing anything more than this is going to be hard.

The notation where the ball-and-socket meets in the middle is deprecated, in modern UML, a component provides an interface, and another component requires an interface, then there is a connection between those interfaces.

|-----------o)-----------| // old UML
|-o ------------------ )-| // new UML

If this were to be according to UML then;

skanaar commented 3 years ago

Nice summary, it is always good to get some feedback on missing features.

Ports are difficult to add because of the layouting library nomnoml uses.

I'll keep this issue open for a while to let other people see it.

skanaar commented 3 years ago

I have now added node types for lollipop and socket so that required and provided interfaces can be expressed without any connections to them.

https://nomnoml.com/#view/%23direction%3A%20right%0A%5B%3Clollipop%3Einterface%5D%20-%20%5BComponent%5D%0A%5BComponent%5D%20-%20%5B%3Csocket%3EISocket%5D%0A%5BISocket%5D%20-%20%5BSocketImpl%5D

vanillajonathan commented 3 years ago

This is now, it allows a component to have multiple required interfaces as well as multiple provided interfaces. It also allows the required interface of one component to connect to the provided interface of another component.

When the interface names are not short I do experience the text overlapping.

Yes, ports would be difficult with the layout engine because it would require a advanced layout engine that takes into account ports too. Maybe it would be possible to create a "dirty hack" for ports by making the box be the start of the edge, however this would come with limitations such as not being able to have multiple interfaces on one port.

HauserV commented 3 years ago

Thank you both for the work on this. Really appreciated.

Do you have an estimate when we could get a new version that includes this feature?

skanaar commented 3 years ago

I guess you are asking about a NPM package release?

I intentionally waited a bit to see if people found any issues with the ball and socket features in the web version.

vanillajonathan commented 3 years ago

@skanaar

When the interface names are not short I do experience the text overlapping.

HauserV commented 3 years ago

Exactly. Some people on our documentation team wanted to give a nomnoml a try (as an alternative to PlantUML) but since in our toolchain we let Kroki take care of diagramming for us we would need an NPM package because then it's just the matter of updating the version inside Kroki.

We have noticed that there was very little activity in this issue for some time now and so I wanted to ask about the status. Leaving more room for feedback is absolutely fine.

skanaar commented 3 years ago

v1.4.0 is now published. Please report any issues 😄

vanillajonathan commented 3 years ago

@skanaar, Long interface names are cropped.

Example:

[<lollipop>IHttpContextAccessor] - [Component]
vanillajonathan commented 3 years ago

@skanaar Is it possible to do anything about long interface names being cut off?

skanaar commented 3 years ago

Hi, yes it can be done but not immediately. I cannot spend too much time on nomnoml right now and this would require adding some capabilites to the layouting system.