Word padding in wordcloud

[ghost]

A word cloud with extreme long words results in some space issues between words, so that it looks like one word. Therefor I suggest a new option wordPadding, that adds some padding before and after words similar to a white space. Examples:

• Word cloud without white space: https://jsfiddle.net/rndpzywr/
• Word cloud with white space: https://jsfiddle.net/rndpzywr/1/

[OmarMustafa]

Hi @bre1470, any updates on this?
I have a similar issue and I couldn't seem to find a solution for it. When I add leading and trailing spaces to words, they get trimmed.

[bre1470]

@OmarMustafa You can try the following event implementation for a custom wordSpaces option:

Highcharts.chart('container', {
    chart: {
        events: {
            load: function() {
                var allSeries = this.series,
                    noBreakSpace = String.fromCharCode(0xA0),
                    WordCloudSeries = Highcharts.seriesTypes.wordcloud,
                    data, options, point, series, spacing, wordSpaces;
                for (var i = 0, ie = allSeries.length; i < ie; ++i) {
                    series = allSeries[i];
                    if (!(series instanceof WordCloudSeries)) continue;
                    options = series.options;
                    wordSpaces = (options.wordSpaces || 0);
                    if (!wordSpaces) continue;
                    data = options.data;
                    spacing = '';
                    while (wordSpaces--) spacing += noBreakSpace;
                    for (var j = 0, je = data.length; j < je; ++j) {
                        point = data[j];
                        point.name = spacing + point.name + spacing;
                    }
                    series.setData(data);
                }
            }
        }
    },
    series: [{
        type: 'wordcloud',
        data: data,
        name: 'Occurrences',
        rotation: {
            from: 0,
            to: 0
        },
        spiral: 'rectangular',
        placementStrategy: 'center',
        wordSpaces: 1
    }],
    title: {
        text: 'Wordcloud of Lorem Ipsum'
    }
});

Demo: https://jsfiddle.net/0jw1L39m/

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions!

[mkhavari01]

i do wanna know how to make this kind of word cloud https://isid.research.ac.ir/Reza_Malekzadeh which exist in here but mine has lots of spaces between words

[raf18seb]

Hi @mkhavari01, could you ask your question more precisely? I don't see any word cloud chart on the website you provided.

[jesusgrace777]

Hi Team, could you please help me on sharing the solution for fixing the Word Cloud Text merging without space. Attached the screenshot

[karolkolodziej]

@jesusgrace777 Could you please share an example where this issue is visible? I'm not able to recreate that on my own.

[fshenton]

Hi all, has anyone worked out how to control the x and y spacing between words?

I'm a bit stuck, I want to reduce the horizontal and vertical spacing quite a lot, to the point where words are nearly touching. But i can't find something to override/implement based on the API docs

Current:

Target (approx):