错误：<tspan> 属性 dy：预期长度，“NaN”。 |错误：<路径> 属性 d：预期数字，“M,0,0”。 |拉斐尔.js

我正在尝试使用 wheelnav.js 库创建圆形菜单。
尽管它似乎有效，但我在 chrome 控制台中遇到了数千个错误。

错误：属性 d：预期数字，“M,0,0”。
错误：属性 dy：预期长度，“NaN”。

在我自己的调试过程中，我设法找到了人们在这些线程中列出的相同原因：

https://github.com/DmitryBaranovskiy/raphael/issues/593
https://github.com/DmitryBaranovskiy/raphael/issues/620
https://github.com/fperucic/treant-js/issues/73

尽管这些线程已经很老了，但它们仍然是打开的，我找不到解决我的问题的方法。我什至找不到一个优雅的方法来覆盖 raphaels 的函数。

 var icons = {
    'section_sign': '\u00A7\n',
    'key': '\uf084\n',
    'cogs': '\uf085\n',
 };

var items = [ {title: icons.key + 'Security&\nPasswords'},
              {title: icons.cogs + 'Settings&\nDevice'},
              {title: icons.section_sign + 'Rules&\nLaw'} ];

var piemenu = new wheelnav('main_menu');
piemenu.initWheel(items.map(function(item){
                                        return item.title;
                                    }));
piemenu.createWheel();

JSFiddle

有什么想法吗？

感谢您的帮助:)

【问题讨论】：

标签： javascript google-chrome svg raphael wheelnav.js

【解决方案1】：

wheelnav.js 使用修改后的 Raphael.js

https://cdn.jsdelivr.net/npm/wheelnav@1.7.1/js/dist/raphael.min.js

这是一个没有错误的 JSFiddle：https://jsfiddle.net/npg80xqm

您可以在此处找到已修复的错误：https://github.com/softwaretailoring/wheelnav/commits/master/js/required/raphael.js

【讨论】：

非常感谢，它解决了：错误：属性d：预期数字，“M,0,0”。但是错误：属性dy：预期长度，“NaN”仍然发生.
您在修改后的 JSFiddle 中看到此错误吗？我没有。

【解决方案2】：

问题https://github.com/DmitryBaranovskiy/raphael/issues/593中已经有一种解决方案。所以我通过添加发现了以下错误：

if(isNaN(fontSize)) {
    fontSize = 10;
}

到 raphael.js 之后：

fontSize = node.firstChild ? toInt(R._g.doc.defaultView.getComputedStyle(node.firstChild, E).getPropertyValue("font-size"), 10) : 10;

（2.3.0 中的第 6147 行）为我解决了 <tspan> 错误。

【讨论】：