mp-lens/dist/ui/main.js

微信小程序分析工具 (Unused Code, Dependencies, Visualization)

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const jsx_runtime_1 = require("preact/jsx-runtime");
const chart_js_1 = require("chart.js"); // Import Chart.js and ChartType
const preact_1 = require("preact");
const App_1 = require("./components/App"); // Re-added App import
require("./index.css");
// Register necessary Chart.js components
chart_js_1.Chart.register(...chart_js_1.registerables);
let currentCharts = []; // Keep track of chart instances
/**
 * Client-side rendering function
 */
function performRender() {
    // Check if the graph data is available, which is now the primary source
    if (!window.__MP_LENS_GRAPH_DATA__) {
        console.error('Could not find __MP_LENS_GRAPH_DATA__. Render failed.');
        (0, preact_1.render)((0, jsx_runtime_1.jsx)("div", { children: "Error: Graph data not found." }), document.getElementById('app'));
        return;
    }
    const rootElement = document.getElementById('app');
    if (!rootElement) {
        console.error('Could not find mount point #app. Render failed.');
        return;
    }
    // Render the app - App no longer takes a `data` prop derived from __MP_LENS_DATA__
    (0, preact_1.render)((0, jsx_runtime_1.jsx)(App_1.App, {}), rootElement); // Pass AppProps if defined and needed
    // Call initCharts AFTER rendering App, as it relies on elements created by App
    initCharts();
    console.log('Application rendered successfully.');
}
/**
 * 初始化图表
 */
function initCharts() {
    // Clear previous chart instances to prevent memory leaks on re-renders
    currentCharts.forEach((chart) => chart.destroy());
    currentCharts = [];
    // Find all canvas elements with chart data
    const chartCanvases = document.querySelectorAll('canvas[data-chart-data]');
    chartCanvases.forEach((canvas) => {
        var _a, _b;
        const chartType = canvas.dataset.chartType;
        const chartDataString = canvas.dataset.chartData;
        if (!chartType || !chartDataString) {
            console.warn('Canvas missing chart type or data', canvas.id);
            return;
        }
        try {
            const data = JSON.parse(chartDataString);
            const ctx = canvas.getContext('2d');
            if (!ctx) {
                console.error('Failed to get canvas context for', canvas.id);
                return;
            }
            const newChart = new chart_js_1.Chart(ctx, {
                type: chartType,
                data: {
                    labels: data.labels,
                    datasets: [
                        {
                            label: ((_b = (_a = canvas.parentElement) === null || _a === void 0 ? void 0 : _a.querySelector('h3')) === null || _b === void 0 ? void 0 : _b.innerText) || 'Dataset', // Get title from parent h3
                            data: data.values,
                            backgroundColor: data.colors || '#4285F4',
                            borderColor: '#fff',
                            borderWidth: chartType === 'pie' ? 1 : 0, // Add border to pie slices
                        },
                    ],
                },
                options: {
                    responsive: true,
                    maintainAspectRatio: false, // Allow chart to fill container
                    plugins: {
                        legend: {
                            display: chartType !== 'pie', // Hide legend for pie chart maybe?
                        },
                    },
                    // Add other options as needed
                },
            });
            currentCharts.push(newChart); // Store instance
        }
        catch (e) {
            console.error('Failed to parse chart data or render chart:', canvas.id, e);
        }
    });
    if (chartCanvases.length > 0) {
        console.log(`Initialized ${currentCharts.length} charts.`);
    }
    else {
        // console.log('No chart canvases found to initialize.');
    }
}
// Run render when DOM is ready
if (typeof window !== 'undefined') {
    if (document.readyState === 'loading') {
        document.addEventListener('DOMContentLoaded', performRender);
    }
    else {
        performRender();
    }
}
//# sourceMappingURL=main.js.map