Closed ohelixa closed 4 years ago
Found solution, I'll leave it here in case someone would need something similar.
tickFormat: (d, i) => {
return (
<g>
<defs>
<pattern
id={`hx-h-bar-image-${d}`}
height="100%"
width="100%"
patternContentUnits="objectBoundingBox"
>
<image
width="1"
height="1"
xlinkHref={dataProp[i - 1] && dataProp[i - 1].pic}
/>
</pattern>
</defs>
<circle r={16} stroke="white" fill={`url(#hx-h-bar-image-${d})`} />
<text>{d.week}</text>
</g>
);
}
Yes exactly, you can display any valid SVG element, including <image>
Is it possible to print an image as a tick?
But I also need to reach the points[i] info in the
tickFormat