cleanup js script

Signed-off-by: Andrei Gherghescu <[email protected]>

Author: andrei-ng

plotly_static/src/template.rs

@@ -43,92 +43,62 @@ pub(crate) const PDF_EXPORT_JS_SCRIPT: &str = r##"
     const scale = arguments[4];
     const callback = arguments[arguments.length - 1];
 
-    console.log('Starting PDF export process...');
-    console.log('Plot data:', plot);
-    console.log('Dimensions:', width, 'x', height);
-
     const graph_div = document.getElementById('plotly-html-element');
 
-    // Check if html2pdf is available
     if (typeof html2pdf === 'undefined') {
-        console.error('html2pdf library not available');
         callback('ERROR:html2pdf library not loaded');
         return;
     }
 
-    console.log('html2pdf library is available');
-
     let tempDiv = null;
-    let mmWidth, mmHeight;
 
-    Plotly.newPlot(graph_div, plot).then(function() {
-        console.log('Plotly plot created successfully');
+    const cleanup = () => {
+        if (tempDiv) {
+            document.body.removeChild(tempDiv);
+        }
+    };
 
-        // Force PNG format for PDF export to test if SVG is the issue
+    Plotly.newPlot(graph_div, plot).then(function() {
         return Plotly.toImage(graph_div, {
-        format: 'png',
-        width: width,
-        height: height,
+            format: format,
+            width: width,
+            height: height,
         });
     }).then(function(dataUrl) {
-        console.log('Plotly image generated successfully');
-        console.log('SVG data URL length:', dataUrl.length);
-        console.log('SVG data URL preview:', dataUrl.substring(0, 200) + '...');
-
-        // Convert px to mm: 1px = 0.264583 mm
-        mmWidth = width * 0.264583;
-        mmHeight = height * 0.264583;
-
-        console.log('PDF dimensions (mm):', mmWidth, 'x', mmHeight);
-
-        // Create a temporary div for the image
         tempDiv = document.createElement('div');
         tempDiv.style.width = width + 'px';
         tempDiv.style.height = height + 'px';
         tempDiv.style.background = 'white';
         tempDiv.style.position = 'fixed';
-        tempDiv.style.left = '0px';
-        tempDiv.style.top = '0px';
-        tempDiv.style.overflow = 'hidden';
+        tempDiv.style.top = '0';
+        tempDiv.style.left = '0';
+        tempDiv.style.margin = '0';
+        tempDiv.style.padding = '0';
         tempDiv.style.boxSizing = 'border-box';
-        tempDiv.style.zIndex = '9999';
-        tempDiv.style.display = 'block';
         document.body.appendChild(tempDiv);
 
-        // Use simple img approach with SVG data URL
-        console.log('Using SVG data URL directly with img element');
         const img = document.createElement('img');
         img.src = dataUrl;
+        img.style.display = 'block';
+        img.style.margin = '0';
+        img.style.padding = '0';
         img.style.width = '100%';
         img.style.height = '100%';
-        img.style.display = 'block';
-        img.style.objectFit = 'contain';
-        img.style.maxWidth = '100%';
-        img.style.maxHeight = '100%';
+        img.style.verticalAlign = 'top';
+        img.style.boxSizing = 'border-box';
         tempDiv.appendChild(img);
 
-        // Wait for the image to load
         return new Promise(function(resolve) {
             img.onload = function() {
-                console.log('SVG image loaded successfully');
-                // Additional delay to ensure image is fully rendered
-                setTimeout(function() {
-                    console.log('SVG rendering delay completed');
-                    resolve();
-                }, 500);
+                // Brief delay to ensure image is fully rendered
+                setTimeout(resolve, 150);
             };
             img.onerror = function() {
-                console.error('Failed to load SVG image');
-                if (tempDiv) {
-                    document.body.removeChild(tempDiv);
-                }
-                callback('ERROR:Failed to load SVG image');
+                cleanup();
+                callback('ERROR:Failed to load image');
             };
         });
     }).then(function() {
-        console.log('Starting PDF generation...');
-
-        // Generate PDF with more robust configuration
         return html2pdf().from(tempDiv).set({
             margin: 0,
             filename: 'plotly-plot.pdf',
@@ -143,28 +113,22 @@ pub(crate) const PDF_EXPORT_JS_SCRIPT: &str = r##"
                 height: height,
                 imageTimeout: 15000,
                 removeContainer: true,
-                foreignObjectRendering: true
+                foreignObjectRendering: false,
+                scrollY: 0,
+                scrollX: 0
             },
             jsPDF: {
-                unit: 'mm',
-                format: [mmWidth, mmHeight],
-                orientation: mmWidth > mmHeight ? 'landscape' : 'portrait',
+                unit: 'px',
+                format: [width, height],
+                orientation: width > height ? 'landscape' : 'portrait',
                 compress: true
             }
         }).toPdf().output('datauristring');
     }).then(function(dataUri) {
-        console.log('PDF generation completed successfully');
-            // Clean up
-        if (tempDiv) {
-            document.body.removeChild(tempDiv);
-        }
-            callback(dataUri);
-        }).catch(function(err) {
-        console.error('PDF generation error:', err);
-        // Clean up if tempDiv exists
-        if (tempDiv) {
-            document.body.removeChild(tempDiv);
-        }
+        cleanup();
+        callback(dataUri);
+    }).catch(function(err) {
+        cleanup();
         callback('ERROR:' + err.toString());
     });
 "##;