Create a custom shape containing an image of a fixed size and location

39 Views Asked by At

In draw.io/diagrams.net I can create a custom shape with an image - for example like the one below. But If I resize the shape then the image size changes too and its position is not fixed wrt to given edge(s).

Is there a way to allow the image to be of a fixed size and anchored relatively to top/bottom, left/right edges etc.

(I can see that the Archimate components seem to work like this, although I suspect that the icons are not images but just drawn directly. I would like to know how to do this too - but I can't find the source for the library to inspect).

<shape h="100" w="100" aspect="variable" strokewidth="inherit">
     <connections>
        ...
      </connections>
      <background>
        <rect x="0" y="0" w="100" h="100" />
      </background>
      <foreground>
          <fillstroke />
          <image x="30" y="30" h="16" w="16" src="data:image/gif;base64,..." />
      </foreground>
</shape>
0

There are 0 best solutions below