///
Mind Map Wizard provides robust capabilities for exporting your generated mind maps into various formats, allowing for flexible usage, sharing, and integration with other tools. This section details t
58 views
~58 views from guests
Guest views are estimated from total page views. These include anonymous visitors and users who weren't logged in when they viewed the page.
Mind Map Wizard provides robust capabilities for exporting your generated mind maps into various formats, allowing for flexible usage, sharing, and integration with other tools. This section details the available export options and the underlying processes.
Users can save their AI-generated mind maps in several popular formats, each suited for different purposes:
The download functionality is initiated via the "Download" button, accessible through the toolbar when a mind map is displayed, or by using the <kbd>D</kbd> keyboard shortcut. Clicking this button triggers a pop-up window, allowing the user to select their preferred export format.
The initializeDownloadFeatures function in scripts/new.js sets up the event listeners for the download button, the options popup, and the format selection. When the "Download" button is clicked, the download-options-popup becomes visible. Users then select a format from the download-format dropdown and click the download-btn to proceed.
The core logic for handling downloads resides in two main JavaScript functions: downloadMindmap and downloadAsImage, both located in scripts/new.js.
downloadMindmap(format)This asynchronous function is the primary entry point for most download requests.
DownloadHandler.getMindmapElements() to get a reference to the SVG element representing the mind map and its current title. If no mind map is displayed, an error is thrown..md):
format is 'markdown', the function directly accesses the currentMarkdown variable (which holds the raw Markdown text of the mind map).Blob is created with the Markdown text, and DownloadHandler.triggerDownload() is used to initiate the download of a .md file..svg):
DownloadHandler.getSVGData(svg, padding) is called. This function clones the SVG element, adjusts its width, height, and viewBox attributes to include a padding around the content, and then serializes it into an XML string. This ensures the exported SVG captures the entire mind map with appropriate margins.Blob is created from the SVG content, and DownloadHandler.triggerDownload() saves it as an .svg file..pdf):
DownloadHandler.downloadPDF() function handles this. It takes the serialized SVG content, along with its dimensions (width, height), and the mind map topic.canvas element and uses an Image object to draw the SVG content onto the canvas. This is a crucial step for converting the vector graphic into a raster image, which can then be embedded into a PDF. A scale factor (1.8) is applied to enhance image quality within the PDF.jsPDF instance. It calculates optimal positioning and scaling to fit the mind map within the PDF page, supporting both portrait and landscape orientations based on the mind map's aspect ratio.pdf.addImage() embeds the canvas content (as a JPEG data URL) into the PDF, and pdf.save() triggers the download of the .pdf file..jpg):
DownloadHandler.downloadJPG() function is used, which similarly uses the getSVGData method to obtain scaled SVG content.canvas element and draws the SVG content onto it, with a scale factor (2.0) for better image quality. The background is filled with white (#ffffff).canvas.toDataURL('image/jpeg', 1.0)).DownloadHandler.dataURLToBlob() converts this data URL into a Blob, which is then passed to DownloadHandler.triggerDownload() to save the .jpg file.downloadAsImage()This function is specifically responsible for downloading the mind map as a PNG file.
Image object loads this SVG data. Upon loading, it draws the image onto a canvas element, applying a scale factor (1.8).canvas.toDataURL('image/png', 1.0), which generates a PNG image, supporting lossless compression.mindmap.png.For raster image formats (JPG, PNG) and PDF, the process typically involves:
<canvas> element. This involves creating an Image object, setting its src to a data URL of the SVG, and then using the canvas's 2D rendering context (drawImage) to render the SVG.canvas.toDataURL() method is used to convert the canvas content into a data URL for either JPEG or PNG formats. For PDF, this image data is then passed to the jsPDF library. Scaling factors are often applied during this conversion to ensure higher resolution outputs.After a successful download, both downloadMindmap and downloadAsImage call trackEvent('mm_downloaded', { download_format: fileExtension, watermark_inserted: 'false' }) to send an analytics event, capturing which format was downloaded.
These features ensure that users can easily export their mind maps in the most appropriate format for their specific needs, as detailed in [Core Features].