1

I want to display the values that are currently displayed on top of the chart on mouseover, outside the chart instead.

I tried to dig further into the dc.js file, but couldn't figure out where the values are being displayed.

Can anyone suggest which function is being called internally inside dc.js?

Gordon
  • 19,811
  • 4
  • 36
  • 74
Ruchi Shankar
  • 31
  • 4
  • The mouseover tooltips use the `` tag, so there isn't really a code path that you can hook into. However, you can add your own `mouseover` event to implement this. I've linked to a previous question. The main difference is that you will select `g.pie-slice` instead of `circle.dot` in order to register your event handler, [as documented in the wiki](https://github.com/dc-js/dc.js/wiki/Chart-selectors). – Gordon Nov 06 '17 at 17:57

1 Answers1

2

Thanks for your response! It worked for me. My code mentioned below:

I added this span inside the section for Gender div:

Used mouse over event with renderlet event:

.on('renderlet', function(genderTypeChart) { genderTypeChart.selectAll('g.pie-slice') .on('mouseover', function(d) { genderTypeChart.select('.display-gender').text(d.data.value); }) .on('mouseout', function(d) { genderTypeChart.select('.display-gender').text(''); }); });

Ruchi Shankar
  • 31
  • 4