CODEWITHSUNDEEP
javascriptd3.js
Dao Lam
Dao Lam

Reputation: 2937

D3js: blocks with text inside & hover to show more text

I'm new to D3js. I want to have some basic blocks like this:

enter image description here

The text in the block should be taken from a JSON file. If the block is hovered, it will show:

enter image description here

Any suggestions on how to do this? Or are there any available tutorials on this? Thanks in advance!

Upvotes: 0

Views: 171

Answers (2)

Union find
Union find

Reputation: 8160

You'll want to use something with d3.select, like:

 .on('mouseover', function(d){
        var menuSelection = d3.select(this).style({opacity:'1.0'});
        menuSelection.select("text").style({opacity:'1.0'});
    })

Upvotes: 1

Quy
Quy

Reputation: 1373

You could use

d3.tip()

Sorry for not being more specific (on mobile) but this example should get you what you want:

http://bl.ocks.org/Caged/6476579

Upvotes: 1

Related Questions