Question

我有这个D3js line graph我正在使用。

我希望能够将其保存为同一目录中的图像，如this example

所示

sidebarPanel

没有错误运行上面的

虽然我没有收到任何错误，但单击按钮时文件没有下载。我在这里错过了什么？谢谢！

Answer 1

在查看getCSSStyles之后，看起来它只检查与完全根svg及其子元素的id或类匹配的规则。我认为这是一个更宽容的实施：

function getCSSStyles( parentElement ) {
    var nodesToCheck = [ parentElement ], i;

    // Add all the different nodes to check
    var childNodes = parentElement.getElementsByTagName("*");
    for (i = 0; i < childNodes.length; i++) {
        nodesToCheck.push(childNodes[i]);
    }

    // Extract CSS Rules
    var extractedCSSRules = [];
    for (i = 0; i < document.styleSheets.length; i++) {
        var s = document.styleSheets[i];

        try {
            if (!s.cssRules) continue;
        } catch( e ) {
            if (e.name !== 'SecurityError') throw e; // for Firefox
            continue;
        }

        var cssRules = s.cssRules;
        var ruleMatches;
        for (var r = 0; r < cssRules.length; r++) {
            ruleMatches = nodesToCheck.reduce(function (a, b) {
                return a || b.matches(cssRules[r].selectorText);
            }, false);
            if (ruleMatches)
                extractedCSSRules.push(cssRules[r].cssText);
        }
    }
    return extractedCSSRules.join(' ');
}

你仍然需要使用svg内部的规则（例如，你仍然需要在CSS中将#priceWithMilestones .line更改为.line），但对于将来的项目，我认为应该捕获更多元素。 / p>

更新了所有更改：https://jsfiddle.net/c19664p3/12/

D3js将SVG导出到图像

1 个答案: