Estoy usando .on('click') en mi código, pero solo funciona cuando hago doble clic en el elemento.

Me pregunto qué está causando este problema.

Aquí está el código:

 node = instance .selectAll('.node') .data(bubble(nodes).descendants()) .enter() .filter(d => !d.children) .append('g') .attr('class', styles.widgetComponentCusterNode) .attr('transform', () => `translate(${width / 2},${height / 2})`) .on('click', d => { console.log('OnClick event called!!!'); }) .call(d3.drag().on('setContexttart', dragstarted).on('drag', dragged).on('end', dragended)) .on('mouseover', mouseover) .on('mouseout', mouseout);

¿Me estoy perdiendo de algo?

Gracias por adelantado.