An algorithm for annotating illustrations, or why not a programmer to be a bit of a designer?

I want to bring to your attention one interesting problem and several ways to solve it. Initially, the task appeared on stackoverflow, but before going to the point I want to emphasize the absence of any desire to impose my point of view.

So, the task: there is a series of images and a set of explanatory labels for each image, it is necessary to place the labels in the optimal way, avoiding the intersection of the connecting lines and preserving the overall readability.


Obviously, the task is not trivial. Moreover, I would say any direct solution can not guarantee the optimal result. In other words, a person (for whom, in fact, we are trying) will definitely notice some oddities in the placement of explanatory labels. In some particularly difficult cases, the result may seem disgusting.


I will try to briefly formulate important, in my opinion, criteria:

• general cleanliness and readability
• lack of “attention away”, because the priority is the main image, rather than tags that play an important, but nonetheless minor, role
• ease of posting explanations
• stable result quality

So, at this stage, you can choose from the following:

1. try to find a suitable algorithm
2. change the style by solving a problem on another level

The first way: find the appropriate algorithm
The options, in fact, are quite enough: iterative methods, something like wiring of printed circuit boards, a genetic algorithm, etc. Concerning the PCB layout, the following document is of interest: Algorithmic studies on PCB routing by Tan Yan

I think everyone will have their own assessment of the reliability of one of these approaches, the resource intensity of implementation, testing and making the necessary changes to correctly work out possible boundary situations.
')
The second way: try to work with the style
In other words, we will move to the meta-level, which can significantly improve the result, while at the same time simplifying the implementation. Ideal - tags and explanations remain available, but are not perceived as the main component of the illustration, keeping the maximum information provided by the main image.

This suggests a solution that will ensure the shortest length of footnotes and their monotony. Thus, a person who can distinguish and filter out unwanted patterns will quickly learn not to notice minor details. In addition, the transition from oblique to horizontal lines looks quite logical (remember about anti-aliasing and additional loss of details). One of the possible solutions is as follows:

In this case, the label placement algorithm becomes much simpler, and the result is more predictable. As you can see, the style of placement of explanations will be similar even for very different images, which, I dare to suggest, will have a positive effect on the impression of viewing dozens of “annotated” illustrations.

I hope this material was not interesting. I will formulate the final question as follows:

Should a programmer always remain a programmer?

Everyone decides for himself. Interesting and useful thoughts, as usual, are welcome in the comments.

The initial question on stackoverflow