我有一个由 d3 生成的饼图 SVG。如果我将内容保存在扩展名为 .svg 的文件中，则所有浏览器都无法显示它。
如果我将相同的内容保存在扩展名为 .html 的文件中，它会显示得很好。
为什么 ？
SVG 内容在这里http://pastebin.com/9QPKT5ju
更详细地说，不涉及 Web 服务器，只需将内容保存在扩展名为 .html 的文件中并在浏览器中加载文件即可使其正确显示，而将扩展名更改为 .svg 并在浏览器中重新加载会使其消失.
我这样做的原因是我在服务器端使用 Node.js 生成 svg 并希望将生成的 svg 嵌入到 html 页面和 PDF 文件中。对于上面的实验，我只是想看看生成的 svg 是否在浏览器中正确显示，因为它会在固定的 HTML 模板中动态加载。
您需要将以下内容添加到基本 svg 元素：
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
您的颜色定义也需要是这样的：
<radialGradient id="grad-0" cx="0" cy="0" r="190"><stop offset="0" stop-color="#ace98c"></stop><stop offset="0.3" stop-color="#ace98c"></stop><stop offset="1" stop-color="#70c046"></stop></radialGradient>
而不是radialgradient（即骆驼外壳很重要。）