JavaScript
svg 그라데이션 동적으로 적용
beforesol
2021. 3. 11. 17:56
export const createSvgGradient = (svg: SVGSVGElement, id: string, stops: IStop[]) => {
const svgNS = svg.namespaceURI;
const grad = document.createElementNS(svgNS, 'linearGradient');
grad.setAttribute('id', id);
stops.forEach((stop) => {
const stopNS = document.createElementNS(svgNS, 'stop');
stopNS.setAttribute('offset', stop.offset);
stopNS.setAttribute('stop-color', stop.stopColor);
grad.appendChild(stopNS);
})
const defs = svg.querySelector('defs') || svg.insertBefore(document.createElementNS(svgNS, 'defs'), svg.firstChild);
defs.appendChild(grad);
}