简体   繁体   English

在网络浏览器中保存经过处理的SVG图像

[英]Saving a manipulated SVG image in a web browser

I have created an online tool that uses javascript to manipulate elements of a premade SVG image. 我创建了一个在线工具,该工具使用javascript操纵预制SVG图像的元素。 The problem I'm having is that to access the DOM, I have put the image in an object tag. 我遇到的问题是要访问DOM,我已将图像放在对象标签中。 But doing so prevents you from right clicking the image in a browser and clicking save. 但是这样做会阻止您右键单击浏览器中的图像,然后单击“保存”。 Okay, that's fine, so I'll just put it in an img tag. 好的,那很好,所以我将其放在img标签中。 Img tags let you right click and save. Img标签可让您右键单击并保存。 Oh- but in an img tag, you can't access the DOM. 哦,但是在img标签中,您无法访问DOM。 So the image can't be manipulated by the javascript function. 因此,图像无法通过javascript函数进行操作。 Canvas seems to also disallow right clicking and saving. 画布似乎也不允许右键单击和保存。 What do I try next? 接下来我该怎么做?

If you want to use Canvas, you can use something like canvas2img: http://www.nihilogic.dk/labs/canvas2image/ 如果要使用Canvas,可以使用canvas2img之类的东西: http ://www.nihilogic.dk/labs/canvas2image/

Put a button on your page, from which you can export the canvas to any number of formats. 在页面上放置一个按钮,从中可以将画布导出为多种格式。 I'm sure there are other frameworks for this as well, I think Kinetic.js has something built in, or you could easily roll your own. 我肯定还有其他框架,我认为Kinetic.js内置了一些东西,或者您可以轻松地自己滚动。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM