【微信小程序】导出 Excel 报表并分享，使用xlsx库生成 Excel,使用echars插入图表、使用pdfmake导出为PDF文件
这里写目录标题
- 生成EXCEL
- 插入汇总和图表
- 导出为PDF
生成EXCEL
要在微信小程序中导出 Excel 报表并分享，可以使用第三方库 xlsx 来生成 Excel 文件，并使用 wx.saveFile 方法将文件保存到本地，然后使用 wx.shareFile 方法来分享文件。
以下是一个示例代码，演示如何在微信小程序中导出 Excel 报表并分享：
- 首先，安装依赖库
xlsx，可以使用 npm 进行安装：
npm install xlsx
- 在小程序的页面中引入
xlsx库，并定义一个导出 Excel 报表的方法：
// 引入依赖库
const XLSX = require('xlsx');
// 定义导出 Excel 报表的方法
function exportExcel(data, filename) {
const workbook = XLSX.utils.book_new();
const sheet = XLSX.utils.aoa_to_sheet(data);
XLSX.utils.book_append_sheet(workbook, sheet, 'Sheet1');
const excelBuffer = XLSX.write(workbook, { bookType: 'xlsx', type: 'array' });
const filePath = `${wx.env.USER_DATA_PATH}/${filename}.xlsx`;
wx.saveFile({
tempFilePath: filePath,
filePath: filePath,
success: function(res) {
const savedFilePath = res.savedFilePath;
wx.shareFile({
filePath: savedFilePath,
success: function(res) {
console.log('分享成功');
},
fail: function(error) {
console.log('分享失败', error);
}
});
},
fail: function(error) {
console.log('保存文件失败', error);
}
});
}
在上述示例代码中，我们通过 require 语句引入了 xlsx 库。然后，定义了一个名为 exportExcel 的方法，该方法接受两个参数：data 表示要导出的数据，filename 表示导出文件的文件名。
在 exportExcel 方法中，我们使用 xlsx 库将数据转换为 Excel 格式，并使用 XLSX.write 方法将工作簿写入到一个数组中。然后，使用 wx.saveFile 方法将数组保存到本地文件，并通过 wx.shareFile 方法来分享文件。
接下来，你可以调用 exportExcel 方法来导出 Excel 报表并分享文件：
// 示例数据
const data = [
['姓名', '年龄', '性别'],
['张三', 25, '男'],
['李四', 30, '女'],
['王五', 28, '男']
];
// 调用导出 Excel 报表的方法
exportExcel(data, '报表');
在上述示例中，我们定义了一个名为 data 的数组，其中包含了要导出的数据。然后，调用 exportExcel 方法来导出 Excel 报表，并指定文件名为 '报表'。
请注意，上述示例代码仅供参考，具体的实现方式可能需要根据你的实际需求进行调整。
插入汇总和图表
使用 echarts 库来生成图表。
以下是一个示例代码，演示如何在微信小程序中导出 Excel 报表并在汇总中插入图表：
- 首先，安装依赖库
xlsx和echarts，可以使用 npm 进行安装：
npm install xlsx echarts
- 在小程序的页面中引入
xlsx和echarts库，并定义一个生成图表数据的方法：
// 引入依赖库
const XLSX = require('xlsx');
const echarts = require('echarts');
// 定义生成图表数据的方法
function generateChartData() {
const xAxisData = ['张三', '李四', '王五', '赵六'];
const seriesData = [85, 90, 95, 80];
return {
xAxis: {
type: 'category',
data: xAxisData
},
yAxis: {
type: 'value'
},
series: [{
data: seriesData,
type: 'bar'
}]
};
}
在上述示例代码中，我们通过 require 语句引入了 xlsx 和 echarts 库。然后，定义了一个名为 generateChartData 的方法，该方法用于生成图表的数据。
在 generateChartData 方法中，我们定义了 xAxisData 和 seriesData 数组，分别表示图表的 x 轴和 y 轴数据。然后，将这些数据组装成一个对象，包含了图表的配置信息。
接下来，你可以使用 echarts 库来生成图表，并将图表数据插入到 Excel 文件的汇总中：
// 定义导出 Excel 报表的方法
function exportExcel(data, filename) {
const workbook = XLSX.utils.book_new();
const sheet = XLSX.utils.aoa_to_sheet(data);
// 生成图表数据
const chartData = generateChartData();
// 创建 chart sheet
const chartSheet = XLSX.utils.aoa_to_sheet([
['姓名', '成绩'],
['张三', chartData.series[0].data[0]],
['李四', chartData.series[0].data[1]],
['王五', chartData.series[0].data[2]],
['赵六', chartData.series[0].data[3]],
]);
// 在 chart sheet 中插入图表
const chart = echarts.init(document.createElement('canvas'), null, {
devicePixelRatio: 2
});
const option = chartData;
chart.setOption(option);
const chartImage = new Image();
chartImage.src = chart.getDataURL({
type: 'png',
pixelRatio: 2
});
XLSX.utils.sheet_add_image(chartSheet, chartImage, {
tl: { col: 0, row: 6 },
br: { col: 5, row: 18 }
});
// 添加 sheets 到 workbook
XLSX.utils.book_append_sheet(workbook, sheet, '数据');
XLSX.utils.book_append_sheet(workbook, chartSheet, '汇总');
// 生成 Excel 文件
const excelBuffer = XLSX.write(workbook, { bookType: 'xlsx', type: 'array' });
const filePath = `${wx.env.USER_DATA_PATH}/${filename}.xlsx`;
// 保存文件并分享
wx.saveFile({
tempFilePath: filePath,
filePath: filePath,
success: function(res) {
const savedFilePath = res.savedFilePath;
wx.shareFile({
filePath: savedFilePath,
success: function(res) {
console.log('分享成功');
},
fail: function(error) {
console.log('分享失败', error);
}
});
},
fail: function(error) {
console.log('保存文件失败', error);
}
});
}
在上述示例代码中，我们在 exportExcel 方法中添加了一些额外的逻辑来生成图表数据并将图表插入到 Excel 文件的汇总中。
首先，我们创建了一个名为 chartSheet 的 chart sheet，并使用 XLSX.utils.aoa_to_sheet 方法将图表数据转换为 sheet 数据。然后，使用 echarts 库创建一个图表实例，并设置图表的配置项。接着，使用 chart.getDataURL 方法将图表转换为图片，并使用 XLSX.utils.sheet_add_image 方法将图表图片插入到 chart sheet 中。
最后，我们将数据 sheet 和 chart sheet 添加到工作簿中，并通过 XLSX.write 方法将工作簿写入到一个数组中。然后，使用 wx.saveFile 方法将数组保存到本地文件，并使用 wx.shareFile 方法来分享文件。
接下来，你可以调用 exportExcel 方法来导出 Excel 报表并分享文件：
// 示例数据
const data = [
['姓名', '年龄', '性别'],
['张三', 25, '男'],
['李四', 30, '女'],
['王五', 28, '男']
];
// 调用导出 Excel 报表的方法
exportExcel(data, '报表');
在上述示例中，我们定义了一个名为 data 的数组，其中包含了要导出的数据。然后，调用 exportExcel 方法来导出 Excel 报表，并指定文件名为 '报表'。
请注意，上述示例代码仅供参考，具体的实现方式可能需要根据你的实际需求进行调整。
导出为PDF
要将生成的 Excel 文件转换为 PDF 格式，可以使用第三方库 xlsx 和 pdfmake。首先，使用 xlsx 将 Excel 文件读取为数据，然后使用 pdfmake 将数据转换为 PDF 格式。
以下是一个示例代码，演示如何将生成的 Excel 文件转换为 PDF：
- 首先，安装依赖库
xlsx和pdfmake，可以使用 npm 进行安装：
npm install xlsx pdfmake
- 在小程序的页面中引入
xlsx和pdfmake库，并定义一个将 Excel 文件转换为 PDF 的方法：
// 引入依赖库
const XLSX = require('xlsx');
const pdfMake = require('pdfmake/build/pdfmake');
const pdfFonts = require('pdfmake/build/vfs_fonts');
// 注册字体
pdfMake.vfs = pdfFonts.pdfMake.vfs;
// 定义将 Excel 文件转换为 PDF 的方法
function convertToPDF(filePath, callback) {
// 读取 Excel 文件
const wb = XLSX.readFile(filePath);
// 将 Excel 数据转换为 JSON 对象
const sheetName = wb.SheetNames[0];
const worksheet = wb.Sheets[sheetName];
const jsonData = XLSX.utils.sheet_to_json(worksheet, { header: 1 });
// 将 JSON 对象转换为 PDF
const docDefinition = {
content: [
{
table: {
body: jsonData
}
}
]
};
const pdfDocGenerator = pdfMake.createPdf(docDefinition);
pdfDocGenerator.getBlob((blob) => {
if (typeof callback === 'function') {
callback(blob);
}
});
}
在上述示例代码中，我们通过 require 语句引入了 xlsx 和 pdfmake 库。然后，我们注册了字体文件，用于在生成 PDF 时使用。
接着，定义了一个名为 convertToPDF 的方法，该方法接受一个参数 filePath，表示要转换的 Excel 文件的路径。在方法中，我们使用 xlsx 将 Excel 文件读取为数据，并使用 XLSX.utils.sheet_to_json 方法将数据转换为 JSON 对象。
然后，我们使用 pdfmake 将 JSON 对象转换为 PDF。我们创建了一个 docDefinition 对象，其中的 content 属性定义了 PDF 内容的结构。在这个示例中，我们使用表格来显示 Excel 数据。
最后，我们通过 pdfMake.createPdf 方法创建了一个 PDF 文档生成器，并使用 getBlob 方法将生成的 PDF 转换为 Blob 对象，并通过回调函数返回。
接下来，你可以使用 convertToPDF 方法将生成的 Excel 文件转换为 PDF，并进行进一步的操作，比如保存到本地或分享：
// 调用将 Excel 文件转换为 PDF 的方法
convertToPDF('path/to/excel.xlsx', (pdfBlob) => {
// 在这里可以进行进一步的操作，比如保存到本地或分享
});
在上述示例中，我们调用了 convertToPDF 方法，并传入了 Excel 文件的路径。在回调函数中，可以对生成的 PDF Blob 对象进行进一步的操作，比如保存到本地或分享。
请注意，上述示例代码仅供参考，具体的实现方式可能需要根据你的实际需求进行调整。另外，小程序可能对文件系统的操作有限制，可能无法直接保存和分享 PDF 文件，你可能需要根据实际情况进行调整。