在没有HTML元素的JavaScript中基于像素宽度截断文本

时间:2013-07-15 07:31:01

标签: javascript string rhino truncate

我们有一个与Rhino JavaScript引擎集成的系统。 我们可以上传JavaScript文件来处理某些数据集。

我需要根据像素宽度截断字符串,以避免它扩展有限大小的框。 但是不可能对字符长度进行硬编码,因为长度取决于字符。

如果这是一个普通的基于浏览器的HTML应用程序,我可以使用SPAN或DIV宽度的帮助来编写一个函数。但在我的情况下,我不能使用任何HTML元素。所以我计划通过保持每个字符的像素宽度数组来编写函数。 (在我的情况下,我只需要Arial Normal 10px)。

但我找不到获取Arial像素宽度的资源。 任何人都可以分享一个很好的链接吗?

如果您知道更好或更简单的解决方案,请告诉我。

1 个答案:

答案 0 :(得分:0)

找到解决方案:-) 我以编程方式编写了宽度数组。

在C#中,我使用了MeasureString()方法

    Font stringFont = new Font("Arial", 10);
        String s="";
        for (int i = 1; i < 256; i++) {
            Char c = (char)i;
            s = s + "widths[" + i + "]=" + CreateGraphics().MeasureString(c.ToString(), stringFont).Width.ToString() + ";\n";
        }
        MessageBox.Show(s);

它生成了我在我的JavaScript中使用的这个数组。

