【问题标题】:paper.js onFrame method doesn't workpaper.js onFrame 方法不起作用
【发布时间】:2013-07-30 12:20:42
【问题描述】:

我正在尝试学习一些 paper.js,它的 onFrame event 不适用于我:( 在下面的代码中,我在画布上创建了 30 个随机形状,并尝试通过 onFrame 方法旋转每个形状,但没有发生任何事情,路径是固定的。

var len = 30;
var array = new Array();
var rand;
var colors = ['#fbff00', '#99ff37', '#00eeff', '#374afe', '#ff005e'];
for(var i = 0; i < len; i++) {      
    rand = getRandom(0, 4);
    switch (rand) {
        case 0: // if 0, create circle
            var path = new Path.Circle({
                center: [getRandom(30, scrwidth - 30), getRandom(30, scrheight - 30)],
                radius: 30
            });
            path.fillColor = colors[getRandom(0, 4)];
            array.push(path);
            break;
//and some others in the same way
    }
}
function getRandom(min, max) {
    return Math.floor(Math.random() * (max - min + 1)) + min;
}
function onFrame(event) {
    for (var i = 0; i < len; i++) {
        var item = project.activeLayer.children[i];         
        item.rotate(3);
    }
}
paper.view.draw();

【问题讨论】:

    标签: javascript paperjs


    【解决方案1】:

    我已经完成了! 代码应该以这种方式结束:

    view.onFrame = function(event) { 
        for (var i = 0; i < len; i++) { 
            var item = project.activeLayer.children[i]; 
            item.rotate(3); 
        } 
    } 
    paper.view.draw();
    

    【讨论】:

    • 这行得通,因为这是正确的方法当你使用纯js而不是paperscript。
    • 从哪里获得视图变量? paper.view.onFrame = function(){} 似乎没有这样做。
    • 如果您在运行任何其他代码之前调用paper.install(window);,纸对象将被复制到全局范围,您可以直接从view 对象访问。我相信这里的最后一行应该是view.draw();,尽管在初始调用draw 之后没有必要调用它,因为onFrame 函数会在自动执行后重绘。
    猜你喜欢
    • 2016-08-15
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2016-05-25
    相关资源
    最近更新 更多