0

我有我用 raphael.js 创建的这两个 var abjects，我试图将这两个变量传递给第三个变量，但不知道如何去做。该脚本应该根据对象的类（.awesome，whole）调整对象的大小到它自己的画布中。我创建了一个http://jsfiddle.net/creativestudio/7uUgz/

变量 1

/* ==|== AWESOME SMILE STARTS
/* ==|================================= */
    var awesome = paper.set();
    awesome.push(
        paper.circle(75, 75, 75).attr(awesomeGradient),
        paper.circle(75, 75, 67).attr(silverGradient),
        paper.circle(75, 75, 63).attr(gray),
        paper.circle(75, 75, 58).attr(silverGradient),
        paper.circle(90, 60, 7).attr(gray),
        paper.circle(60, 60, 7).attr(gray),

// Awesome smile        
    paper.path("M111.271,89.305C105.555,103.75,91.456,114,75,114 c-5.159,0-10.085-1.008-14.596-2.837c1.24-1.665,1.982-3.722,1.982-5.957c0-5.522-4.477-10.001-10-10.001 c-3.251,0-6.132,1.561-7.958,3.963c0,0-0.001-0.001-0.001-0.001c-2.352-2.97-4.282-6.288-5.698-9.865l-4.576,4.576 c2.084,4.503,4.895,8.601,8.274,12.146c3.444,3.617,7.481,6.664,11.959,8.979C60.562,118.195,67.569,120,75,120 c18.107,0,33.708-10.701,40.848-26.12L111.271,89.305z M47.16,102.268c1.03-1.824,2.985-3.062,5.227-3.062c3.309,0,6,2.69,6,6 c0,1.636-0.659,3.117-1.724,4.201h0C53.137,107.518,49.935,105.104,47.16,102.268z").attr(gray),

// Overlay
    paper.path("M75,0C33.578,0,0,33.579,0,75h150C150,33.579,116.422,0,75,0z").attr(overlay)

);// AWESOME SMILE ENDS

变量 2

/* ==|== AWFUL SMILE STARTS
/* ==|================================= */
    var awful = paper.set();
    awful.push(
        paper.circle(75, 75, 75).attr(awfulGradient),
        paper.circle(75, 75, 67).attr(silverGradient),
        paper.circle(75, 75, 63).attr(gray),
        paper.circle(75, 75, 58).attr(silverGradient),

// Left eye
        paper.path("M57.668,63.09l-7.623,4.47c-0.922,0.543-1.238,1.739-0.699,2.676c0.364,0.621,1.013,0.969,1.677,0.969 c0.334,0,0.669-0.086,0.978-0.26l9.799-5.756c0.513-0.303,0.868-0.835,0.942-1.435c0.077-0.603-0.122-1.204-0.552-1.635 l-9.794-9.877c-0.763-0.761-1.989-0.761-2.746,0c-0.752,0.765-0.752,2.001,0,2.767L57.668,63.09z").attr(gray),

// Right eye
        paper.path("M88.204,65.188L98,70.944c0.309,0.174,0.643,0.26,0.975,0.26c0.67,0,1.315-0.348,1.679-0.969 c0.539-0.937,0.227-2.13-0.698-2.676l-7.623-4.47l8.017-8.081c0.757-0.766,0.757-2.002,0-2.767c-0.76-0.761-1.987-0.761-2.741,0 l-9.802,9.874c-0.422,0.434-0.624,1.035-0.547,1.638C87.333,64.354,87.688,64.886,88.204,65.188z").attr(gray),

// Good smile     
        paper.path("M75,95c12.986,0,24.006,8.581,27.688,20.37l4.684-4.684C102.133,97.961,89.615,89,75,89 s-27.133,8.961-32.372,21.687l4.684,4.684C50.994,103.581,62.013,95,75,95z").attr(gray),

// Overlay
        paper.path("M75,0C33.578,0,0,33.579,0,75h150C150,33.579,116.422,0,75,0z").attr(overlay)

);// AWFUL SMILE ENDS

进入这个：

    var bb = awesome.getBBox();
    console.log(bb);
    var w = bb.width;
    var h = bb.height;
    var max = w;
    if (h > max) {
        max = h;
    }
    var scale = s / max;
    var ox = -bb.x+((max-w)/2);
    var oy = -bb.y+((max-h)/2);

    console.log(s+' '+h+' '+bb.y);

    awesome.attr({
        "transform": "s" + scale + "," + scale + ",0,0" + "t" + ox + "," + oy 
    });
4

1 回答 1

0

恭喜，你刚刚升级为程序员。您需要在函数中构建代码。函数重用执行相同操作的代码行，仅使用几个参数。有几种方法可以重组代码，但这里有一个快速版本：

http://jsfiddle.net/emAUh/

你应该很容易掌握，因为你已经用注释清楚地定义了可重用代码的位。而不是这样做：

/* ==|== AWESOME SMILE STARTS
/* ==|================================= */
    var awesome = paper.set();
    // ... draw everything 
// AWESOME SMILE ENDS

你来做这件事：

awesomeSmileGenerator(paper) {
  var awesome = paper.set();
  //draw everthing;
  return awesome;
}

这使您可以稍后执行操作...

var face = awesomeSmileGenerator(paper);
console.log(face); //YOUR SET IS HERE, MAGIC!
于 2012-10-10T23:18:04.090 回答