Annotation Icons does not change color as selected

Technical Support
2

Hi!

You can programmatically set the fill style of your SVG icon, so this is the approach I would take. You can listen for the toolChanged event to get the color every time it is changed. Something like this should work (you may have to make some tweaks to satisfy your own requirements)

Webviewer({
   ...
}, document.getElementById('viewer')).then(instance => {

  const { docViewer, Tools, updateElement } = instance;

  docViewer.on('toolUpdated', (updatedTool) => {

    if (updatedTool instanceof Tools.TextHighlightCreateTool) {
      const { StrokeColor } = updatedTool.defaults;
      const color = StrokeColor.toHexString();
      updateElement('highlightToolButton', {
        img: `<svg fill="${color}">...</svg>`,
      })
    }
  })
});

Thanks!
Logan