fromSVG()
此函数属于 Iconify Tools 中的 IconSet 类。
函数 fromSVG() 将图标从 SVG 实例导入到 IconSet 图标集中。 它可用于添加新图标或替换现有图标。
用法
该函数包含以下参数:
- name,string。图标名称。
- svg,SVG。SVG 实例。
函数在成功时返回 true,失败时返回 false。
示例
example.ts
ts
import { blankIconSet, parseColors, isEmptyColor } from '@iconify/tools';
// Create an icon set, add one icon
const iconSet = blankIconSet('');
iconSet.setIcon('add', {
body: '<path d="M14 7v1H8v6H7V8H1V7h6V1h1v6h6z"/>',
});
// Export icon to SVG class instance
// Note: SVG instance is not attached to icon set, so it is not updated automatically (see code below).
const svg = iconSet.toSVG('add');
if (!svg) {
throw new Error('Icon is missing');
}
// Set fill to 'currentColor'
parseColors(svg, {
// If a shape uses default color (used in this example), change it to 'currentColor'.
defaultColor: 'currentColor',
// Callback to change colors. Not called in this example because there are no colors in sample icon.
callback: (attr, colorStr, color) => {
// color === null -> color cannot be parsed -> return colorStr
// isEmptyColor() -> checks if color is empty: 'none' or 'transparent' -> return color object
// without changes (though color string can also be returned, but using object is faster)
// for everything else return 'currentColor'
return !color ? colorStr : isEmptyColor(color) ? color : 'currentColor';
},
});
// Icon instance is not attached to icon set, so it is not updated automatically.
// Update icon in icon set
iconSet.fromSVG('add', svg);
// Log to show icon (two ways to do it, one from icon set, one from icon instance)
console.log(svg.toString());
console.log(iconSet.toString('add'));Result:
svg
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="16" height="16" preserveAspectRatio="xMidYMid meet" viewBox="0 0 16 16"><path d="M14 7v1H8v6H7V8H1V7h6V1h1v6h6z" fill="currentColor"/></svg>