首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >SVG中的CamanJS?

SVG中的CamanJS?
EN

Stack Overflow用户
提问于 2018-09-29 11:04:59
回答 1查看 45关注 0票数 0

我希望使用CamanJS (http://camanjs.com/guides/)或其他类似工具对<svg>元素中的图像进行一些客户端图像操作。

示例代码如下所示...

代码语言:javascript
运行
复制
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="624" height="793" id="svg_3162" style="width: 639px;">
    <desc>Created with Rapha�l</desc>
    <defs></defs>
    <rect x="15" y="150" width="24" height="24" r="0" rx="0" ry="0" fill="#ff0000" stroke="none"></rect>
    <rect x="7" y="174" width="24" height="24" r="0" rx="0" ry="0" fill="#000000" stroke="none"></rect>
    MORE SVG STUFF
    <image x="35" y="0" width="600" height="769" preserveAspectRatio="none" xlink:href="https://s3.amazonaws.com/path/to/image.jpg"></image>
    MORE SVG STUFF
</svg>

<svg>标记中的<image>标记似乎是问题所在。有没有人知道CamanJS能不能用这个?或者是否有类似的东西可以在这个场景中工作?

EN

回答 1

Stack Overflow用户

发布于 2018-09-29 21:19:03

使用foreignObject并设置高度、宽度、x和y位置

代码语言:javascript
运行
复制
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="624" height="793" id="svg_3162" style="width: 639px;">
<desc>Created with Rapha�l</desc>
<defs></defs>
<rect x="15" y="150" width="24" height="24" r="0" rx="0" ry="0" fill="#ff0000" stroke="none"></rect>
<rect x="7" y="174" width="24" height="24" r="0" rx="0" ry="0" fill="#000000" stroke="none"></rect>
MORE SVG STUFF
代码语言:javascript
运行
复制
       MORE SVG STUFF
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/52564725

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档