Sometimes Images not appearing in exported Graph/Paper on Chrome

This issue has been tracked since 2021-10-29.

Sometime images not appearing in exported PNG file on chrome.
FYI on Firefox its working fine.
The images are coming from S3 and where working fine earlier with chrome version Version 92.0.4515.159 (Official Build) (64-bit) current chrome version Version 95.0.4638.54 (Official Build) (64-bit)

The code to export is as follows and the images are getting loading in network tab as well of chrome

paper.toPNG(function (dataURI) {
      const link = document.createElement("a");
      link.href = dataURI;
      link.setAttribute("download", 'fileName.png');
      document.body.appendChild(link);
      link.click();
    });

Graph Contain
CanvasImage

Exported Graph
new canvas (3)

kumilingus wrote this answer on 2021-10-29

What is the xlink:href attribute of the image exactly? Do you see any error in the console?

patilvishal755 wrote this answer on 2021-10-29

Hi @kumilingus ,

In xlink:href value is https://ilmvp-public-resources.s3.amazonaws.com/genericUserProfile.png (this is public bucket but we have private bucket as well from where the images are coming)
and there is no error in console

FYI: earlier we use get cross-origin issue but we fixed it with crossorigin: 'anonymous',

Thanks

kumilingus wrote this answer on 2021-10-29

Are you able to reproduce it with this setup?

graph.fromJSON({
    cells: [{
        type: 'standard.BorderedImage',
        size: { width: 200, height: 200 },
        attrs: {
            image: {
                xlinkHref: 'https://ilmvp-public-resources.s3.amazonaws.com/genericUserProfile.png'
            }
        }
    }]
});

I am not. How do you serve the application? Via an http-server or the file system? (It does not supposed to work if served via file:// protocol - only FF does not complain). How about other browsers?

What is the result of this:

paper.toSVG(function(stringSVG) { console.log(stringSVG) }, { convertImagesToDataUris: true });
More Details About Repo
Owner Name clientIO
Repo Name joint
Full Name clientIO/joint
Language JavaScript
Created Date 2009-09-11
Updated Date 2022-12-03
Star Count 3715
Watcher Count 155
Fork Count 817
Issue Count 51

YOU MAY BE INTERESTED

Issue Title Created Date Updated Date