文本图标SVG文件的透明度问题

Question

我正在尝试使用Adobe Fireworks创建一个简单的SVG图标（复合路径）。 图标应包含一个圆圈，其中心有一个字母。 圆的背景应该是透明的，但那应该是圆的轮廓颜色。 当我尝试使用Join将两个元素合并为复合路径时，文本填充将丢失。

图标应该是单个复合路径，因为它需要在我的Javafx应用程序中导入。

我正在附加为了解问题而创建的预期图标和当前图标

任何可能的解决方案都会非常有用 提前致谢

Answer 1

尝试将其作为网址：

data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpdGR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiB2aWV3Qm94PSIwIDAgNDAgNDAiPjxjaXJjbGUgY3g9IjIwIiBjeT0iMjAiIHI9IjEwIiBzdHlsZT0iZmlsbDpncmF5O3N0cm9rZTpibGFjayIgLz48dGV4dCBzdHlsZT0iZm9udC1zaXplOjJwdDt0ZXh0LWFuY2hvcjptaWRkbGUiPjx0c3BhbiB4PSIyMCIgeT0iMjAiPkhlbGxvPC90c3Bhbj48L3RleHQ+PC9zdmc+

或者

data:image/svg+xml,<svg%20xmlns="http://www.w3.org/2000/svg"%20witdth="100%"%20height="100%"%20viewBox="0%200%2040%2040"><circle%20cx="20"%20cy="20"%20r="10"%20style="fill:gray;stroke:black"%20/><text%20%20style="font-size:2pt;text-anchor:middle"%20><tspan%20x="20"%20y="20"%20>Hello</tspan></text></svg>

那是：

<svg xmlns="http://www.w3.org/2000/svg"
     style="background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUAQMAAAC3R49OAAAABlBMVEVVVVXMzMyYLOZdAAAAFElEQVQImWP4f4CBgRjMYP+BGAwABZEdTZl/JU4AAAAASUVORK5CYII=)"
     witdth="100%" height="100%" viewBox="5 5 35 35">
  <circle cx="20" cy="20" r="10" style="fill:gray;stroke:black" />
  <text style="font-size:2pt;text-anchor:middle">
    <tspan x="20" y="21">
      Hello
    </tspan>
  </text>
</svg>