SVG - 所有浏览器中的圆圈标记大小不同（IE11）

Question

我尝试在<path>元素的末尾添加一个小圆圈标记但是在IE11中注意到它的大小不同，但是Chrome，Firefox，Edge有＆＃34;正确＆＃34;尺寸。示例：Codepen（在下面的编辑中更新）

<svg viewbox="0 0 100 100">
    <path
      stroke="#ffff00"
      fill-opacity="0"
      marker-start="url(#marker)"
      stroke-width="4"
      d="M 50 98 A 48 48 0 0 0 50 2"
    />

   <marker id="marker" refX="5" refY="5" markerWidth="100" markerHeight="100">
     <circle class="marker" fill="#ff0000" cx="5" cy="5" r="1.5" />
   </marker>
</svg>

我还注意到没有应用填充 - 图像显示Chrome（左）和IE11（右）之间的比较：

有人知道这个的原因吗？

编辑：我已根据@vals建议更新了包含stroke和stroke-width属性的codepen：Updated Codepen

stroke="#ff0000" stroke-width="0"

Answer 1

嗯，事实证明你所需要的只是设置stroke-width =“0”，这似乎是其他浏览器中的默认设置，IE

.svg-container {
  width: 300px;
  height: 300px;
  margin: 0 auto;
}

svg {
  overflow: visible;
}

<div class="svg-container">
  <svg viewbox="0 0 100 100">
    <path
          stroke="#ffff00"
          fill-opacity="0"
          marker-start="url(#marker)"
          stroke-width="4"
          d="M 50 98 A 48 48 0 0 0 50 2"
      />

    <marker id="marker" refX="5" refY="5" markerWidth="100" markerHeight="100">
      <circle class="marker" fill-opacity="1" stroke-width="0" fill="#ff0000" cx="5" cy="5" r="1.5" />
    </marker>
  </svg>
</div>