html字符串间距,弧形文本中字符串字符之间的间距不太正确。 （HTML Canvas）的...

绘制文本块...

function draw_arc_text(ctx, str, radius){

ctx.save();

str = str.toUpperCase();

var radians_per_letter = 8 * Math.PI/180;

ctx.rotate((105 - (radius/60)) * Math.PI/180);

for (var n = 0; n < str.length; n++) {

ctx.save();

ctx.rotate(n * radians_per_letter);

ctx.fillText(str[n], 0, -radius);

ctx.restore();

}

ctx.restore();

}

正如你可能会告诉文字之间的间距上的彩色光盘的顶部有点偏离。我试过每个字母有一定数量的弧度/度数，但是半径越大，间距越大，所以最外面的文本开始快速分离。我也尝试过制定一些公式，将半径纳入每个字母得到多少间距，但我似乎无法得到相当好的结果。有人有主意吗？

此外，效率的任何调整也将不胜感激。我喜欢尽可能地尽可能优化。

+0

不知道如何帮助你，但很酷的应用程序！ –

+0

阿哈也想这样做。你能提供一个小提琴吗？查看代码并运行应用程序会更容易。我不想打开你的源代码。对于调整，去代码审查。有一些int，如2.0 * Math.PI，它可能是一个变量 –

+0

您可以使用'context.measureText('A')。width'获得每个字符的宽度。圆的圆周是'2 * Math.PI * radius'。所以，你需要为每个角色转换的角度(如果我今天早上想清楚的话)'charWidth /(2 * Math.PI * radius)' –