svg-draw
TypeScript icon, indicating that this package has built-in type declarations

1.1.1 • Public • Published

Svg-Draw

Small js svg editor without dependencies.

Supported element types:

  • rect
  • ellipse
  • circle
  • line
  • polygon
  • polyline
  • group
  • text

Element properties:

type: ElementType; // rect, ellipse, circle, line, polygon, polyline, group
domId?: string; // dom element id
class?: string; // dom element class
x?: number; // not used for groups
y?: number; // not used for groups
width?: number; // not used for groups
height?: number; // not used for groups
points?: string; // used for polygon and polyline
children?: Partial[]; // used for group
fill?: string;
stroke?: string;
text?: string; // used for text
fontSize?: number; // used for text

Actions

addElement - create new element and add it to svg
setElementParameters - set element parameters
addElementParameters - adds values for element parameters (used for x, y, width and height)
removeElement - remove element from svg

Example

import { createSvgEditor, addElement, addElementParameters, setElementParameters } from 'svg-editor';
 
const svgContainer = document.getElementById('svgContainer');
if (!svgContainer) {
  throw new Error('svgContainer not found');
}
if (!(svgContainer instanceof SVGSVGElement)) {
  throw new Error('svgContainer are not instanse of SVGSVGElement');
}
 
const svgEditor = createSvgEditor(document, svgContainer);
const svgAddElement = svgEditor(addElement);
const svgSetElementParameters = svgEditor(setElementParameters);
const svgAddElementParameters = svgEditor(addElementParameters);
const svgRemoveElement = svgEditor(removeElement);
 
const rect = svgAddElement({
  type: 'rect',
  x: 10,
  y: 10,
  width: 10,
  height: 10,
  fill: 'red'
});
 
svgSetElementParameters({
  id: rect.id,
  x: 20
});
 
svgAddElementParameters({
  id: rect.id,
  width: 10
});
 
svgRemoveElement(rect);

Advanced exapmle in example\example.ts

Readme

Keywords

none

Package Sidebar

Install

npm i svg-draw

Weekly Downloads

2

Version

1.1.1

License

gpl-3.0

Unpacked Size

192 kB

Total Files

136

Last publish

Collaborators

  • vpetyukevich