Replace Sticky Note crosshair with different icon

Technical Support
1

Which product are you using?

PDF.js Express

PDF.js Express Version
7.3.4

Detailed description of issue
I am looking for a way to replace the crosshair shown before placing a sticky note icon on the page with a different icon. Is this possible?

Expected behaviour
{Provide a screenshot or description of the expected behaviour}

Does your issue happen with every document, or just one?
{Answer here}

Link to document
{Provide a link to the document in question if possible}

Code snippet
{Provide a relevant code snippet}

3

Hello, I’m Ron, an automated tech support bot :robot:

While you wait for one of our customer support representatives to get back to you, please check out some of these documentation pages:

Guides:APIs:Forums:

4

Hi Crauch,

You can set the sticky note’s cursor to a custom icon like so:

          const { documentViewer, Tools } = instance.Core;
          const stickyTool = Tools.StickyCreateTool;
          documentViewer.addEventListener('toolModeUpdated', (tool) => {
            if (tool instanceof stickyTool) {
              tool.cursor = `url("${img}"), default`;
            }
          });

Where img is a base64 encoded image. Here is a little helper function I made for you that can convert a url/filePath into a base64 image

          const getBase64Image = async (url) => {
            const response = await fetch(url);
            const blob = await response.blob();
            const reader = new FileReader();
            await new Promise((resolve, reject) => {
              reader.onload = resolve;
              reader.onerror = reject;
              reader.readAsDataURL(blob);
            });
            return reader.result;
          };

Cheers,
Dustin

.