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

Question

我正在尝试使用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

即使这些线程很旧，它们仍处于打开状态，我找不到解决该问题的方法。我什至找不到一个优雅的方法来覆盖拉斐尔的功能。

 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

有什么想法吗？

感谢帮助：）

Answer 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

Answer 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>错误。