Monodraw: Line Labels
Lines, an essential part of almost every diagram, are very well supported in Monodraw. But one of the app's weak spots is the poor support for line labels. We've made significant improvements in this area which I want to cover in this post.
What Are Line Labels?
Before we dive into the topic of the changes we have made, it's vital to first discuss how line labels work, to be able to better understand the impact of the improvements.
Generally, when it comes to the design of abstract models in software (e.g., vector drawing apps support paths, text etc.), it's preferable to have a small but powerful set of composable primitives and operations. There are two main reasons for this:
- Simplicity: the smaller the set of primitives, the easier it is to learn and remember them. This reduces the cognitive load required to use the app.
- Power: a smaller but more powerful primitive set means that you can use all the capabilities of each primitive in a variety of situations. Contrast that with the alternative: having many primitives each supporting a small number of features – this would severely limit their usefulness.
Ideally, we do not want to support a separate line label shape but rather re-use the rectangular shape – consequently, the labels would be highly customisable. The important aspect of a line label is that it moves together with the line. This can work beautifully in Monodraw as each rectangular shape's position is defined by an anchor point which can be dynamically attached to other shapes.
Initial Support
As we have established so far, line labels are just rectangular boxes with text which are attached to the line. But how are those attachment points defined? Up until now, the user had no direct control over such points and they were defined as follows:
- Each line point (start, end + mid) is an attachment point.
- For each orthogonal line segment, there are attachment points for the corner and the midpoints of the vertical and horizontal parts.
This setup is not ideal and creates several problems. Firstly, the attachment points depend on the existence of particular midpoints / segments – if they're deleted, any shapes attached to them automatically get detached. This is a very undesirable behaviour, as the user would have to go and re-attach line labels whenever the line geometry changes. Secondly, there is no manual control over the position of the attachment points which is extremely limiting.
Furthermore, another problem arises from the fact that the anchor point of a rectangular shape always resides inside the shape itself. Consequently, line labels must always overlap the line which is undesirable in many situations.
Improvements
We have fixed all of the above limitations in the following way:
- Attachment Points: All line attachment points are now controlled by the user and do not depend on the existence of particular segments.
- Rectangular Box Offset: the rectangular shape's box can now be arbitrarily offset from its anchor point, meaning that the line and labels no longer have to overlap.
- Double-clicking on a line adds a label.
We've just pushed an update, so go grab it (v0.8.5 is in the pre-release branch) – the intro document was also updated to include line labels using the new type of attachment points. We still need to do some further refinement in the future but we are confident the changes so far represent a significant improvement.
You should follow @Monodraw for the latest updates.