1. 创建浮动容器

通过FloatingObject.content()方法为图表提供DOM容器：

function initFloatingObject(sheet, chart) {
    let floatObj = new GC.Spread.Sheets.FloatingObjects.FloatingObject(chart.id);
    floatObj.startRow(chart.startRow);
    floatObj.endRow(chart.endRow);
    floatObj.startColumn(chart.startColumn);
    floatObj.endColumn(chart.endColumn);
    let div = document.createElement('div');
    div.innerHTML = `
`;
    floatObj.content(div);
    sheet.floatingObjects.add(floatObj);
}

2. 初始化图表

容器创建完成后，实例化ECharts图表：

function initBarECharts(chart) {
    let dom = document.getElementById(chart.id);
    if (!dom) return;
    
    let myChart = echarts.init(dom);
    let data = getChartDataFromTables(chart.source);
    
    myChart.setOption({
        xAxis: { data: data.categories },
        series: [{
            type: 'bar',
            data: data.data,
            animation: true
        }]
    });
    return myChart;
}

3. 数据联动实现

通过ValueChanged事件实现表格数据变化时自动更新图表：

spread.bind(GC.Spread.Sheets.Events.ValueChanged, function (e, info) {
    for (let key in charts) {
        let range = new GC.Spread.Sheets.Range(
            charts[key].table.row, charts[key].table.col, 
            charts[key].table.rowCount, charts[key].table.colCount
        );
        if (range.contains(info.row, info.col, 1, 1)) {
            refreshCharts(charts[key].id, getChartDataFromTables(charts[key].source));
            break;
        }
    }
});

4. 可视区域同步

滚动事件确保图表在可视区域内正确渲染：

spread.bind(GC.Spread.Sheets.Events.TopRowChanged, function (s, e) {
    let newTopRow = e.newTopRow;
    if ((charts["line"].startRow - 5 < newTopRow) && (!charts["line"].echart)) {
        initCharts(charts["line"]);
    }
});

5. PDF导出解决方案

通过临时Workbook和图片转换实现图表导出：

document.getElementById("saveAsPdf").addEventListener("click", function () {
    let tempSpread = new GC.Spread.Sheets.Workbook();
    tempSpread.fromJSON(JSON.parse(JSON.stringify(spread.toJSON({ includeBindingSource: true }))));
    let tempSheet = tempSpread.getSheet(0);
    
    for (let key in charts) {
        if (!charts[key].echart) {
            // 触发初始化逻辑...
        }
        
        let imgData = charts[key].echart.getDataURL();
        tempSheet.floatingObjects.remove(charts[key].id);
        
        let pic = tempSheet.shapes.addPictureShape(charts[key].id, imgData, 0, 0, 100, 100);
        pic.startRow(charts[key].startRow);
        pic.endRow(charts[key].endRow);
    }
    
    tempSpread.savePDF(function (blob) {
        saveAs(blob, 'report.pdf');
    });
});