拉斐尔将元素放在右边，并在那里缩放

Raphael position element right and scale it there

本文关键字：右边 在那里 缩放 元素      更新时间：2023-09-26

我遇到了一个问题，找不到任何解决方案。

var sunSmallSet = RAF.paper.set();
var sunSet = RAF.paper.set();
RAF.paper.importSVG(RAFSVG.sunsmall(), sunSmallSet);
RAF.paper.importSVG(RAFSVG.sunfull(), sunSet);
sunSmallSet.transform("t62, 62");
sunSet.transform("t62, 62");
var anim = Raphael.animation({transform: "s0.8 0.8"}, "2000", function(){
    sunSet.animate(animBack);
});
var animBack = Raphael.animation({transform: "s1 1"}, "2000", function(){
    sunSet.animate(anim);
});
sunSet.animate(anim);
  1. 上部变换用于将两个太阳平移到它们的位置
  2. 通过动画中的变换，我尝试在当前位置缩放太阳

发生的事情是太阳正在移回0，0的位置。

下面是一个简化的示例：jsfiddle.net/vX4C9

当您查看Raphael Element.transform文档时，您会了解到用于动画的转换是对目标执行的累积操作集，每次再次转换时都会重置这些操作。这意味着，一旦应用了一个转换（即t62 62），就会用下一个转换覆盖它（s.8 .8）。

如果不想将圆移回其原始位置，则需要预先完成已执行的平移。这可以通过在动画中预先添加t62 62来完成，比如：

var anim = Raphael.animation({transform: "t62 62 s.8 .8"}, "2000", function(){
  circle.animate(animBack);
});

这把小提琴以适当的方式固定了你的例子，并在第一次翻译后将圆圈放在原来的位置上缩放。我冒昧地把它从s.8 .8-s1 1改为s1 1-s2 2，以此来强调规模运算。

相关文章：