I have a mind mapping app that has been running well on Android for a few years now. I have been trying to publish it for iOS and MacOS for some time now. On iOS (as an app) and MacOS (in the browser for testing) I have a problem with the export. The app is a project in Angular, Cordova, Typescript. The problem only occurs in the Safari browser, which is also used in the Cordova version for iOS. I was able to test it on my Mac and an iPhone. The error does not occur on the Mac in Chrome. The Problem If I export a mind map that contains images as an image (.png), the images of the nodes are not displayed in the exports. Everything else in the map is exported correctly, only the images are missing. Only when I export the map three times are the images present in the export. If I add a new image and export it again, the image is only visible in the exported image after 3 exports. It is interesting that the export as SVG, which I also offer, contains the images of the nodes. So the SVG string that I create has all the necessary information. The base The mind map consists of various things. HTML and CSS for the frames, lines etc... The images of the nodes are saved as Base64 and each node is in a Foreign Object. Example of the SVG export Mindmap with 2 nodes and the Base64 characters of the node images have been replaced with ***. __ SVG-String.txt Attached because otherwise too long. This is how I export the .png file. I can view all this content in the map view of the app. When exporting to an image, I take this information, turn it into an SVG, have the browser draw it on the canvas and then output it as a graphic. Something must be going wrong at this point. private exportAsImage( mindMap: MindMap, scale?: number, type: string = "png" ): Observable<any> { return new Observable(o => { this.progress.start(this.progress.PROGRESS_MAJOR); this.mmpMap.export(this.mapVizService.getExportClassList(mindMap), (svgStr: string) => { this.exportService.imageFromSVGString(svgStr, type, scale).pipe( switchMap(img => of( Utils.dataURItoFileObject( img.dataUri, `${Utils.sanitizeFilename(mindMap.title)}.${type}` ) ) ), switchMap((fileObject: FileObject) => this.mapsService.saveAsTemp(fileObject, true, { message: this.translate.instant("mdz.mindmap.saveas.message"), // subject: this.translate.instant("mdz.mindmap.saveas.subject"), subject: fileObject.name, url: `www.myURL.com` }, true) ) ).subscribe(() => { this.progress.stop(this.progress.PROGRESS_MAJOR); o.next(); o.complete(); }, err => { this.progress.stop(this.progress.PROGRESS_MAJOR); o.error(err); o.complete(); }); }) }); } What I have already tried. I have already tested various things such as time delays etc..., none of which change anything. It seems to me that it's a combination of the caching and the order or speed at which the images are loaded. Only the speed can't be, because built-in delays don't change anything. My guess But it must have something to do with Safari because on the Mac in Chrome it runs without problems... Maybe it can't handle so many base64 images or it exports faster than it renders? Whereby the SVG export contains all the information and when I open the SVG, all the content is also displayed in the browser in seconds. So something must happen when painting on the canvas and outputting as an image. It doesn't really make sense, I'm really at the end of my ideas. What can you do? I really hope you can help me. A mind mapping app without image export makes little sense. And since the app otherwise works great, I'm really getting desperate. :( Thanks a lot! Rob

Hi, I would like to publish my app on Apple devices as well. Unfortunately I have a problem with the "porting" that I just can't solve. I have been offering my app on Android for a long time and everything runs great there. The problem is I have an SVG which needs to be converted to an image. The starting point for the SVG is a mindmap with several nodes. Each node is a and contains various data. Among other things this can also contain a small base64 encoded image. The SVG is displayed completely correctly in the browser. For exporting the mindmap I have to convert it to an image. For the conversion I use the Canvas API. This works great on Android but on Mac it always exports the mindmap without the images. I have tried everything possible. But can't get any further. Who is rendering the graphics? Is it possible that the Canvas API on Safari is a different version and may not be able to do things that are supported in Chrome? Could it have problems with the base64 encoding? Because otherwise it shows everything but the images are missing. Does anyone have an idea and could help me? It hangs really only on the one thing and I do not get it. :( Thanks already. Tom