d3-cloud
d3-cloud copied to clipboard
feature: blink words to load more?
here is what I try to do by using jquery:
var func = (v) => {
$(v).css('opacity', 0)
setTimeout(()=> {
$(v).text(parseInt(Math.random() * 100))
$(v).css('opacity', 1)
setTimeout(func.bind(this, v), 3000 + Math.random() * 3000)
},5000)
}
$('svg text').each((k, v) => {
$(v).css('transition', 'opacity 5s cubic-bezier(0.4, 0, 0.2, 1) 0s')
setTimeout(func.bind(this, v), Math.random() * 10000)
})
words has different lengths and font-sizes. the code above will actually cause a text overlap. I hope someone will introduce a good way to blink them in appropriate position.
The current implementation only places a static set of words in one go: it can't deal with adding new words and placing them dynamically. Might be interesting for a future version.