Canvas - Make Arrows & Labels Have Nodes

[egpi]

Use case or problem

When making my maps, I realized that I wanted the ability to connect arrows to other arrows and to labels, like in mind maps.

Proposed solution

So instead of having to connect the arrow to the node of a card that already has an arrow coming from it, I would be able to create a small node on the arrow itself to connect to any other node. This would make the arrows much more precise, which is necessary when the actual canvas gets very crowded.

Summary: Please add the ability for the arrows themselves and possibly even the labels to have nodes!

Current workaround (optional)

Currently, if I want to have a node somewhere I cannot, I have to create a small blank card and place it on top of the arrow or around the label, and/or have multiple arrows coming from the same node on a card. It makes my canvas look overcrowded.

[I-d-as]

Interesting! It sounds like this is a reasonable request, but I am unsure I totally understand why it would be better to have these connection line attached nodes in comparison to simply adding another separate node as a pass through between your two nodes. One thought I had for your preference was that the arrows on the connection lines only occur at destinations and perhaps they serve a specific function in your visual system. At some point connection lines may be more customizable, which will be helpful in this regard.

My other thought is that, based on not wanting to have to rearrange to provide space for the connection line attachment node, you simply wanted the ease of tacking it on without disruption. In this case, I agree with where you are coming from but still think using actual nodes seems like a reasonable alternative. In terms of saving time inserting nodes as go-between, you may like this request: Drag Canvas element/elements onto connection line to insert links in chain.

Regardless, I think your idea is a good one and would appreciate if it were possible. I would however find it important that these connection line attachment nodes be capable of conversion to normal nodes. That is, if they weren’t already capable of everything a normal node can do from the outset, an additional function to do this might be necessary.

Good idea! Thanks!

[MarkCameronHarris]

My use case for this is concept mapping. My go-to app, Cmaptools, is too old now. It had a great feature in that every line label was also a connectable node. That made it possible to have a relationship term (such as, ‘has’) link out to multiple child concepts. For example:

Notice how the link arrow downstream of ‘species’ splits from the label. This is more efficient visually and cognitively.

This functionality would get a step closer to making Canvas a suitable concept mapping tool. (Note that concept mapping has different functional requirements from mind mapping.)

[AvocadoAtLaw]

This feature would be excellent please!

[recursi0n]

I’m starting to use Canvas and would like to know if this thing (one common label for multiple connections as in the picture below) is currently possiblle?

[Kuerm]

There are many people looking for this feature - including me
Is there another workaround to achieve this?
Or is there some timeline, when and if this feature will be implemented?

[RichardCoppin]

What is looks like you’re looking for is a way to create nodes with invisible borders.

You can get this effect by creating a css snippet with the following:

.canvas-node-container {
  border: none;
  text-align: center;
}

The nice part about this is that the default node has no border, and to add a border you just need to color the node.

Be warned! The effect is global to every canvas in your vault.

Take a look at this for more info:

Quick Guide: Customizing your canvas (rotating nodes, removing borders/backgrounds)

[image] While canvas is already a very useful tool and an excellent addition to Obsidian, it’s still missing some basic customization options. Until these features are added, this guide will provide some basic CSS to extend these options. Simply add any of these code examples into a new CSS Snippet. Targeting specific canvas elements To ensure our modifications don’t apply to every single element on our canvas, we need to add a custom CSS class to the YAML header of the note we have included …

[blurple]

I’d like to add another voice/use case for this! I’m a scientist and want to be able to map out concepts or biochemical pathways, and there are lots of uses for being able to connect to a label without making it an actual node.

Here’s a bad powerpoint mockup of something I want to be able to do:

Currently, Canvas is limited to the use case of connecting concepts (like saying birds are animals and dogs are animals). We can add some detail about this connection (dogs are a type of mammal), but we are still just connecting two thoughts together. But this falls apart when the connection between the concepts itself has inherent meaning. It’s a process or a cause/effect or a transformation. Or in other words, Canvas can connect nouns together, with adjectives. But if you connect nouns with verbs, and then want to describe something about the verb, that’s not possible.

I want to be able to show that Enzyme 1 needs the activation signal in order to effectively change Molecule A into Molecule B. It wouldn’t make sense to make the activation signal point at Molecule B, because the process of A → B is important.

@RichardCoppin 's solution of invisible borders is okay for Enzyme 1, but it’s really annoying to move the extra node if I adjust the position of anything else, while the arrow labels automatically move with the lines. And for Enzyme 2, aesthetically, it looks so much cleaner with labels instead of extra nodes because the lines are continuous instead of linking to an invisible node.

For ‘Molecule E’, it should connect to the line between C and B. I can’t just directly connect Molecule E to B, because it’s important that it’s a reaction of C+E = B. And similarly, it’s important ‘Inhibitor drug’ specifically points to the combination of C and E, because the drug impacts the rate of combining C+E to make B.

I know Canvas isn’t a specialized software for drawing chemical reactions, but I have had the same issue when trying to map out biology concepts (this was just the first simple example I thought of). In actuality, I would want to embed my actual notes about the molecule E or the experimental data I have for inhibitor drug.