logoCreated with Sketch.

G6

Fill with Texture in G6

1 min read

G6 support filling a shape with texture with Image or Data URL.

img

p is the flag for using texture; the text in green can be modified to satisfy your requirements; a is a way of repeating of the texture, which can be changed into:

  • a: Repeat in horizontal and vertical; - x: Repeat only in horizontal; - y: Repeat only in vertical; - n: No repeat.

Assign the fill as below while Configurating the Node or Edge:

shape.attr('fill', 'p(a)https://gw.alipay.com/cube.png');