在 svg 元素 g-tag 中滚动

Answer 1

一个可能的解决方案是使用如下例所示的符号。 该符号有一个限制视图的viewBox（您只能看到矩形id =“berthbg-1”）

对于动画，我使用 SMIL 并对文本的 x 属性进行动画处理。您可能想选择不同的解决方案。

由于符号中包含了所有内容，因此您需要将符号与

<use>

元素一起使用。

<svg viewBox="615 368 140 20">
  <symbol viewBox="615.48 369.06 22.77 18" id="SA1A" >
    <rect id="berthbg-1" x="615.48" y="369.06" width="22.77" height="18" transform="translate(1253.74 756.13) rotate(-180)" fill="silver" />
    <text id="indicator" transform="translate(616.11 384.25) scale(.83 1)" x="409" text-anchor="end">
      Hello, How to scroll me in this text inside g tag of svg element?
      
      <animate 
       attributeName="x"
       attributeType="XML"
       from="409" to="0"
       dur="20s"
       repeatCount="indefinite"/>
    </text>
  </symbol>
  <use href="#SA1A" x="615.48" y="369.06" width="22.77" height="18"/>
</svg>