1
下面是使用D3在鼠标悬停上使用圆形和缩放它的代码。它做它应该做的事情,但也将cricle带到别的地方,这意味着圈子尺度和跳转(翻译)到其他位置。我无法理解它的原因。SVG圆形元素按比例变换跳转
this.node = this.chartLayer.append("g")
.attr("class", "nodes")
.selectAll("circle")
.data(data.nodes)
.enter().append("circle")
.attr("r", 10)
.attr("fill", (d) => { return this.colors(d.group); })
.on('mouseover', function(d) {
d3.select(this).attr('transform', 'scale(' + 2 + ')');
})
伟大的答案@赫拉尔多 - 朵。我喜欢半径解决方案,但有没有办法在鼠标悬停后将比例因子应用于半径,并在mouseout时恢复正常? – cpz
我想我将不得不跟踪鼠标悬停节点及其半径,并使用存储的值恢复。 – cpz
我写了这个答案只是为了向你展示“规模”的问题。如果您有强制定向图表,只需根据数据或任何硬编码值更改半径。检查编辑。 –