IE11 中的 D3 和弦示例悬停问题
D3 Chord Example Hover Issue in IE11
我正在研究如何根据我在 http://www.delimited.io/blog/2013/12/8/chord-diagrams-in-d3
找到的教程在 D3 中构建和弦图的一些示例
我在看第一个例子，关于头发颜色偏好。当您将鼠标悬停在圆圈边缘的一组上时，它只会显示与该组相关的和弦，当您再次将鼠标移到圆圈外时，所有其他和弦都会重新出现。
这似乎是通过动态附加 css class "fade" 到所有应该隐藏的和弦来实现的，然后是下面的一段 CSS 处理在悬停时将它们全部隐藏。
#circle:hover path.fade {
display: none;
}
这在 Chrome 中工作正常，但是当我在 IE11 中尝试相同的页面时，一旦您将鼠标悬停在一组上，当您将鼠标移到圆圈外时，剩余的和弦永远不会重新绘制。
我在 IE11 中启动了调试器，似乎只需在调试器中修改 DOM 上的一个属性即可解决问题 - 但我无法弄清楚如何实现这在代码中。
我在这里创建了一个 fiddle 包含所有详细信息 https://jsfiddle.net/49dym52r/
感谢您的帮助。
在 Windows10 上的 Internet Explorer 11 中查看 delimited.io resource 时，我能够重现该问题。但是，我无法在 Microsoft Edge 中重现该问题，这可能意味着在 Trident 的分支之后，此修复程序作为在 EdgeHTML 上完成的其他 Web 平台工作的一部分出现。
我们不太可能在 Internet Explorer 上执行任何操作 feature-work，因此您最好的选择是说服 Internet Explorer 11 以更适当的方式运行。这有时会很棘手，但在 Telerik's Fiddler 几分钟后，我能够通过添加以下内容解决 Windows 10 的 Internet Explorer 11 中的问题：
div:hover { background: auto } // Or svg:hover, per the comments below
我将此添加到上述 delimited.io 资源的顶部，它似乎已经解决了我的问题。它有点 heavy-handed，所以如果您发现它给您带来任何问题，您可能需要调整它的范围。
我正在研究如何根据我在 http://www.delimited.io/blog/2013/12/8/chord-diagrams-in-d3
找到的教程在 D3 中构建和弦图的一些示例我在看第一个例子，关于头发颜色偏好。当您将鼠标悬停在圆圈边缘的一组上时，它只会显示与该组相关的和弦，当您再次将鼠标移到圆圈外时，所有其他和弦都会重新出现。
这似乎是通过动态附加 css class "fade" 到所有应该隐藏的和弦来实现的，然后是下面的一段 CSS 处理在悬停时将它们全部隐藏。
#circle:hover path.fade {
display: none;
}
这在 Chrome 中工作正常，但是当我在 IE11 中尝试相同的页面时，一旦您将鼠标悬停在一组上，当您将鼠标移到圆圈外时，剩余的和弦永远不会重新绘制。
我在 IE11 中启动了调试器，似乎只需在调试器中修改 DOM 上的一个属性即可解决问题 - 但我无法弄清楚如何实现这在代码中。
我在这里创建了一个 fiddle 包含所有详细信息 https://jsfiddle.net/49dym52r/
感谢您的帮助。
在 Windows10 上的 Internet Explorer 11 中查看 delimited.io resource 时，我能够重现该问题。但是，我无法在 Microsoft Edge 中重现该问题，这可能意味着在 Trident 的分支之后，此修复程序作为在 EdgeHTML 上完成的其他 Web 平台工作的一部分出现。
我们不太可能在 Internet Explorer 上执行任何操作 feature-work，因此您最好的选择是说服 Internet Explorer 11 以更适当的方式运行。这有时会很棘手，但在 Telerik's Fiddler 几分钟后，我能够通过添加以下内容解决 Windows 10 的 Internet Explorer 11 中的问题：
div:hover { background: auto } // Or svg:hover, per the comments below
我将此添加到上述 delimited.io 资源的顶部，它似乎已经解决了我的问题。它有点 heavy-handed，所以如果您发现它给您带来任何问题，您可能需要调整它的范围。