将图像从任务窗格复制到Excel - Office-JS

y1aodyip  于 2023-04-22  发布在  其他
关注(0)|答案(2)|浏览(135)

我正在通过Excel插件制作条形码。到目前为止,我已经让https://github.com/lindell/JsBarcode在TaskPane中生成条形码,但我想把它放到Worksheet中。
我的HTML知识有限,这是我使用的标签,但我认为如果需要,我可以使用其他标签,github中提供的使用Canvas/svg等的示例。

<img id="barcode" />

到目前为止,这是我得到的,我没有错误,但它不工作。

await JsBarcode("#barcode", "Hi!");

const data = {};
JsBarcode(data, 'text') //, { ...options });
console.log('data:')
console.log(data)

var ws = context.workbook.worksheets.getActiveWorksheet();
ws.getRange("A1").values = data

下面是对象data

[object Object]
   {
      [functions]: ,
      __proto__: { },
      encodings: [
         0: {
            [functions]: ,
            __proto__: { },
            data: "1101001000010011110100101100100001111001001010011110100111101011101100011101011",
            options: {
               [functions]: ,
               __proto__: { },
               background: "#ffffff",
               displayValue: true,
               font: "monospace",
               fontOptions: "",
               fontSize: 20,
               format: "CODE128",
               height: 100,
               lineColor: "#000000",
               margin: 10,
               marginBottom: 10,
               marginLeft: 10,
               marginRight: 10,
               marginTop: 10,
               Symbol()_7.6h76ic49xap: undefined,
               Symbol(nodejs.util.inspect.custom)_j.6h76ic49xdy: undefined,
               text: undefined,
               textAlign: "center",
               textMargin: 2,
               textPosition: "bottom",
               width: 2
            },
            Symbol()_7.6h76ic49xap: undefined,
            Symbol(nodejs.util.inspect.custom)_j.6h76ic49xdy: undefined,
            text: "text"
         },
         length: 1
      ],
      Symbol()_7.6h76ic49xap: undefined,
      Symbol(nodejs.util.inspect.custom)_j.6h76ic49xdy: undefined
   }

更新:我需要的解决方案是在HTTP下可用,因为这是我目前如何加载我的加载项,由于Excel与我的公司SSL证书的问题.我已经看/读到使用新的剪贴板API,但它只能在HTTPS下可用.

mdfafbf1

mdfafbf11#

条形码或二维码生成器允许将生成的图形代码导出为图像。在Excel需求集1.9开始的Office Web加载项中,您可以使用addImage方法插入图像:
addImage(base64ImageString: string): Excel.Shape
例如,您可以使用以下代码:

Excel.run(async (context) => {
    let sheet = context.workbook.worksheets.getItem("MyWorksheet");
    let cell = sheet.getRange("D5")
    cell.load('top,left') //pre-load top and left
    let myBase64 = "your bas64string here";
    const shape = sheet.shapes.addImage(myBase64)

    await context.sync()

    shape.incrementLeft(cell.left) // <- left
    shape.incrementTop(cell.top) // <-top
    await context.sync();
})
mw3dktmi

mw3dktmi2#

基本上,我必须将图像转换为Base64,然后将其插入Worksheet。
https://stackoverflow.com/a/35703395/5079799

function textToBase64Barcode(text) {
    var canvas = document.createElement("canvas");
    JsBarcode(canvas, text, { format: "CODE39" });
    return canvas.toDataURL("image/png");
}
export async function Button_BARCODES_Run_OnClick() {
    try {
        await Excel.run(async (context) => {
            //START
            console.log('Button_BARCODES_Run_OnClick')
            var Base64Image = await textToBase64Barcode('text')
            Base64Image = Base64Image.split(',')[1]
            console.log('Base64Image:')
            console.log(Base64Image)
            
            var ws = context.workbook.worksheets.getActiveWorksheet();
            ws.getRange("A1").select()
            await context.sync()
            await IMAGES.Insert_Image_At_Selection(context, Base64Image)
            //data.encodings.data
            
            //END
            await context.sync();
        });
    } catch (error) {
        console.error(error);
    }
}
IMAGES.Insert_Image_At_Selection = async function Insert_Image_At_Selection(context,Image_Base64_Str) {
    //Leaving as reference, but use "shapes"
    Office.context.document.setSelectedDataAsync(Image_Base64_Str, {
        coercionType: Office.CoercionType.Image,
        imageLeft: 50,
        imageTop: 50,
        imageWidth: 100,
        imageHeight: 100
    },
        function (asyncResult) {
            if (asyncResult.status === Office.AsyncResultStatus.Failed) {
                console.log("Action failed with error: " + asyncResult.error.message);
            }
        });
}

相关问题