以像素为单位获取文本的实际宽度

时间:2013-06-24 15:26:55

标签: kineticjs

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

2 个答案:

答案 0 :(得分:2)

有很多方法可以做你需要的,但是......

此函数将使用画布

获取文本宽度(以像素为单位)
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);
}

答案 1 :(得分:1)

难道你不能简单地将一个隐藏元素附加到正文并检查他生成的宽度吗?

使用jQuery:

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

不确定我是否理解了这个问题,并且不确定它是否适用于画布元素。