var widths = new Array();
widths[1]=19.54427;
widths[2]=4.440104;
widths[3]=4.440104;
widths[4]=4.440104;
widths[5]=4.440104;
widths[6]=4.440104;
widths[7]=4.440104;
widths[8]=4.440104;
widths[9]=57.77343;
widths[10]=4.440104;
widths[11]=4.440104;
widths[12]=4.440104;
widths[13]=4.440104;
widths[14]=4.440104;
widths[15]=4.440104;
widths[16]=4.440104;
widths[17]=4.440104;
widths[18]=4.440104;
widths[19]=4.440104;
widths[20]=4.440104;
widths[21]=4.440104;
widths[22]=4.440104;
widths[23]=4.440104;
widths[24]=4.440104;
widths[25]=4.440104;
widths[26]=4.440104;
widths[27]=4.440104;
widths[28]=4.440104;
widths[29]=4.440104;
widths[30]=4.440104;
widths[31]=4.440104;
widths[32]=4.444443;
widths[33]=8.259547;
widths[34]=9.320745;
widths[35]=12.08116;
widths[36]=12.08116;
widths[37]=16.65798;
widths[38]=13.6046;
widths[39]=7.068141;
widths[40]=9.014755;
widths[41]=9.014755;
widths[42]=9.789495;
widths[43]=12.46528;
widths[44]=8.259547;
widths[45]=9.014755;
widths[46]=8.259547;
widths[47]=8.259547;
widths[48]=12.08116;
widths[49]=12.08116;
widths[50]=12.08116;
widths[51]=12.08116;
widths[52]=12.08116;
widths[53]=12.08116;
widths[54]=12.08116;
widths[55]=12.08116;
widths[56]=12.08116;
widths[57]=12.08116;
widths[58]=8.259547;
widths[59]=8.259547;
widths[60]=12.46528;
widths[61]=12.46528;
widths[62]=12.46528;
widths[63]=12.08116;
widths[64]=18.38324;
widths[65]=13.6046;
widths[66]=13.6046;
widths[67]=14.35981;
widths[68]=14.35981;
widths[69]=13.6046;
widths[70]=12.83637;
widths[71]=15.12804;
widths[72]=14.35981;
widths[73]=8.259547;
widths[74]=11.31293;
widths[75]=13.6046;
widths[76]=12.08116;
widths[77]=15.88324;
widths[78]=14.35981;
widths[79]=15.12804;
widths[80]=13.6046;
widths[81]=15.12804;
widths[82]=14.35981;
widths[83]=13.6046;
widths[84]=12.83637;
widths[85]=14.35981;
widths[86]=13.6046;
widths[87]=17.40668;
widths[88]=13.6046;
widths[89]=13.6046;
widths[90]=12.83637;
widths[91]=8.259547;
widths[92]=8.259547;
widths[93]=8.259547;
widths[94]=10.88976;
widths[95]=12.08116;
widths[96]=9.014755;
widths[97]=12.08116;
widths[98]=12.08116;
widths[99]=11.31293;
widths[100]=12.08116;
widths[101]=12.08116;
widths[102]=8.259547;
widths[103]=12.08116;
widths[104]=12.08116;
widths[105]=7.497828;
widths[106]=7.497828;
widths[107]=11.31293;
widths[108]=7.497828;
widths[109]=15.88324;
widths[110]=12.08116;
widths[111]=12.08116;
widths[112]=12.08116;
widths[113]=12.08116;
widths[114]=9.014755;
widths[115]=11.31293;
widths[116]=8.259547;
widths[117]=12.08116;
widths[118]=11.31293;
widths[119]=14.35981;
widths[120]=11.31293;
widths[121]=11.31293;
widths[122]=11.31293;
widths[123]=9.034286;
widths[124]=8.012151;
widths[125]=9.034286;
widths[126]=12.46528;
widths[127]=4.440104;
widths[128]=4.440104;
widths[129]=4.440104;
widths[130]=11.99219;
widths[131]=11.99219;
widths[132]=4.440104;
widths[133]=4.440104;
widths[134]=11.99219;
widths[135]=11.99219;
widths[136]=9.941405;
widths[137]=16.25651;
widths[138]=11.74479;
widths[139]=11.99219;
widths[140]=19.51823;
widths[141]=4.440104;
widths[142]=4.440104;
widths[143]=4.440104;
widths[144]=4.440104;
widths[145]=7.467447;
widths[146]=7.467447;
widths[147]=10.78125;
widths[148]=10.78125;
widths[149]=4.440104;
widths[150]=12.46745;
widths[151]=19.45963;
widths[152]=9.54427;
widths[153]=18.49609;
widths[154]=9.941405;
widths[155]=8.216145;
widths[156]=12.83203;
widths[157]=4.440104;
widths[158]=4.440104;
widths[159]=15;
widths[160]=4.444443;
widths[161]=9.014755;
widths[162]=12.08116;
widths[163]=12.08116;
widths[164]=12.08116;
widths[165]=12.08116;
widths[166]=8.012151;
widths[167]=12.08116;
widths[168]=9.014755;
widths[169]=14.56163;
widths[170]=9.529078;
widths[171]=12.08116;
widths[172]=12.46528;
widths[173]=4.440104;
widths[174]=14.56163;
widths[175]=12.02908;
widths[176]=9.939235;
widths[177]=11.98351;
widths[178]=9.014755;
widths[179]=9.014755;
widths[180]=9.014755;
widths[181]=12.3546;
widths[182]=11.82074;
widths[183]=9.014755;
widths[184]=9.014755;
widths[185]=9.014755;
widths[186]=9.457463;
widths[187]=12.08116;
widths[188]=15.89627;
widths[189]=15.89627;
widths[190]=15.89627;
widths[191]=12.83637;
widths[192]=13.6046;
widths[193]=13.6046;
widths[194]=13.6046;
widths[195]=13.6046;
widths[196]=13.6046;
widths[197]=13.6046;
widths[198]=18.17491;
widths[199]=14.35981;
widths[200]=13.6046;
widths[201]=13.6046;
widths[202]=13.6046;
widths[203]=13.6046;
widths[204]=8.259547;
widths[205]=8.259547;
widths[206]=8.259547;
widths[207]=8.259547;
widths[208]=14.35981;
widths[209]=14.35981;
widths[210]=15.12804;
widths[211]=15.12804;
widths[212]=15.12804;
widths[213]=15.12804;
widths[214]=15.12804;
widths[215]=12.46528;
widths[216]=15.12804;
widths[217]=14.35981;
widths[218]=14.35981;
widths[219]=14.35981;
widths[220]=14.35981;
widths[221]=13.6046;
widths[222]=13.6046;
widths[223]=12.83637;
widths[224]=12.08116;
widths[225]=12.08116;
widths[226]=12.08116;
widths[227]=12.08116;
widths[228]=12.08116;
widths[229]=12.08116;
widths[230]=16.65798;
widths[231]=11.31293;
widths[232]=12.08116;
widths[233]=12.08116;
widths[234]=12.08116;
widths[235]=12.08116;
widths[236]=8.259547;
widths[237]=8.259547;
widths[238]=8.259547;
widths[239]=8.259547;
widths[240]=12.08116;
widths[241]=12.08116;
widths[242]=12.08116;
widths[243]=12.08116;
widths[244]=12.08116;
widths[245]=12.08116;
widths[246]=12.08116;
widths[247]=11.98351;
widths[248]=12.83637;
widths[249]=12.08116;
widths[250]=12.08116;
widths[251]=12.08116;
widths[252]=12.08116;
widths[253]=11.31293;
widths[254]=12.08116;
widths[255]=11.31293;

最后这是我的JavaScript函数。

function smartTruncate(str,maxLen){
var widths = new Array();
widths[1]=19.54427;
//Assigning all above values

var len = 0;
for ( i =0; i < str.length ; i++){
var ascii = str.charCodeAt(i);
    len = len + widths[ascii];
    if (len>maxLen) {
        if(i==0) {
            i=1;
        }
        str = str.substring(0, i-1);
        break;
    }
}
    return str;
}