search

jasondavies / d3-cloud

Create word clouds in JavaScript.
https://www.jasondavies.com/wordcloud/
Other
3.82k stars 1.07k forks source link

Individual word padding/line-height removal? #140

Closed bogdancss closed 6 years ago

bogdancss commented 6 years ago

Is there a way of removing/reducing the line-height or padding on the text elements?

screen shot 2018-02-19 at 14 09 52

The reason behind this is that I have mouseover event listener on each word which increases the font-size for the hovered text element. The problem is then trying to hover off the element, but you are still on the transparent padding, and not hitting the item behind.

As you can see in the example above, it's nearly impossible to hit the smaller elements (note, via, etc.) around the bigger words element.

jasondavies commented 6 years ago

Sorry, these GitHub issues are for bug reports/feature requests only. Please try StackOverflow if you need general help. But I'll give you a hint: you should be able to use SVG's pointer-events to achieve what you want.

bogdancss commented 6 years ago

@jasondavies I'm afraid nothing but pointer-events: none has any effect on this matter. In a way, this is a bug, as the tool adds unnecessary top/bottom padding (whereas there's none left/right) on each text element. Just need to know how to remove that?

jasondavies commented 6 years ago

The d3-cloud library doesn't do any rendering at all; it just generates positions of words given their sizes such that the words do not overlap. So any issues opened relating to SVG or other rendering problems are unfortunately out-of-scope here.

bogdancss commented 6 years ago

@jasondavies ok - fair enough...