0

pdf.jsを使用して既存のpdfファイルにKineticJSシェイプを追加しようとしています。私が抱えている問題は、KineticJSが新しいキャンバスを作成し、pdf.jsによって作成されたキャンバスを使用しないことです。KineticJSでpdf.jsキャンバスを参照しようとしましたが、機能しません。2つを統合する方法についてのアイデアはありますか?主な目的は、PDFに注釈を付けることです。

4

1 に答える 1

0

プロセスにあまり詳しくない場合は、.pdfを生成し、キャンバス画像をpdfにロードするためのフックを含むBytescoutを試してみてください。

すべてがクライアント側で行われるため、心ゆくまで表示/編集/表示/編集できます。

それらはここにあります:http: //bytescout.com/products/developer/pdfgeneratorsdkjs/index.html(BTW、ここに売り込みはありません-私はbytescoutにまったく接続していません!)

埋め込まれたキャンバスを示す彼らのウェブサイトからの例は次のとおりです。

function CreatePDF() {

    // create BytescoutPDF object instance
    var pdf = new BytescoutPDF();

    // set document properties: Title, subject, keywords, author name and creator name
    pdf.propertiesSet("Sample document title", "Sample subject", "keyword1, keyword 2, keyword3", "Document Author Name", "Document Creator Name");

    // set page size
    pdf.pageSetSize(BytescoutPDF.A4);

    // set page orientation (BytescoutPDF.PORTRAIT = portrait, BytescoutPDF.LANDSCAPE = landscape)
    pdf.pageSetOrientation(BytescoutPDF.PORTRAIT);

    // add new page
    pdf.pageAdd();

    // create temporary canvas (you can also simply get existing canvas)
    var canvas = document.createElement('canvas');
    // set width and height
    canvas.width = 320;
    canvas.height = 240;

    // get context from canvas (to draw on)
    var context = canvas.getContext("2d");

    // set white background color
    context.fillStyle = "#FFFFFF";
    // and fill the background with white color
    context.fillRect(0, 0, 320, 240);

    // draw the yellow circle
    context.strokeStyle = "#000000";
    context.fillStyle = "#FFFF00";
    context.beginPath();
    context.arc(100, 100, 50, 0, Math.PI * 2, true);
    context.closePath();
    context.stroke();
    context.fill();

    // load image from canvas into BytescoutPDF
    pdf.imageLoadFromCanvas(canvas);

    // place this image at given X, Y coordinates on the page
    pdf.imagePlace(20, 40);


    // return BytescoutPDF object instance
    return pdf;
}
于 2013-03-22T20:25:25.827 に答える