cytoscape.js-layers
cytoscape.js-layers copied to clipboard
redrawing html elements when node resized
Hi, I'm using renderPerNode() with a HTML layer in order to create an Image object to be displayed on bottom right edge of my Cytoscape circular node, using the following options object:
{
init: (elem: HTMLElement, node: NodeSingular): void => {
const domain: DomainDTO = node.data('dto');
const selected: boolean = node.data('selected');
if (domain.primary) {
const img = new Image();
img.src = 'assets/icons/primary_domain.svg';
img.width = 4;
img.height = 4;
img.style.transform = selected ? 'translate(20px, 20px)' : 'translate(5.1px, -5px)';
elem.appendChild(img);
}
},
uniqueElements: true,
checkBounds: true,
updateOn: 'auto'
}
This adds the image perfectly, it's resized properly when zooming in/out, however when my nodes width & height are changed (based on Cytoscale stylesheet width+height properties) image is not redrawn so I can't recalculate its transform values. I tried various 'updateOn' values with no luck...
Screenshots / Sketches
Context
- Version:
- Browser:
Additional context