Setting watermark color to document

Hi Team,

I am using oov 8.0.1 version. I have a question related to watermark. I am using the below code for setting watermark. I am able to set text styles, but unable to change color.

var watermarkSettings = {
                    copyoutenabled: false,
                    watermark_on_draw: JSON.stringify({
                        "type": "rect",
                        "transparent": watermarkConfig.opacity / 100,
                        "width": 400,
                        "height": 400,
                        "rotate": angle,
                        "align": 1,
                        "paragraphs": [{
                            "align": 2,
                            "linespacing": textStyle.lineHeight,
                            "runs": [
                                {
                                    "text": watermarkText,
                                    "font-family": "Arial",
                                    "font-size": textStyle.fontSize,
                                    "color": "rgba(255,0,0,1)",      // tried directly giving "red" and "rgb(255,0,0)" but not working
                                    "bold": false,
                                    "italic": false,
                                    "strikeout": false,
                                    "underline": false
                                },
                                {
                                    "text": "<%br%>"
                                }
                            ]
                        }
                        ]
                    })
                };
                console.log('Watermark settings',watermarkSettings);
                window.Asc.plugin.executeMethod("SetProperties", [watermarkSettings], function () {
                    console.log('Watermark SET');
                    window.Asc.plugin.executeCommand("close", "");
                });

Could you please help to fix this. We need to set color using the above json format. Could you please confirm if “color” attribute is correct or we need to pass anything else. Thanks in advance

Hello @Jagan

I believe you want to set a color of the watermark text, is that correct? If so, parameter runs.fill allows you to set color of the text. For instance:

"runs" : [
            {
                "fill" : [255, 0, 0],
                ... // rest of your properties
            },

This property will set color of the main text to red.

Thanks a lot @Constantine . It worked. I have one more query. In the above code, we have passed width and height. In which unit it will consider. It is not ‘px’. Could you please confirm.

Please refer to the properties of watermark_on_draw JSON object here:

Units of width and height are millimeters.

Thanks @Constantine for sharing. When we set ‘height’ in ‘watermark_on_draw’, it is working in word and excel, but not working in ppt, Width is working, but height is not working.

var watermarkSettings = {
                    copyoutenabled: false,
                    watermark_on_draw: JSON.stringify({
                        "type": "rect",
                        "transparent": watermarkConfig.opacity / 100,
                        "width": 200,
                        "height": 50,
                        "rotate": -45,
                        "align": 1,
                        "paragraphs": [{
                            "align": 2,
                            "linespacing": '1',
                            "runs": [
                                {
                                    "text": watermarkText,
                                    "font-family": "Arial",
                                    "font-size": 30,
                                    "color": "[255,0,0]",      
                                    "bold": false,
                                    "italic": false,
                                    "strikeout": false,
                                    "underline": false
                                },
                                {
                                    "text": "<%br%>"
                                }
                            ]
                        }
                        ]
                    })
                };
                console.log('Watermark settings',watermarkSettings);
                window.Asc.plugin.executeMethod("SetProperties", [watermarkSettings], function () {
                  
                    window.Asc.plugin.executeCommand("close", "");
                });

Kindly help to set ‘height’ for watermark in ppt

I’m not sure if I understand the problem. height and width parameters are used to define the frame of the watermark. In your case it is rectangle with no fill, i.e. it is transparent figure, hence these setting don’t do much. From what I see, there is only text of the watermark should be displayed.

Can you share screenshots with this difference?

Hi @Constantine

var watermarkSettings = {
                    copyoutenabled: false,
                    watermark_on_draw: JSON.stringify({
                        "type": "rect",
                        "transparent": watermarkConfig.opacity / 100,
                        "width": 485,
                        "height": 58,
                        "rotate": -30,
                        "align": 1,
                        "paragraphs": [{
                            "align": 2,
                            "linespacing": '1',
                            "runs": [
                                {
                                    "text": "Test title to check watermark width big title big title Test title to\\n14/11/2024 16:09 IST\\nConfidential - Not for Distribution \\nConfidential - Not for Distribution\\nConfidential - Not for Dist",
                                    "font-family": "Arial",
                                    "font-size": 72,
                                    "fill": "[0,0,255]",      
                                    "bold": false,
                                    "italic": false,
                                    "strikeout": false,
                                    "underline": false
                                },
                                {
                                    "text": "<%br%>"
                                }
                            ]
                        }
                        ]
                    })
                };
                console.log('Watermark settings',watermarkSettings);
                window.Asc.plugin.executeMethod("SetProperties", [watermarkSettings], function () {
                  
                    window.Asc.plugin.executeCommand("close", "");
                });

I have set width as 485 and height as 58. Refer code above and check the screenshots attached. In doc file, it is working as expected. In the ppt file, text outside the given dimensions are also visible. Text outside the given dimensions are not visible in doc file. We are expecting that behavior.
Kindly let me know if you need more details.


This is expected behavior as I’ve already mentioned that height and width parameters allows you to set height and width of the figure below the text. It has nothing to do with text properties.

Your screenshots demonstrate different situation. You see, Document editor is limited in canvas area, i.e. area for text, images, etc., while in Presentation editor you can place them outside the visual area of the slide. All elements outside the cavas won’t shot up during the slideshow, also this watermark, as it is set with unique API, will be fit to the canvas during the slideshow.

I have given height “58”. So Watermark text should be cropped within the mentioned height as it is cropped in document editor. Do you mean, we cant set height for presentation(ppt) watermark?

You don’t seem to follow my description.

Take the sample parameters from there and try inserting watermark with them. You will see that it inserts the watermark with red box, which is configured according to the parameters height and width. You cannot limit how text is positioned as it fills all available space on the canvas. Document editor and Presentation editor have different sizes of canvas, hence the text fills the space differently which is expected.

Hi @Constantine , I used the sample parameters in the link you shared. It has cleared most of my questions. For presentation alone height is not working. I understand that canvas size differs for Presentation, for example I need just 2 lines of text of font size 20. What should be the height for that. Whatever value we give, it is not at all considering. Whole content is showing up.

Check the below screenshots. I have filled background color now. In document, content is displayed only inside the given height. In Presentation (ppt), content is going outside the given dimensions.