D3.js：在GA中跟踪用户与svg的交互

Question

我想在点击使用D3创建的svg circle-element时向Google Analytics（ga.js）发出事件处理程序。

我想出了这个：

var circlesIndbyggere = d3.select("#ID").selectAll("svg").data(dataset);

circlesIndbyggere
    .enter()
    .append("circle")
    .attr("cx", 50)
    .attr("cy", 150)
    .attr("r", 20)
    .attr("fill", "rgba(35,50,80,0.5)")
    .attr("onClick", "ga('send', 'event', 'button', 'click', 'circle', 4);")

现在，当我使用Google Analytics Debugger-ChromeExtension监控控制台时，它似乎没有触发事件？

当GA-snippet写入标签时，如下所示：

<a onClick="ga('send', 'event', 'button', 'click', 'arrow', 4);">
    <img src="/"/>
</a> 

......似乎工作正常

Answer 1

我认为最好像这样听点击：

.attr...
.on('click', function(node) {
    ga('send', 'event', 'button', 'click', 'circle', 4);
});

优点：

1. 有效：）
2. 更好的可读性。字符串中的JS代码看起来很糟糕。
3. 您可以调试它，与字符串不同。不弄脏DOM