Function exportChart

apps/chart-maker/main.js:550–632

(format)

    
    // 导出图表为图像
    function exportChart(format) {
        const chartWrapper = document.getElementById('chart-wrapper');
        
        // 创建加载指示器
        const loadingOverlay = document.createElement('div');
        loadingOverlay.className = 'loading-overlay';
        loadingOverlay.innerHTML = '<div class="loading-spinner"></div>';
        chartWrapper.appendChild(loadingOverlay);
        
        setTimeout(() => {
            // 获取原始canvas的尺寸
            const originalCanvas = document.getElementById('chart-canvas');
            const width = originalCanvas.width;
            const height = originalCanvas.height;
            
            // 创建一个临时的高分辨率canvas
            const tempCanvas = document.createElement('canvas');
            const tempCtx = tempCanvas.getContext('2d');
            
            // 设置更高的分辨率
            const scale = 8; // 提升到8倍分辨率
            tempCanvas.width = width * scale;
            tempCanvas.height = height * scale;
            
            // 优化渲染质量
            tempCtx.imageSmoothingEnabled = true;
            tempCtx.imageSmoothingQuality = 'high';
            
            html2canvas(originalCanvas, {
                backgroundColor: '#ffffff',
                scale: scale, // 使用8倍缩放
                width: width,
                height: height,
                useCORS: true,
                allowTaint: true,
                logging: false,
                imageTimeout: 0,
                onclone: (document) => {
                    const clonedCanvas = document.getElementById('chart-canvas');
                    if(clonedCanvas) {
                        clonedCanvas.style.width = width + 'px';
                        clonedCanvas.style.height = height + 'px';
                    }
                },
                // 添加高级渲染选项
                canvas: tempCanvas,
                renderCallback: (canvas) => {
                    // 应用锐化效果
                    const ctx = canvas.getContext('2d');
                    ctx.filter = 'contrast(1.1) saturate(1.2)';
                }
            }).then(canvas => {
                // 移除加载指示器
                loadingOverlay.remove();
                
                // 导出图像时使用更高的质量设置
                let imgUrl;
                if (format === 'jpg') {