放大 SVG 的某些部分

Question

我试图让火箭在基地着火，这样看起来火正在燃烧。

我想做的是扩大火的高度，然后再次降低它，这样我看起来就像在燃烧一样。

我有 SVG 图像并使用关键帧来做到这一点。

.fire{
  animation: fire_effect 1s infinite;
}          
@keyframes fire_effect 
{
  0%   {transform: scale(1,1);}
  100% {transform:scale(1,1.5);}
}

但它并没有被放大，事实上它正在下降。请帮助我如何增加火的高度。
我有一支密码笔，在这里http://codepen.io/eugeneprateek/pen/WwqVaE

Answer 1

在这种情况下，只需使用transform-origin: top;。

我尝试过在你的笔里面，它可以按照你想要的正常工作。

Answer 2

您无法在"g"标签上添加样式效果，请尝试在"g"标签内的两个"多边形"标签上移动类分配