Chrome打破了SVG图案填充

时间:2015-01-27 20:57:14

标签: svg

在最新版本的Chrome和Safari中查看此SVG

在Safari中,您会看到彩色填充。在Chrome中,填充不会呈现。

关于如何修复此错误的任何想法?这似乎是最新Chrome版本(https://code.google.com/p/chromium/issues/detail?id=452235

中的新错误

我删除了d坐标以简洁



<?xml version="1.0" standalone="no"?>
  <svg width="2000" height="2000" xmlns="http://www.w3.org/2000/svg" version="1.1">
    <defs>
      <linearGradient id="Gradient1">
        <stop offset="5%" stop-color="white"/>
        <stop offset="95%" stop-color="blue"/>
      </linearGradient>
      <linearGradient id="Gradient2" x1="0" x2="0" y1="0" y2="1">
        <stop offset="5%" stop-color="red"/>
        <stop offset="95%" stop-color="orange"/>
      </linearGradient>

      <pattern id="Pattern" x="0" y="0" width=".25" height=".25">
        <rect x="0" y="0" width="50" height="50" fill="skyblue"/>
        <rect x="0" y="0" width="25" height="25" fill="url(#Gradient2)"/>
        <circle cx="25" cy="25" r="20" fill="url(#Gradient1)" fill-opacity="0.5"/>
      </pattern>
    </defs>
    <g typename="Graphic" artname="PRAYING HANDS" min_size_x="0" min_size_y="0" size_locked="false" transform="matrix(1 0 0 1 100 100)"><g artname="PRAYING HANDS" data-artwork-id="1041" transform="">
      <title>Praying Hands</title>
      <g transform="matrix(1 0 0 -1 -2401 2972)" style="text-rendering:optimizeLegibility;shape-rendering:default;image-rendering:optimizeQuality" artname="PRAYING HANDS" data-artwork-id="1041">
        <path fill="url(#Pattern)" d="..." opacity="1"></path>
  </g>
</g>

<!-- outline -->
<g transform="matrix(1 0 0 -1 -2400.16 2971.63)" style="text-rendering:optimizeLegibility;
shape-rendering:default;
image-rendering:optimizeQuality" artname="PRAYING HANDS" data-artwork-id="1041">
<desc>Untitled</desc>
<path style="fill:purple;stroke:#000000;fill-rule: evenodd;stroke-width:0.000001" d="..." fill="none" opacity=""></path>
    </g>
  </g>
</svg>
&#13;
&#13;
&#13;

2 个答案:

答案 0 :(得分:2)

这是Chrome中的已知错误。

https://code.google.com/p/chromium/issues/detail?id=447707

看起来它将在Chrome 41中修复。

答案 1 :(得分:0)

这是以某种方式通过改变待填充的东西或他们的父母造成的,试着没有它。对于我的情况,一个&#34;比例(-1,1)&#34;引起了这个问题。我通过手动进行转换来解决这个问题,这很容易扩展(-1,1)。翻译和翻译旋转没有问题。

干杯, 凯