lucaong / jQCloud

jQuery plugin for drawing neat word clouds that actually look like clouds
MIT License
646 stars 293 forks source link

JQcloud randomly gets stuck #25

Open piranha32 opened 12 years ago

piranha32 commented 12 years ago

In my application I need to redraw a cloud once a minute with a varying set of 75 words. The rendering is performed with delayed mode on and elliptic spiral. Every few minutes the script gets stuck after having rendered 50-70 words and locks the browser window. After stopping it from firefox'es "Unresponsive script" window the application runs fine until the next lockup. I noticed that every time the lockup occurs, the words that have been rendered until the script was stopped are not placed properly: many of them overlap. The script is always stopped in line 150 (jqcloud.js version 1.0.0. dated on Fri Apr 27 09:56:40 +0200 2012):

  while(hitTest(document.getElementById(word_id), already_placed_words)) {
    // option shape is 'rectangular' so move the word in a rectangular spiral
 >>>>>   if (options.shape === "rectangular") {
      steps_in_direction++;

At that time the values of radius and angle variables are in the range of 5000. The time between lockups seems to be random and I couldn't identify any patterns in the wordsets that cause them. The issue is reproducible on Firefox versions 12-13.0.1 on Mac and on Linux.

Would you have any ideas on how to debug this problem?

lucaong commented 12 years ago

Jacek, Thanks a lot for the very detailed report, I will definitely look into it and hopefully find what is causing this issue.

Luca

On 24/lug/2012, at 03:46, Jacek Radzikowskireply@reply.github.com wrote:

In my application I need to redraw a cloud once a minute with a varying set of 75 words. The rendering is performed with delayed mode on and elliptic spiral. Every few minutes the script gets stuck after having rendered 50-70 words and locks the browser window. After stopping it from firefox'es "Unresponsive script" window the application runs fine until the next lockup. I noticed that every time the lockup occurs, the words that have been rendered until the script was stopped are not placed properly: many of them overlap. The script is always stopped in line 150 (jqcloud.js version 1.0.0. dated on Fri Apr 27 09:56:40 +0200 2012):

 while(hitTest(document.getElementById(word_id), already_placed_words)) {
   // option shape is 'rectangular' so move the word in a rectangular spiral
>>>>>  if (options.shape === "rectangular") {
     steps_in_direction++;

At that time the values of radius and angle variables are in the range of 5000. The time between lockups seems to be random and I couldn't identify any patterns in the wordsets that cause them. The issue is reproducible on Firefox versions 12-13.0.1 on Mac and on Linux.

Would you have any ideas on how to debug this problem?


Reply to this email directly or view it on GitHub: https://github.com/lucaong/jQCloud/issues/25

piranha32 commented 12 years ago

Luca,

I'm able to recreate the lockups with the following code.

<!DOCTYPE HTML >
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <link href="/stylesheets/jqcloud.css" media="screen" rel="stylesheet" type="text/css" />
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
        <script src="/javascripts/jqcloud-1.0.0.js" type="text/javascript"></script>

        <title>JQcloud test</title>
        <script>
            $(document).ready(function() {
                cloud();
            })

            function cloud() {
                var words=[
                    {"text":"#syria","weight":4.31748811353631,"link":{"href":"https://twitter.com/search/%2523syria"}},
                    {"text":"syria","weight":3.6635616461296463},
                    {"text":"#assadkilledk","weight":2.70805020110221,"link":{"href":"https://twitter.com/search/%2523assadkilledk"}},
                    {"text":"طلاس","weight":2.4849066497880004},
                    {"text":"#سوريا","weight":2.3978952727983707,"link":{"href":"https://twitter.com/search/%2523%D8%B3%D9%88%D8%B1%D9%8A%D8%A7"}},
                    {"text":"على","weight":2.302585092994046},
                    {"text":"syrian","weight":2.302585092994046},
                    {"text":"chemical","weight":2.0794415416798357},
                    {"text":"إلى","weight":2.0794415416798357},
                    {"text":"weapons","weight":1.9459101490553132},
                    {"text":"سوريا","weight":1.9459101490553132},
                    {"text":"العميد","weight":1.9459101490553132},
                    {"text":"#latakia","weight":1.791759469228055,"link":{"href":"https://twitter.com/search/%2523latakia"}},
                    {"text":"military","weight":1.791759469228055},
                    {"text":"manaf","weight":1.791759469228055},
                    {"text":"hashtag","weight":1.791759469228055},
                    {"text":"الأسد","weight":1.6094379124341003},
                    {"text":"aleppo","weight":1.6094379124341003},
                    {"text":"tlass","weight":1.6094379124341003},
                    {"text":"new","weight":1.6094379124341003},
                    {"text":"free","weight":1.6094379124341003},
                    {"text":"مناف","weight":1.6094379124341003},
                    {"text":"syrias","weight":1.6094379124341003},
                    {"text":"cont","weight":1.6094379124341003},
                    {"text":"please","weight":1.6094379124341003},
                    {"text":"support","weight":1.3862943611198906},
                    {"text":"assad","weight":1.3862943611198906},
                    {"text":"fighter","weight":1.3862943611198906},
                    {"text":"use","weight":1.3862943611198906},
                    {"text":"security","weight":1.3862943611198906},
                    {"text":"foreign","weight":1.3862943611198906},
                    {"text":"against","weight":1.3862943611198906},
                    {"text":"last","weight":1.3862943611198906},
                    {"text":"#egypt","weight":1.3862943611198906,"link":{"href":"https://twitter.com/search/%2523egypt"}},
                    {"text":"turkish","weight":1.3862943611198906},
                    {"text":"موسكو","weight":1.3862943611198906},
                    {"text":"تحذر","weight":1.3862943611198906},
                    {"text":"كلمة","weight":1.3862943611198906},
                    {"text":"استخدام","weight":1.3862943611198906},
                    {"text":"السلاح","weight":1.3862943611198906},
                    {"text":"الكيماوي","weight":1.3862943611198906},
                    {"text":"بعد","weight":1.3862943611198906},
                    {"text":"اعتراف","weight":1.3862943611198906},
                    {"text":"policy","weight":1.3862943611198906},
                    {"text":"بامتلاكها","weight":1.3862943611198906},
                    {"text":"وتوقف","weight":1.3862943611198906},
                    {"text":"رحلات","weight":1.3862943611198906},
                    {"text":"طيرانها","weight":1.3862943611198906},
                    {"text":"romneys","weight":1.3862943611198906},
                    {"text":"called","weight":1.3862943611198906},
                    {"text":"#damascus","weight":1.3862943611198906,"link":{"href":"https://twitter.com/search/%2523damascus"}},
                    {"text":"one","weight":1.3862943611198906},
                    {"text":"campaign","weight":1.3862943611198906},
                    {"text":"دمشق","weight":1.3862943611198906},
                    {"text":"sidesteps","weight":1.0986122886681098},
                    {"text":"address","weight":1.0986122886681098},
                    {"text":"mitt","weight":1.0986122886681098},
                    {"text":"hits","weight":1.0986122886681098},
                    {"text":"going","weight":1.0986122886681098},
                    {"text":"obama","weight":1.0986122886681098},
                    {"text":"border","weight":1.0986122886681098},
                    {"text":"damascus","weight":1.0986122886681098},
                    {"text":"genocide","weight":1.0986122886681098},
                    {"text":"more","weight":1.0986122886681098},
                    {"text":"قبل","weight":1.0986122886681098},
                    {"text":"bring","weight":1.0986122886681098},
                    {"text":"workers","weight":1.0986122886681098},
                    {"text":"thinkers","weight":1.0986122886681098},
                    {"text":"regime","weight":1.0986122886681098},
                    {"text":"هذا","weight":1.0986122886681098}]

                    $("#cloud").html("&nbsp;");
                    $("#cloud").jQCloud(words);
                    setTimeout(cloud,30*1000)
                };
        </script>

    </head>
    <body>
        <div id="cloud" style="height:400px;width:1000px;"></div>
    </body>
</html>
piranha32 commented 12 years ago

I did a few more experiments and it looks that the problem may be caused by non-latin (arabic in this case) characters in the words.

mita4eto commented 11 years ago

Not sure the hang occurs when there are any non-latin characters. I have a set of only latin characters (just English language) and when I play around a few times navigating through my app (the word cloud is on a few pages) it hangs, most of the words are placed one above another (overlap). There should be any other issue causing that hand

piranha32 commented 11 years ago

Because of this problem I switched to a D3-based word cloud. Works reliably, without crashes.

shamabbas commented 6 years ago

Hi, I'm also facing this issue with the version "jqcloud-1.0.4.min.js". Seems like this is not resolved? Problem occurs when I call $(".myclass").jQCloud(words, {shape: "rectangular"}); Any help?