Function initChartTypeGallery

apps/chart-maker/main.js:213–238

()

    // 初始化图表类型画廊
    function initChartTypeGallery() {
        // 获取所有图表类型预览项
        const chartTypeItems = document.querySelectorAll('.chart-type-item');
        
        // 为每个预览项添加点击事件
        chartTypeItems.forEach(item => {
            item.addEventListener('click', function() {
                const chartType = this.getAttribute('data-chart-type');
                
                // 更新活动状态
                chartTypeItems.forEach(item => item.classList.remove('active'));
                this.classList.add('active');
                
                // 无论是否有图表实例都应该重新生成图表
                // 删除之前的检查条件，始终调用generateChart
                generateChart();
            });
        });
        
        // 初始设置默认图表类型为活动状态
        const defaultChartType = "bar"; // 默认为柱状图
        const activeItem = document.querySelector(`.chart-type-item[data-chart-type="${defaultChartType}"]`);
        if (activeItem) {
            activeItem.classList.add('active');
        }
    }
    
    // 加载样例数据
    sampleDataBtn.addEventListener('click', function() {