Grafiklerde Arka Plan Doldurması olarak Resim Ayarlama (JavaScript ile C++ kullanarak)

Bunu başarmak için, Aspose.Cells Chart.plotArea özelliğini sağlar. Aşağıdaki kod örneği, bir resmi bir grafikte arka plan olarak ayarlamak için Chart.plotArea özelliğini kullanımını göstermektedir.

Grafiklerde arka plan doldurması ayarlamak için JavaScript kodu

<!DOCTYPE html>
<html>
    <head>
        <title>Aspose.Cells Example</title>
        <meta charset="utf-8" />
    </head>
    <body>
        <h1>Aspose.Cells Column Chart Example</h1>
        <p>
            Select an Excel file (sample.xlsx) and an optional image (aspose.png) for chart fill:
        </p>
        <input type="file" id="fileInput" accept=".xls,.xlsx,.csv" />
        <input type="file" id="imageInput" accept="image/*" />
        <button id="runExample">Run Example</button>
        <a id="downloadLink" style="display: none;">Download Result</a>
        <div id="result"></div>
    </body>

    <script src="aspose.cells.js.min.js"></script>
    <script type="text/javascript">
        const { Workbook, SaveFormat, Utils } = AsposeCells;

        AsposeCells.onReady({
            license: "/lic/aspose.cells.enc",
            fontPath: "/fonts/",
            fontList: [
                "arial.ttf",
                "NotoSansSC-Regular.ttf"
            ]
        }).then(() => {
            console.log("Aspose.Cells initialized");
        });

        document.getElementById('runExample').addEventListener('click', async () => {
            const fileInput = document.getElementById('fileInput');
            const imageInput = document.getElementById('imageInput');
            const resultDiv = document.getElementById('result');
            const downloadLink = document.getElementById('downloadLink');

            if (!fileInput.files.length) {
                resultDiv.innerHTML = '<p style="color: red;">Please select an Excel file.</p>';
                return;
            }

            // Read Excel file
            const file = fileInput.files[0];
            const arrayBuffer = await file.arrayBuffer();
            const workbook = new Workbook(new Uint8Array(arrayBuffer));

            // Get the first worksheet and set its name to "Data"
            let sheet = workbook.worksheets.get(0);
            sheet.name = "Data";

            // Get the cells collection in the sheet.
            const cells = workbook.worksheets.get(0).cells;

            // Put some values into cells of the Data sheet.
            let cell;
            cell = cells.get("A1"); cell.value = "Region";
            cell = cells.get("A2"); cell.value = "France";
            cell = cells.get("A3"); cell.value = "Germany";
            cell = cells.get("A4"); cell.value = "England";
            cell = cells.get("A5"); cell.value = "Sweden";
            cell = cells.get("A6"); cell.value = "Italy";
            cell = cells.get("A7"); cell.value = "Spain";
            cell = cells.get("A8"); cell.value = "Portugal";
            cell = cells.get("B1"); cell.value = "Sale";
            cell = cells.get("B2"); cell.value = 70000;
            cell = cells.get("B3"); cell.value = 55000;
            cell = cells.get("B4"); cell.value = 30000;
            cell = cells.get("B5"); cell.value = 40000;
            cell = cells.get("B6"); cell.value = 35000;
            cell = cells.get("B7"); cell.value = 32000;
            cell = cells.get("B8"); cell.value = 10000;

            // Add a chart sheet.
            let sheetIndex = workbook.worksheets.add(AsposeCells.SheetType.Chart);
            sheet = workbook.worksheets.get(sheetIndex);

            // Set the name of worksheet
            sheet.name = "Chart";

            // Create chart
            let chartIndex = sheet.charts.add(AsposeCells.ChartType.Column, 1, 1, 25, 10);
            const chart = sheet.charts.get(chartIndex);

            // Set some properties of chart plot area.
            // If an image was provided, set it as fill format and make the border invisible.
            if (imageInput.files.length) {
                const imgFile = imageInput.files[0];
                const imgBuffer = await imgFile.arrayBuffer();
                const imgBytes = new Uint8Array(imgBuffer);
                chart.plotArea.area.fillFormat.imageData = imgBytes;
            }
            chart.plotArea.border.isVisible = false;

            // Set properties of chart title
            chart.title.text = "Sales By Region";
            chart.title.font.color = AsposeCells.Color.Blue;
            chart.title.font.isBold = true;
            chart.title.font.size = 12;

            // Set properties of nseries
            chart.nSeries.add("Data!B2:B8", true);
            chart.nSeries.categoryData = "Data!A2:A8";
            chart.nSeries.isColorVaried = true;

            // Set the Legend.
            const legend = chart.legend;
            legend.position = AsposeCells.LegendPositionType.Top;

            // Save the excel file
            const outputData = workbook.save(SaveFormat.Excel97To2003);
            const blob = new Blob([outputData]);
            downloadLink.href = URL.createObjectURL(blob);
            downloadLink.download = 'column_chart_out.xls';
            downloadLink.style.display = 'block';
            downloadLink.textContent = 'Download Excel File';

            resultDiv.innerHTML = '<p style="color: green;">Operation completed successfully! Click the download link to get the modified file.</p>';
        });
    </script>
</html>