Show SVG path titles as tooltips using d3-tip -


i have svg element looks this:

<svg xmlns="http://www.w3.org/2000/svg" viewbox="50 200 950 1100"  style="fill:black" stroke="grey"> <g title="bihar" style="fill:aquamarine"> <path title="paschim champaran" d="m 582.47648,570. /*more*/ 582.47648,570.42447 z" /> <path title="purba champaran" d="m 594.0844,580.42604 /*more*/ l 594.0844,580.42604 z" /> </g> </svg> 

i view title of each path d3 tootip using d3 tip. tried below:

<script> var tip = d3.tip().html(function(){return this.title;}); svg.call(tip); d3.select('svg').select('g').select('path').on('mouseover',tip.show).on('mouseout',tip.hide); </script> 

it doesn't work . how do it?

you need define svg. example: var svg=d3.select('body').select('svg');

i using .select() "the way obtain selection multiple groups [selection].selectall"

in d3-tip .html() 'this' svg element. instead of this.title, use this.getattribute('title');


Comments

Popular posts from this blog

c# - Validate object ID from GET to POST -

node.js - Custom Model Validator SailsJS -

php - Find a regex to take part of Email -