1

このRaphaelチュートリアル[ http://www.html5rocks.com/en/tutorials/raphael/intro/ ]が行うことを実行し、.printで印刷された文字列から個々の文字を選択しようとしましたが、喜びはありませんでした。

フォントをcufonで生成し、Cufon.registerFontをRaphael.registerFontに置き換えました

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

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

labelは単なるパスであり、パスの配列ではないため、エラーが発生します。何が得られますか?

前もって感謝します

4

2 に答える 2

1

ええ、これは間違いなく1.4と2.0の間の動作の変更であり、複数の状況で役立つ機能のビットです。

一方、配列結果機能の複製は、Raphael2.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;
}

これは完璧なコードではありませんが、少し改良すれば簡単にギャップを埋めることができます。

于 2012-08-09T16:46:41.740 に答える
0

バグか2.1の機能のようです-GitHubから1.4を入手しましたが、期待どおりに機能します。他の人に役立つかもしれないので、誰かがこれにこれ以上光を当てることができる場合に備えて、質問をしばらく開いたままにしておきます。

于 2012-08-09T14:57:12.130 に答える