Rendere lo slicer con JavaScript tramite C++
Contents
[
Hide
]
Possibili Scenari di Utilizzo
Aspose.Cells for JavaScript tramite C++ supporta il rendering delle forme dello slicer. Se converti il foglio di lavoro in un’immagine o salvi il file in formato PDF o HTML, vedrai che gli slicer vengono renderizzati correttamente.
Rendering dello slicer
Il seguente esempio di codice carica il file Excel di esempio che contiene uno slicer esistente. Converte il foglio di lavoro in un’immagine impostando l’area di stampa che copre solo lo slicer. L’immagine risultante è l'immagine di output che mostra lo slicer reso. Come puoi vedere, lo slicer è stato renderizzato correttamente e appare come nel file Excel di esempio.
Codice di Esempio
<!DOCTYPE html>
<html>
<head>
<title>Aspose.Cells Example - Render Slicer to Image</title>
</head>
<body>
<h1>Render Slicer to Image</h1>
<input type="file" id="fileInput" accept=".xls,.xlsx,.csv" />
<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, ImageOrPrintOptions, ImageType, SheetRender, 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');
if (!fileInput.files.length) {
document.getElementById('result').innerHTML = '<p style="color: red;">Please select an Excel file.</p>';
return;
}
const file = fileInput.files[0];
const arrayBuffer = await file.arrayBuffer();
// Instantiating a Workbook object from uploaded file
const wb = new Workbook(new Uint8Array(arrayBuffer));
// Access first worksheet.
const ws = wb.worksheets.get(0);
// Set the print area because we want to render slicer only.
ws.pageSetup.printArea = "B15:E25";
// Specify image or print options, set one page per sheet and only area to true.
const imgOpts = new ImageOrPrintOptions();
imgOpts.horizontalResolution = 200;
imgOpts.verticalResolution = 200;
imgOpts.imageType = ImageType.Png;
imgOpts.onePagePerSheet = true;
imgOpts.onlyArea = true;
// Create sheet render object and render worksheet to image.
const sr = new SheetRender(ws, imgOpts);
// Render to image (first page/index 0) and prepare download link
const imageData = sr.toImage(0);
const blob = new Blob([imageData], { type: 'image/png' });
const downloadLink = document.getElementById('downloadLink');
downloadLink.href = URL.createObjectURL(blob);
downloadLink.download = 'outputRenderingSlicer.png';
downloadLink.style.display = 'block';
downloadLink.textContent = 'Download Rendered Image';
document.getElementById('result').innerHTML = '<p style="color: green;">Rendering completed successfully! Click the download link to get the image.</p>';
});
</script>
</html>