I am a Computer Scientist and Musician by training. A writer with interests in Philosophy, Economics, Technology, Politics, Business, the Arts and Fiction.
Published
Edited
Sep 29, 2020
Importers
1 star
md`# SVG Icons`
import { addDefaults } from '@nuuuwan/option-utils'
import { getSVG } from '@nuuuwan/svg-utils'
function drawIcon(id, options) {
options = addDefaults(
options,
Object({
fill: 'black',
stroke: 'none',
width: 32,
height: 32
})
);
const info = ID_TO_INFO[id];
const svg = getSVG(options);
svg
.append('rect')
.attr('height', options.height)
.attr('width', options.width)
.attr('fill', 'rgba(255, 255, 255, 0)')
.attr('stroke', 'none');
svg
.append('path')
.attr('d', info.d)
.attr('fill', options.fill)
.attr('stroke', options.stroke);
svg.attr('viewBox', info.viewBox);
return svg.node();
}
drawIcon('toilet', { fill: 'red', width: 43, height: 43 })
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
