timdream / wordcloud2.js

Tag cloud/Wordle presentation on 2D canvas or HTML
https://wordcloud2-js.timdream.org/
MIT License
2.36k stars 511 forks source link

drawOutOfBound: false sometimes fails to cull words that are partially off-canvas #109

Open jessica-wyatt-livinglens opened 6 years ago

jessica-wyatt-livinglens commented 6 years ago

Hi,

I've noticed that sometimes with particular weightings words can be rendered almost entirely off-canvas but with say one huge letter on the canvas. I assume this isn't meant to happen.

A test case that should replicate the issue is as follows:

Word list

42 Test 15 Love 14 Liebe 12 ፍቅር 11 Lufu 8 حب 7 Aimor 6 Amor 5 Heyran 5 ভালোবাসা 5 Каханне 5 Любоў 5 Любов 5 བརྩེ་དུང་། 5 Ljubav 5 Karantez 5 Юрату 5 Láska 5 Amore 5 Cariad 5 Kærlighed 5 Armastus 5 Αγάπη 5 Amo 5 Amol 5 Maitasun 5 عشق 5 Pyar 5 Amour 5 Leafde 5 Gràdh 5 愛 5 爱 5 પ્રેમ 5 사랑 5 Սեր 5 Ihunanya 5 Cinta 5 ᑕᑯᑦᓱᒍᓱᑉᐳᖅ 5 Ást 5 אהבה 5 ಪ್ರೀತಿ 5 სიყვარული 5 Махаббат 5 Pendo 5 Сүйүү 5 Mīlestība 4 Meilė 3 Leefde 2 Bolingo

Configuration

{ gridSize: Math.round(16 $('#canvas').width() / 1024), weightFactor: function (size) { return Math.pow(size, 2.3) $('#canvas').width() / 1024; }, fontFamily: 'Times, serif', color: function (word, weight) { return (weight === 62) ? '#f02222' : '#c09292'; }, drawOutOfBound: false, rotateRatio: 0, rotationSteps: 0, backgroundColor: '#ffe0e0' }

Dimension

Width: 1024 Height: 700 dppx: 1

I've seen this on Chrome but haven't tested any other browsers as yet.

For anyone else seeing this issue I have what I believe is a temporary work-around which is to run this code in the wordclouddrawn event:

$('#html-canvas span').filter(function() { return $(this).position().left < 0 || $(this).position().top < 0 || $(this).position().left > 1024 || $(this).position().top > 700 }).remove();

Obviously this assumes you're using spans.

timdream commented 6 years ago

@chris-wyatt-livinglens Thanks for filing. Can you paste a screenshot here?

jessica-wyatt-livinglens commented 6 years ago

Sure:

image

timdream commented 6 years ago

WOW, I have no idea what happened. I won't be able to fix it since I couldn't reproduce it though.