Question

在jupyter笔记本中，我使用d3.js库可视化parallel sets。
代码在纯html和js中有效，但在jupyter中不起作用。

from IPython.core.display import display, HTML
from string import Template
import pandas as pd
import json, random
html_template = Template('''
    <script type="text/javascript" src="https://fastcdn.org/D3.js/3.5.6/d3.js"> 
    </script>
    <script type="text/javascript" src="./d3.parsets.js"></script>
    <link type="text/css" href="https://cdn.rawgit.com/jasondavies/d3-parsets/master/d3.parsets.css" rel="stylesheet">
    <div id="graph-div"></div>
    <script> $js_text </script>
''')

js_text_template = Template('''
    var chart = d3.parsets()
        .dimensions(["some", "things"]);

    var vis = d3.select("#graph-div").append("svg")
        .attr("width", chart.width())
        .attr("height", chart.height());

    var data = $data ;
    vis.datum(data).call(chart);
''')

data = pd.read_json('feedbackdata.json', orient='records')
js_text = js_text_template.substitute({'data': 
json.dumps(data.to_dict(orient='records'))})
HTML(html_template.substitute({'js_text': js_text}))

当我将鼠标悬停在图形的一部分上时，会出现该错误：

Uncaught TypeError: Cannot read property 'sourceEvent' of null
at d3_eventSource (d3.js?_=1532358239058:528)
at Object.d3.mouse (d3.js?_=1532358239058:1161)
at showTooltip (eval at globalEval (jquery.min.js:2), <anonymous>:493:20)
at SVGGElement.eval (eval at globalEval (jquery.min.js:2), <anonymous>:332:25)
at SVGGElement.__onmousemove.parsets (d3.js?_=1532358239054:1120)

问题在于d3.event变量为null，但我不知道为什么会发生这种情况。
由于该错误，该图是非交互式的，因此我无法对其进行操作，如在并行集示例中所示。

在jupyter笔记本电脑中丢失d3交互性-d3.event为空

0 个答案: