2

我正在使用力布局将 d3 可视化放在一起，用于Qualtrics问卷网站。一切似乎都在jsfiddle中的不同浏览器上运行。可以将示例从示例框（例如非洲男性）拖到主画布上。可以右键单击主画布中的节点以调出右键菜单来更改节点属性或在画布周围拖动节点。

javascript too large to paste.

请注意，jsfiddle 在 Internet Explorer 11 中工作。但是，当我将此可视化添加到 Qualtrics 网站时，它会在 IE11 中中断。添加的 SVG 元素远远多于数据，如下图所示。

在此处输入图像描述

请注意，Qualtrics 和 d3 可视化的这种组合在 Firefox、Chrome 和 Safari 中运行良好。不幸的是，Qualtrics 支持团队不支持自定义代码，而且我对 javascript 的熟练程度不足以追踪这一点。关于可能导致这种情况的任何想法？

为此在 Qualtrics 中工作：

  1. 在 Qualtrics 标头中添加 d3.js 库
  2. 取消注释Qualtrics.SurveyEngine.addOnload
  3. 注释掉create_d3_interaction(false);

更新 1

我已经对此进行了更多调试。

在update_svg_node方法中，我选择了 SVG 元素：

var svg = d3.select('.' + svg_class);
var nodes = svg.selectAll('.' + class_id)
    .data(f.nodes());

问题似乎发生在selectAll——由于某种原因，它与数据的类选择不匹配。请注意，这只发生在 Qualtrics 和 IE11 中，但在小提琴中的 IE11 中可以正常工作。请注意，这是小提琴的更新版本，但问题仍然以相同的方式发生。

因此，出于某种原因，应该在 UPDATE 类中的节点在 ENTER 类中。

4

0 回答 0