拉斐尔'；s clip rect属性以获取生成的svg图像的结果

我的画布上有一个拉斐尔的图像，我使用clip rect裁剪我不需要的部分。现在，我已经使用raphael.serialize插件生成了一个svg，但我无法使clip rect正常工作。php脚本中循环创建json的部分：

for ($i=0; $i <= count($json); $i++) {
            if ($json[$i]['type'] == "image" ) {
                $base64 = base64_encode(file_get_contents($json[$i]['src']));
                $output .= '<image overflow="visible" x="'.$json[$i]["x"].'" y="'.$json[$i]["y"].'" width="'.$json[$i]["width"].'"  clip-rect="'.$json[$i]["clip"].'" height="'.$json[$i]["height"].'" transform="'.$json[$i]["transform"].'" preserveAspectRatio="none" xlink:href="data:image/png;base64,'.$base64.'"></image>';
          }
    }

我尝试使用viewBox=“”.$json[$i][“clip”]”和clip=“”.$json[$i][“clip”]”但没有结果

---

我如何才能让它工作？

SVG中没有

'clip-rect'

属性。然而，有一个

“clip-path”

属性，这是Raphaël实际使用的（clip-rect只是一个抽象/限制）。请注意，您还需要序列化定义剪切区域的

。

我已将我的php脚本更改为获取“clip path=“”。$json[$i][“clip rect”]”，但无法获取结果。你能给我一些解决问题的指导方针吗。我是svgLooking方面的新手，了解raphael.serialize所做的事情。它似乎无法处理序列化剪辑路径。我不太清楚为什么扩展的作者不只是在顶级svg元素上使用XMLSerializer，那么您就可以得到浏览器看到的所有东西。看你的部分正确，XMLSerializer似乎已经添加到IE9中（与svg一起）。无论如何，您的PHP脚本似乎正在生成svg，并且应该确保正确地生成svg，并且您必须修改raphael.serialize和PHP脚本以使剪辑正常工作。

var object = {
                  type: node.type,
                  width: node.attrs['width'],
                  height: node.attrs['height'],
                  x: node.attrs['x'],
                  y: node.attrs['y'],
                  src: node.attrs['src'],
                  clip: node.attrs['clip-rect'],
                  transform: node.transformations ? node.transformations.join(' ') : ''
                }