错误：<tspan>属性dy:预期长度，"NaN“。错误：<path>属性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

尽管这些帖子很旧了，但它们仍然是打开的，我找不到解决我的问题的方法。我甚至找不到一种优雅的方法来覆盖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

有什么想法吗？

感谢您的帮助:)

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中已经有了一种解决方案。因此，我通过添加以下代码找到了下面的bodge：

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