kineticjs - 获取文本的实际宽度（以像素为单位）

Question

如何在 KineticJS 中实现主题目标？如果我使用对象的任何一个.getWidth()或.getTextWidth()方法Text，给定的数量是所有字母宽度的总和。它不计算字母之间的空间。因此，我无法获得显示文本的确切宽度。我已经看到有一个涉及一些屏幕指标类的解决方案，但也许有一个更简单的解决方案？

Answer 1

有很多方法可以满足您的需求，但是...

此函数将使用画布获取以像素为单位的文本宽度

function getTextWidth(font,text){
    var canvas=document.createElement(“canvas”);
    var ctx=canvas.getContext(“2d”);
    ctx.font=font;    // for example “14pt Verdana”;
    var measure=ctx.measureText(text);
    return(measure.width);
}

Answer 2

您不能简单地将隐藏元素附加到正文并检查他生成的宽度吗？

使用 jQuery：

element = $('<span />').addClass('hide').text('some dummy text');
element.appendTo('body');
console.log(element.width());

不确定我是否很好地理解了这个问题，也不确定它是否适用于画布元素。