1

我试着做这个 Raphael 教程 [ http://www.html5rocks.com/en/tutorials/raphael/intro/ ] 所做的,并从用 .print 打印的字符串中选择单个字母,但没有乐趣

我已经用 cufon 生成了字体,并用 Raphael.registerFont 替换了 Cufon.registerFont

var paper = Raphael( '#div', 500, 500 ),
    label = paper.print( xCenter, yCenter, 'blah',  paper.getFont("CelliniProMedium"), 54 );

label[1].attr( 'fill', 'red');

导致错误,因为标签只是一个路径而不是路径数组。是什么赋予了?

提前致谢

4

2 回答 2

1

Yeah, this is definitely a change in behavior between 1.4 and 2.0 -- and it's a bit of functionality that came in handy in more than one situation.

On the other hand, replicating the array result functionality is easy to do by extending Raphael 2.0...

Raphael.fn.printArray = function printArray( x, y, string, font, size, letter_spacing, line_height )
{
    var result = [];
    var cx = x, cy = y;        
    size = size || 16;
    letter_spacing = letter_spacing || 0.2;
    line_height = line_height || 1.5;        
    for ( var i = 0; i < string.length; i++ )
    {
        if ( string[i] == " " )
        {
            cx += size;
            continue;
        }
        else if ( string[i] == "\n" )
        {
            cx = x;
            cy += size * line_height;
            continue;
        }
        var glyph = this.print( 0, 0, string[i], font, size ).attr( { opacity: 0 } );
        var glyphBox = glyph.getBBox();
        glyph.attr( { transform: "T" + cx + "," + cy, opacity: 1 } );
        cx += glyphBox.width + ( size * letter_spacing );
        result.push( glyph );
    }
    return result;
}

This isn't perfect code, but with a little refinement it could easily fill the gap.

于 2012-08-09T16:46:41.740 回答
0

所以它看起来像是 2.1 的错误或功能 - 我从 GitHub 获得了 1.4,它按预期工作。暂时保留问题,以防任何人对此有所了解,因为我认为这可能对其他人有用。

于 2012-08-09T14:57:12.130 回答