z-index issue with html2canvas

[devPranav]

I am trying develop an collage maker in my website where user can place their image anywhere in div and create an collage and download that design as image. I used your cool tool html2canvas for that. It use fine if their is no image overlapping if their is an image overlap then it shows image with negative z-index on upper side of positive z-index i want to convert that div as it is in image but it shows some different behavior in case of image overlapping.please give me solution

[hibissscus]

Yes, have same problem, if I have z-index elements, some of them on the final image are on top - and image looks weird.

[niklasvh]

@hibissscus Can you show an example on jsfiddle?

[hibissscus]

@niklasvh https://jsfiddle.net/69kc2t2y/15/ some overlap

[hibissscus]

@niklasvh I created other example https://jsfiddle.net/8h3r5wr1/ if we scroll table a bit, and then try to take a picture -> we got overlap

[Zaccc123]

I got the same issue, @hibissscus do you find any workaround for this?

[pupunzi]

The same here. It doesn't matter what is the z-index assigned to each element; the rendered image has the wrong elements order. You can see an example here: https://www.open-lab.com/storyboarder/footballdrama/ From the right column add different "sprites"; you'll see that the generated thumbnail is wrong. And if you save the image it will be more evident.

This is how it looks in the editor:

And this is the generated image:

[Diegoafv]

Same.