javascript - 如何知道何时加载processingjs草图？

我已经在处理中编写了自己的草图，并使用processingjs和ajax将其插入页面中，如下所示:

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

    });
});

这是 Canvas #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标记中包含processingjs库时，我收到相同的错误。并在jQuery.ready上运行代码。

最佳答案

这是我为我的一个项目整理的东西。它不是很漂亮，但是可以完成工作(目前)。

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);