doesn't work on ms edge

[deveric19]

see attached image

[mapmyphotos]

Yes, I'm getting the same output on IE Edge

[mistic100]

I don't have Edge, any contribution is welcomed

[mapmyphotos]

Okay, looks like the horizontal absolute position (left:...) is being set correct, but the vertical positions are all the same: "top: 250px;" (in my case as I have the height of the tag cloud set to 500px)

[mapmyphotos]

I'm using the Angular version. I've just setup a static version using jQuery only and that works in IE Edge. deveric19, are you using the Angular version or just the jQuery version?

[mapmyphotos]

Confirmed this issue isn't present in IE 11

[mapmyphotos]

These lines (#341 - #344) in jQCloud.js:

word_size = {
        width: word_span.width(),
        height: word_span.height()
};

The height of the word span is calculated as zero. I checked this by debugging in IE Edge. At this point in Chrome the word span has been added to the document and the height calculated correctly, however in IE Edge you can't see that it has been added to the document (not sure if this is just a display thing in IE Edge). I'll do some more digging around and see what I can find.

[mapmyphotos]

I re-wrote the height property to be fixed at 40 like this

word_size = {
        width: word_span.width(),
        height: 40
};

Now it's rendering (almost) correctly. This is not a valid work around, however it proves that the height not being set here is causing the issue.

[mapmyphotos]

If the height isn't set correctly to the word_size object, later on when the top positioning is calculated:

word_size.top = this.options.center.y*this.options.height - word_size.height / 2.0;

so:

word_size.top = this.options.center.y*this.options.height - (0) / 2.0;

then:

word_size.top = (0.5)*this.options.height;

In my case I set height to 500px, so:

word_size.top = (0.5)*500 = 250;

And all word spans will get the top positioning of 250, as shown in my first screenshot.

[mapmyphotos]

Quick fix, seems to work in IE Edge and Chrome: Write lines (#341 - #344) in jQCloud.js like this:

word_size = {
        width: word_span.width(),
        height: $(word_span.children()[0]).height()
};

Looks like IE Edge has a problem calculating the height of span elements, so here I'm using the height of the first child of the span.