CSS转换3D - 如果主SVG面向相机，则获取子项

Question

我正在使用GreenSock JS动画库制作动画。在动画中，SVG上有3d变换。

目前的情况是：我有一个更大的SVG（有路径，折线等）动画（三维变换等），我想要一些SVG元素（主SVG的子节点）总是面对“相机” （屏幕），当它们与主SVG一起使用时（例如它们在屏幕上的位置，它们的大小/比例随着变换而变化，但是旋转没有）？

这是一张图片： how it should look like during the animation

我尝试将它们（区号和公路标志）转换为与它们的父（主SVG）进行转换相反的方向，但它似乎只适用于Z轴。

var tl_loc1 = new TimelineMax({
  repeat: -1,
  yoyo: true
});

tl_loc1
  .fromTo($("#City_Glow"), 4, {
    css: {
    scale: 1.3,
      transformPerspective: 200,
      transformStyle: "preserve-3d",
      rotationY: -90,
      rotationX: 60,
      rotationZ: 20,
      opacity: 0,
      top: "-300px",
    }
  }, {
    css: {
      scale: 1,
      transformPerspective: 200,
      transformStyle: "preserve-3d",
      rotationY: 0,
      rotationX: 0,
      rotationZ: 0,
      opacity: 1,
      top: "0",
    }
  })
  .fromTo($(".loc1-cls-7, .loc1-cls-6"), 4, {
    css: {
      transformStyle: "preserve-3d",
      rotationY: 90,
      rotationX: -60,
      rotationZ: -20,
    }
  }, {
    css: {
      transformStyle: "preserve-3d",
      rotationY: 0,
      rotationX: 0,
      rotationZ: 0,
    }
  }, 0);

这是一个codepen：http://codepen.io/mukagergely/pen/QEvyqR

我不知道使用CSS transform3d是否无法实现，GreenSock有一些问题，或者只是我不知道解决方案。