在Javascript中协调虚线字体

Question

受此tutorial的启发，

• 绘制“Google”字样
• 以许多手动定位的圆/球（1）的形式
• 在html5画布上，

在1）例如这是'o'

new Ball(210, 81, 0, 0, red);
new Ball(197, 91, 0, 0, red);
new Ball(196, 103, 0, 0, red);
new Ball(200, 116, 0, 0, red);
new Ball(209, 127, 0, 0, red);
new Ball(223, 130, 0, 0, red);
new Ball(237, 127, 0, 0, red);
new Ball(244, 114, 0, 0, red);
new Ball(242, 98, 0, 0, red);
new Ball(237, 86, 0, 0, red);
new Ball(225, 81, 0, 0, red);

我想知道，如果有一种方法可以更自动地定义圆圈的坐标。例如，有没有办法从字体路径中获取位置？

编辑：我的目标是至少映射所有常规字母（两种情况）和数字，最少62个字符。

cont：偶然发现这个问题的人可能也想参加这个one。

Answer 1

  

有没有办法从字体路径中导出位置？

不在画布中或使用画布命令。

有各种程序可以将字体转换为SVG路径。

但是你不能只使用SVG路径的点，因为，例如，贝塞尔曲线仅由3个点描述，但可能占圆的1/4。从这些路径中有一些算法可以将路径分解为一系列点（即“Q”将成为描述圆和线的100个点。）

您应该能够轻松地搜索这些单独的部分。

最简单的方法是，从像素字体（like this）开始，将每个黑色像素设为一个点。当然，你不会得到非常好的解决方案，但它应该比较容易。