I have added the below snippet to add the table and chart axis in excel. While clicking the Export to Excel button , no excel is downloaded in the browser. I need to draw a chart with the table data. I need a interactive chart in excel with data. I tried with canvas but canvas is exporting as an image. I don't need an image , need a interactive charts based on the table values. I have tried with the below code but its not working. Please suggest the changes or library to insert the chart in excel using JS
async function exportToExcel() {
const workbook = XLSX.utils.book_new();
const sheetName = "SalesData";
const wsData = [["Month", "Sales"], ["January", 1000], ["February", 2000]];
const ws = XLSX.utils.aoa_to_sheet(wsData);
XLSX.utils.book_append_sheet(workbook, ws, sheetName);
// Insert chart
await Excel.run(async (context) => {
const sheet = context.workbook.worksheets.getActiveWorksheet();
const chartRange = sheet.getRange("A1:B3"); // Assuming the data is in range A1:B3
const chart = sheet.charts.add(
Excel.ChartType.columnClustered,
chartRange,
Excel.ChartSeriesBy.columns
);
chart.title.text = "Sales Data";
chart.legend.position = Excel.ChartLegendPosition.right;
// Add category axis
chart.axes.valueAxis.hasTitle = true;
chart.axes.valueAxis.title.text = "Sales";
// Add value axis
chart.axes.categoryAxis.hasTitle = true;
chart.axes.categoryAxis.title.text = "Month";
await context.sync();
});
// Save Excel file
const excelData = XLSX.write(workbook, { bookType: 'xlsx', type: 'array' });
const blob = new Blob([excelData], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' });
saveAs(blob, 'sales_data_with_chart.xlsx');
}<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Export Data to Excel with Chart</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/xlsx/0.18.0/xlsx.full.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/FileSaver.js/2.0.5/FileSaver.min.js"></script>
</head>
<body>
<button onclick="exportToExcel()">Export to Excel</button>
<table id="dataTable" border="1">
<thead>
<tr>
<th>Month</th>
<th>Sales</th>
</tr>
</thead>
<tbody>
<tr>
<td>January</td>
<td>1000</td>
</tr>
<tr>
<td>February</td>
<td>2000</td>
</tr>
<!-- Add more rows here -->
</tbody>
</table>