Simple D3 Cloud Map script type text javascript src https d3js org d3 v7 min js script script src https cdn jsdelivr net gh holtzy D3 graph gallery master LIB d3 layout cloud js script script var layout d3 layout cloud size 500 500 words Hello world normally you want more words than this map function d return text d size 10 Math random 90 test haha padding 5 rotate function return Math random 2 90 font Impact fontSize function d return d size on end draw layout start function draw words console log words d3 select body append svg attr width layout size 0 attr height layout size 1 append g append g attr transform translate layout size 0 2 layout size 1 2 selectAll text data words enter append text style font size function d return d size px style font family Impact attr text anchor middle attr transform function d return translate d x d y rotate d rotate text function d return d text function draw2 words console log words svg append g attr transform translate layout size 0 2 layout size 1 2 selectAll text data words enter append text style font size function d return d size px attr text anchor middle attr transform function d return translate d x d y rotate d rotate text function d return d text document body style height 200pt console log ready script Example that takes a large text and extracts information and displays a word cloud document body style height 500px let script1 document createElement script script1 src https d3js org d3 v7 min js script1 async false document body appendChild script1 let script2 document createElement script script2 src https cdn jsdelivr net gh holtzy D3 graph gallery master LIB d3 layout cloud js script2 async false document body appendChild script2 Lots of juicy texts available at https www gutenberg org let promise await fetch https raw githubusercontent com asweigart codebreaker master frankenstein txt let text await promise text console log size of text Frankenstein text length remove non asci characters text text replace a zA Z g remove spaces text text replace make all lowercase text text toLowerCase let wordarray text split remove any extra spaces wordarray wordarray map function el return el trim remove words less than 4 wordarray wordarray filter function s if s s length 4 return true return false won t remove duplicate words here as we want to count the repeat words display the most recurring ones wordarray wordarray filter v i wordarray indexOf v i console log number of valid words wordarray length console log word 0 wordarray 0 console log word 1 wordarray 1 console log word 2 wordarray 2 order words in string based on frequency let frequentObj for let i 0 i wordarray length i let word wordarray i if frequentObj word frequentObj word else frequentObj word 1 console log unique words Object keys frequentObj length sort them into order let topwords Object entries frequentObj topwords topwords sort a b return b 1 a 1 console log topwords 0 topwords 0 0 occurs topwords 0 1 console log topwords 1 topwords 1 0 occurs topwords 1 1 console log topwords 2 topwords 2 0 occurs topwords 2 1 words and frequency list only words topwords topwords map arr return text arr 0 size Math min arr 1 0 3 50 pick top 50 most recurring topwords topwords slice 0 50 If you want to print out all the words console for checking console log topwords topwords console log topwords topwords length console log topwords 0 topwords 0 console log topwords 1 topwords 1 console log topwords 2 topwords 2 let cloudwords topwords map function d return text d size 10 Math random 50 const width 600 const height 500 d3 layout cloud size width height words topwords padding 5 rotate function return Math random 2 90 font Impact fontSize function d return d size on end draw start function draw words d3 select body append svg attr width width attr height height append g attr transform translate width 0 5 height 0 5 selectAll text data words enter append text style font size function d return Math min d size 50 px style font family Impact style fill function d i return blue attr text anchor middle attr title function d return d size 500 attr transform function d return translate d x d y rotate d rotate text function d return d text console log ready
darray wordarray map function el return el trim remove words less than 4 wordarray wordarray filter function s if s s length 4 return true return false won t remove duplicate words here as we want to count the repeat words display the most recurring ones wordarray wordarray filter v i wordarray indexOf v i console log number of valid words wordarray length console log word 0 wordarray 0 console log word 1 wordarray 1 console log word 2 wordarray 2 order words in string based on frequency let frequentObj for let i 0 i wordarray length i let word wordarray i if frequentObj word frequentObj word else frequentObj word 1 console log unique words Object keys frequentObj length sort them into order let topwords Object entries frequentObj topwords topwords sort a b return b 1 a 1 console log topwords 0 topwords 0 0 occurs topwords 0 1 console log topwords 1 topwords 1 0 occurs topwords 1 1 console log topwords 2 topwords 2 0 occurs topwords 2 1 words and frequency list only words topwords topwords map arr return text arr 0 size Math min arr 1 0 3 50 pick top 50 most recurring topwords topwords slice 0 50 If you want to print out all the words console for checking console log topwords topwords console log topwords topwords length console log topwords 0 topwords 0 console log topwords 1 topwords 1 console log topwords 2 topwords 2 let cloudwords topwords map function d return text d size 10 Math random 50 const width 600 const height 500 d3 layout cloud size width height words topwords padding 5 rotate function return Math random 2 90 font Impact fontSize function d return d size on end draw start function draw words d3 select body append svg attr width width attr height height append g attr transform translate width 0 5 height 0 5 selectAll text data words enter append text style font size function d return Math min d size 50 px style font family Impact style fill function d i return blue attr text anchor middle attr title function d return d size 500 attr transform function d return translate d x d y rotate d rotate text function d return d text console log ready