flow.svg · smile1979/X6 - Gitee.com

forked from antv / X6

加入 Gitee

与超过 1200万开发者一起发现、参与优秀开源项目，私有仓库也完全免费：）

克隆/下载

flow.svg 2.08 KB

<svg width="274" height="195" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
  <g fill="none" fill-rule="evenodd">
    <path id="path1" stroke="#000" stroke-width="3" stroke-linecap="square" d="M 137.5 50.5 L 137.5 131.5 L 60.5 131.5 L 60.5 213.5">
      <set attributeName="stroke-dasharray" to="3 6" begin="0;a1.end+5s" dur="3s" />
      <animate
        id="a1"
        attributeType="XML"
        attributeName="stroke-dashoffset"
        from="0"
        to="-200"
        dur="3s"
        begin="0;a1.end+5s"/>
    </path>
    <path id="path2" stroke="#000" stroke-width="3" stroke-linecap="square" d="M 137.5 50.5 L 137.5 131.5 L 214.5 131.5 L 214.5 213.5">
      <set attributeName="stroke-dasharray" to="3 6" begin="0;a1.end+5s" dur="3s" />
      <animate
        attributeType="XML"
        attributeName="stroke-dashoffset"
        from="0"
        to="-200"
        dur="3s"
        begin="0;a1.end+5s"/>
    </path>
    <circle id="token1" fill="#9F62F6" r="5.5" opacity="0">
      <set attributeName="opacity" to="1" begin="a1.end+1s" dur="3s" />
      <animateMotion dur="3s" begin="a1.end+1s" rotate="auto">
        <mpath xlink:href="#path1"/>
      </animateMotion>
    </circle>
    <circle id="token2" fill="#9F62F6" r="5.5" opacity="0">
      <set attributeName="opacity" to="1" begin="a1.end+1s" dur="3s" />
      <animateMotion dur="3s" begin="a1.end+1s" rotate="auto">
        <mpath xlink:href="#path2"/>
      </animateMotion>
    </circle>
    <g transform="translate(77)">
      <rect stroke="#000" stroke-width="3" fill="#9F62F6" x="1.5" y="1.5" width="118" height="46" rx="8"/>
      <text font-family="Avenir-Heavy, Avenir" font-size="24" font-weight="600" fill="#FFF">
        <tspan x="45" y="32">X6</tspan>
      </text>
    </g>
    <rect stroke="#000" stroke-width="3" fill="#FF8B38" x="78.5" y="66.5" width="118" height="46" rx="8"/>
    <rect stroke="#000" stroke-width="3" fill="#FFB451" x="1.5" y="147.5" width="118" height="46" rx="8"/>
    <rect stroke="#000" stroke-width="3" fill="#FFB451" x="154.5" y="147.5" width="118" height="46" rx="8"/>
  </g>
</svg>

一键复制原始数据按行查看历史

提交于 2020-12-18 15:10 . docs: 📚️ embed flow.svg

TypeScript

1

https://gitee.com/smile1979/X6.git

git@gitee.com:smile1979/X6.git

smile1979

X6

X6

master