这只是一个怀疑，所以答案可能仍然是不正确的。至少对我来说，jsFiddle错误确实消失了。
这可能是因为Chromium在识别最终图形的边界框方面存在问题，因为它必须考虑笔划的宽度。如果它在这一点上计算错误，它可能会决定一些重复的模式将永远在有效的剪辑路径之外，只是不渲染它们。
解决方案是不使用笔划宽度，而是绘制两个组合的圆形路径：

<div id="root">
  <svg width="100%" viewBox="0 0 40 40" style="background-color: rgb(204, 255, 204);">
    <defs>
      <pattern id="greenglaze" patternUnits="userSpaceOnUse" width="5" height="5">
        <image href="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSyiQU4yEPR1SIEF1mRiFOP1IMFoQ4s8y0vGJTRhRt4CbE4BaOuFEXrwEDWmI8ngIzbk_c&amp;usqp=CAU" width="5" height="5" preserveAspectRatio="none"></image>
      </pattern>
    </defs>
    <path d="M 20 4.135
             A 15.865 15.865 0 0 0 20 35.865
             A 15.865 15.865 0 0 0 20 4.135 z
             M 20 10.035
             A 9.965 9.965 0 0 1 20 29.965
             A 9.965 9.965 0 0 1 20 10.035 z"
          fill="url(#greenglaze)" transform="rotate(-90, 20, 20)" />
    </svg>
</div>

我迟到了，但经过一段时间的检查。据了解，您的circle正在您的“甜甜圈”上进行“切割”。
因为你的image被设置为preserveAspectRatio="none"，它将根据窗口大小调整内容的大小，并触发在图像的侧面剪切。
也许这可能有帮助，但在 * circle* 中使用**stroke-miterlimit**可以解决这个问题。

<div id="root">
  <svg viewBox="0 0 40 40" style="width: 100%; background-color: rgb(204, 255, 204);">
    <defs>
      <pattern id="greenglaze" patternUnits="userSpaceOnUse" width="5" height="5">
        <image href="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSyiQU4yEPR1SIEF1mRiFOP1IMFoQ4s8y0vGJTRhRt4CbE4BaOuFEXrwEDWmI8ngIzbk_c&amp;usqp=CAU" width="5" height="5" preserveAspectRatio="none"></image>
      </pattern>
    </defs>
    <circle cx="20" cy="20" r="11" stroke="url(#greenglaze)" fill="transparent" transform-origin="center" stroke="url(#greenglaze)" stroke-miterlimit="30" stroke-width="7px" stroke-dasharray="100 0" stroke-dashoffset="-0" transform="rotate(-90, 0, 0)"/>
  </svg>
</div>

前面的代码并没有真正解决这个问题。
我的英语不是最好的。
我在这里做了几个测试，我认为解决方案是使用css。

svg {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
        }

<div id="root">
  <svg width="100%" viewBox="0 0 40 40" style="background-color: rgb(204, 255, 204);">
    <defs>
      <pattern id="greenglaze" patternUnits="userSpaceOnUse" width="5" height="5">
        <image href="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSyiQU4yEPR1SIEF1mRiFOP1IMFoQ4s8y0vGJTRhRt4CbE4BaOuFEXrwEDWmI8ngIzbk_c&amp;usqp=CAU" 
               width="5" 
               height="5" 
               preserveAspectRatio="none"></image>
      </pattern>
    </defs>
    <circle cx="20" 
            cy="20" 
            r="12.91549430918954" 
            fill="transparent" 
            transform-origin="center" 
            stroke="url(#greenglaze)" 
            stroke-width="7.9" 
            stroke-dasharray="100 0" 
            stroke-dashoffset="-0" 
            transform="rotate(-90, 0, 0)"></circle>
  </svg>
</div>