我希望能够使用挂锁图标为 spreadJs 中的单元格添加水印。我希望它始终位于单元格的右中心,如下图所示。
这可能吗?
我可以看到下面的链接做了类似的事情,但它跨越了整个单元格,我真的不想要这样,因为单元格的宽度和高度可以是任何宽度和高度,所以这看起来很奇怪。
我希望单元格能够正常运行并保留所有现有样式,而不是在需要的挂锁单元格上添加水印。
https://help.grapecity.com/spread/SpreadJSWeb/backimage.html
更新
我刚刚遇到以下内容,我认为它有可能使用自定义单元格进行工作。有没有人有一个他们可以分享的简单示例,它所做的只是将自定义图标添加到现有单元格?
https://help.grapecity.com/spread/SpreadJSWeb/cellcustom.html
最佳答案
您可以如上所述创建自定义 CellType。
定义细胞类型:
function IconCellType() {
}
IconCellType.prototype = new GC.Spread.Sheets.CellTypes.Text();
IconCellType.prototype.paint = function (ctx, value, x, y, w, h, style, context) {
if (!ctx) {
return;
}
GC.Spread.Sheets.CellTypes.Text.prototype.paint.call(this, ctx, value, x, y, w, h, style, context);
ctx.save();
// draw inside the cell's boundary
ctx.rect(x, y, w, h);
ctx.clip();
let img = document.getElementById('lock');
ctx.drawImage(img, x+w-20, y+h/2-10, 20, 20);
ctx.restore();
}
然后设置celltype:
var sheet = workbook.getActiveSheet();
sheet.getCell(1, 1).cellType(new IconCellType());
另请注意,您添加的文档链接适用于 SpreadJS 版本 9。 转到 the v12 Documentation获取最新的文档。
关于javascript - 添加自定义单元格图像/叠加水印,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55362747/