3

私は処理中に独自のスケッチを作成し、次のようにprocessingjsとajaxを使用してページに挿入しました。

$.getScript("js/libs/processingjs.js", function() {
    $('#sketch').each(function() {
        Processing.loadSketchFromSources(this, [$(this).data('processing-sources')]);

    });
});

これがキャンバス#sketchが参照しているものです：

<canvas data-processing-sources="first-sketch.pde" id='sketch'></canvas>

これは機能しますが、Javascriptを使用してスケッチを操作したいとも思います。（firebug）コンソールにこれを入力すると、すべてがうまく機能します。

var sketch = Processing.getInstanceById('sketch');
sketch.addTweet(30, 30, 100);

（addTweetはスケッチの関数であり、スケッチがロードされると使用可能になります）しかし、次のようにjavascript内に配置すると次のようになります。

$.getScript("js/libs/processingjs.js", function() {
    $('#sketch').each(function() {
        Processing.loadSketchFromSources(this, [$(this).data('processing-sources')]);


        var sketch = Processing.getInstanceById('sketch');
        sketch.addTweet(30, 30, 100);

    });
});

エラーが発生します：

Uncaught TypeError: Cannot call method 'addTweet' of undefined

スケッチはこの時点ではロードされていないと思いますが、ロードされたコードを実行するためのコールバックまたは適切な方法はありますか？

scriptタグにprocessingjslibを含めると、同じエラーが発生します。jQuery.readyでコードを実行します。

4

2 に答える 2

1

これが私のプロジェクトのためにまとめたものです。それはきれいではありませんが、それは仕事を成し遂げます（今のところ）。

var timer = 0,
    timeout = 3000,
    mem = setInterval(function () {
        var sketch = Processing.getInstanceById("processingCanvas");
        if (sketch) {
            console.log("SKETCH HAS LOADED");
            clearInterval(mem);
        } else {
            timer += 10;
            if (timer > timeout) {
                console.log("FAILED TO LOAD SKETCH");
                clearInterval(mem);
            }
        }
    }, 10);
于 2012-08-24T05:13:05.333 に答える
0

問題は、loadSketchFromSourcesが同期していないことです。

loadSketchFromSources関数にコールバック（github、最新）が追加されました。したがって、次のようにコードを記述できます。

$.getScript("js/libs/processingjs.js", function() {
    $('#sketch').each(function() {
        Processing.loadSketchFromSources(this, [$(this).data('processing-sources')], function(sketch) {
          sketch.addTweet(30, 30, 100);
        });
    });
});

IDの代わりにクラスを使用することもできます。コールバックでスケッチを取得すると、を使用する必要はありませんgetInstanceById。

于 2015-09-24T05:45:32.257 に答える