timdream / wordcloud2.js

Tag cloud/Wordle presentation on 2D canvas or HTML

Home Page:https://wordcloud2-js.timdream.org/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

it shuffles all the time

bwl21 opened this issue · comments

When I go to the demo page ad set shuffle: false, it still shuffles.

{
  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 === 12) ? '#f02222' : '#c09292';
  },
  rotateRatio: 0.5,
  rotationSteps: 2,
  shuffle: false,
  backgroundColor: '#ffe0e0'
}

whatever I do the tag cloud looks different with every run ...

@timdream I notice same behavior. And it's a problem in my web app when I want to draw on two canvas with different scales (multiply fontsize by 1 and 2, cause one canvas is 920 x 540 and another is 1920 x 1080).

I know this issue is old, but a workable solution for this is to use the seedrandom.js library, if I include this in my code I can get repeatable rendering:

    seedRandom('some seed value', { global: true });

This does some magic that seeds the Javascript RNG and requires no code changes in the library code, Math.random() is still used by this library internally.

You can then choose yourself whether and when to pick a new random seed to get a different word cloud.

@bwl21 have you found any solution?

I fixed seed by overriding Math.random function

// Overwrite Math.random to use seed
function randseed(s) {
    s = Math.sin(s) * 10000;
    return s - Math.floor(s);
};
let seed=12;
Math.random = function() {
    seed++;
    return randseed(seed);
};

const tagWrapper = document.querySelector("#tag-cloud");
WordCloud(tagWrapper, {
    list: tagArray,
    weightFactor: 25,
    classes: "tag-cloud-item",
});

for other random algorithms can find it https://stackoverflow.com/questions/521295/seeding-the-random-number-generator-in-javascript

If you have a plan to use built-in Math.random after

I recommend doing something like this

const tmpRandom = Math.random;

// then you overwrite random and run wordcloud until it finish run

Math.random = tmpRandom; // bring back built-in random