建立一个更好的技术雷达

Zalando has more than 200 engineering teams, which regularly face tricky technology choices. To help them make good decisions, we created the Zalando Tech Radar as a "navigation" tool. Inspired by ThoughtWorks, it assigns each technology to one of four rings — Adopt, Trial, Assess and Hold — which represents the current consensus within Zalando. At the same time, the Tech Radar also serves as platform to share experience around relevant technologies and as a public showcase of technology adoption within Zalando.

Zalando有200多个工程团队，他们经常面临棘手的技术选择。为了帮助他们做出正确的决定，我们创建了Zalando技术雷达作为一个 "导航 "工具。受ThoughtWorks的启发，它将每项技术分配到四个环中的一个--采用、试用、评估和保留，这代表了Zalando内部目前的共识。同时，技术雷达也是分享相关技术经验的平台，也是Zalando内部技术采用情况的公开展示。

The problem

问题所在

How do you auto-generate a radar-like chart? At first, this seems trivial. Each technology (or "blip", in radar speak) is assigned to exactly one quadrant and one ring, resulting in 16 ring segments in total. But arranging blips inside each segment — in a way that looks "natural" — is surprisingly hard.

如何自动生成一个类似雷达的图表？起初，这似乎是微不足道的。每项技术（或雷达术语中的 "闪点"）都被精确地分配到一个象限和一个环中，总共有16个环段。但是，以一种看起来很 "自然 "的方式在每个区段内安排闪光点是令人惊讶的困难。

Our old approach

我们的旧方法

When we first published the Tech Radar in 2015, we researched how others had solved the layout problem, and found radar.js from Brett Dargan. This script uses polar coordinates, where each position is defined "by a distance from a reference point and an angle from a reference direction”. Polar coordinates make it easy to express the boundaries of ring segments in code. The script utilizes the popular D3.js library to render SVG — a vector graphics format that is supported by modern browsers.

当我们在2015年首次发布技术雷达时，我们研究了其他人是如何解决布局问题的，并发现了来自Brett Dargan的radar.js。这个脚本使用极坐标，其中每个位置都是 "通过与参考点的距离和与参考方向的角度 "来定义的。极坐标使得在代码中表达环形段的边界变得容易。该脚本利用流行的D3.js库来渲染SVG--一种现代浏览器所支持的矢量图形格式。

So far, so good, but we still need to arrange blips inside each segment. We tried some heuristics like evenly spacing the blips, or alternating between two rows. But in the end, the layout either looked very rigid a...