maptalks.js
maptalks.js copied to clipboard
canvas.measureText result is not right for some charsets
maptalks's version and what browser you use?
v1.0.0-rc.17
Issue description
canvas.measureText result is not right for some charsets


Please provide a reproduction URL (on any jsfiddle like site)
canvas.measureText 当大规模使用时性能比较慢,需要去探索是否有其他更好的方法来解决性能问题
经过探索发现这个库:
https://github.com/deyihu/string-width
优点: 1.性能更好,大概是canvas.measuretext的四倍 2.常用的英文,数字,中文没有是么问题
目前存在的问题
1.emoji计算有问题
2.当文本里包含阿拉伯文,计算不对
3.已经提供了
hasEmoji,
hasArabic 等方法,如果含有特殊字符那就可以退回到canvas.measureText
if (hasEmoji(text) || hasArabic(text)) {
return ctx.measureText(text).width;
}
const len = stringWidth(text, { ambiguousIsNarrow: false });
return len * fontSize / 2;