Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix some svg issues #3212

Open
RustGrow opened this issue Nov 13, 2024 · 0 comments
Open

Fix some svg issues #3212

RustGrow opened this issue Nov 13, 2024 · 0 comments

Comments

@RustGrow
Copy link

RustGrow commented Nov 13, 2024

Problem

Korean flag

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" id="flag-icons-kr" viewBox="0 0 640 480">
  <defs>
    <clipPath id="kr-a">
      <path fill-opacity=".7" d="M-95.8-.4h682.7v512H-95.8z"/>
    </clipPath>
  </defs>
  <g fill-rule="evenodd" clip-path="url(#kr-a)" transform="translate(89.8 .4)scale(.9375)">
    <path fill="#fff" d="M-95.8-.4H587v512H-95.8Z"/>
    <g transform="rotate(-56.3 361.6 -101.3)scale(10.66667)">
      <g id="kr-c">
        <path id="kr-b" fill="#000001" d="M-6-26H6v2H-6Zm0 3H6v2H-6Zm0 3H6v2H-6Z"/>
        <use xlink:href="#kr-b" width="100%" height="100%" y="44"/>
      </g>
      <path stroke="#fff" d="M0 17v10"/>
      <path fill="#cd2e3a" d="M0-12a12 12 0 0 1 0 24Z"/>
      <path fill="#0047a0" d="M0-12a12 12 0 0 0 0 24A6 6 0 0 0 0 0Z"/>
      <circle cy="-6" r="6" fill="#cd2e3a"/>
    </g>
    <g transform="rotate(-123.7 191.2 62.2)scale(10.66667)">
      <use xlink:href="#kr-c" width="100%" height="100%"/>
      <path stroke="#fff" d="M0-23.5v3M0 17v3.5m0 3v3"/>
    </g>
  </g>
</svg>

Chinese flag

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" id="flag-icons-cn" viewBox="0 0 640 480">
  <defs>
    <path id="cn-a" fill="#ff0" d="M-.6.8 0-1 .6.8-1-.3h2z"/>
  </defs>
  <path fill="#ee1c25" d="M0 0h640v480H0z"/>
  <use xlink:href="#cn-a" width="30" height="20" transform="matrix(71.9991 0 0 72 120 120)"/>
  <use xlink:href="#cn-a" width="30" height="20" transform="matrix(-12.33562 -20.5871 20.58684 -12.33577 240.3 48)"/>
  <use xlink:href="#cn-a" width="30" height="20" transform="matrix(-3.38573 -23.75998 23.75968 -3.38578 288 95.8)"/>
  <use xlink:href="#cn-a" width="30" height="20" transform="matrix(6.5991 -23.0749 23.0746 6.59919 288 168)"/>
  <use xlink:href="#cn-a" width="30" height="20" transform="matrix(14.9991 -18.73557 18.73533 14.99929 240 216)"/>
</svg>

When using the dx translate command, you must get the r#use tag, but translates to the use keyword

image
image
image

Dioxus version: dioxus 0.6.0-alpha.4 (c1f3a68)
Rust version: rustc 1.82.0 (f6e511eec 2024-10-15)
OS info: Windows 11 Pro, OS build: 22631.4391
VS Code: 1.91.1
App platform: web

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant