我必须在 Dart 中使用一些 DOM 操作来处理 SVG 元素。在“svg”标签下添加和更改一些元素后，我想将最终的 SVG 元素导出到静态文件。有什么API可以做到吗？
谢谢!
最佳答案
您可以使用 download <a> 上的属性元素。这告诉浏览器下载资源而不是导航到它。
您可以使用 innerHtml 获取 SVG 的内容.
这是一个例子。
首先，HTML:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Svgtest</title>
<link rel="stylesheet" href="svgtest.css">
</head>
<body>
<h1>Svgtest</h1>
<div id="container">
<svg xmlns="http://www.w3.org/2000/svg" version="1.1">
<circle cx="100" cy="50" r="40" stroke="black"
stroke-width="2" fill="red"/>
</svg>
</div>
<script type="application/dart" src="svgtest.dart"></script>
<script src="packages/browser/dart.js"></script>
</body>
</html>
接下来是 Dart 代码:
import 'dart:html';
void main() {
Element container = query('#container');
String contents = container.innerHtml;
Blob blob = new Blob([contents]);
AnchorElement downloadLink = new AnchorElement(href: Url.createObjectUrlFromBlob(blob));
downloadLink.text = 'Download me';
downloadLink.download = 'svg_contents.svg';
Element body = query('body');
body.append(downloadLink);
}
以下是浏览器覆盖范围:http://caniuse.com/#feat=download在撰写本文时，Firefox、Chrome 和 Opera 支持 download属性。
(注意:无法使用 HTML5 直接将文件保存到 native OS 文件系统。)
关于dom - 如何使用 Dart 将 SVG 元素保存到静态文件？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/18543787/