パッケージの詳細

tiny-svg

bpmn-io387.9kMIT4.1.3

A minimal toolbelt for builing fast SVG-based applications

svg, library, geometry

readme

tiny-svg

CI

tiny-svg is a minimal toolbelt for creating clean SVG applications.

Features

  • no wrapping magic, using native DOM elements instead
  • modular, just use what you need
  • 2kB minified + gzipped
  • innerSVG support
  • simplified attribute handling
  • geometry helpers

Checkout provided utilities.

Usage

import {
  appendTo,
  classes,
  create,
  innerSVG
} from 'tiny-svg';

var container = document.createElement('div');
var element = appendTo(create('svg'), container);

var g = appendTo(create('g'), element);

// add classes, SVG style!
classes(g).add('foo');

var text = `
  <g class="foo bar">
    <rect x="0" y="0" width="0" height="0" rx="50" ry="50"/>
  </g>
`;

// set innerSVG
innerSVG(g, text);

Your favourite module bundler should apply tree-shaking to only include the components your application requires. If you're using CommonJS modules give common-shake a try.

Related

  • min-dom - minimal DOM utility toolbelt
  • min-dash - minimal lodash inspired utility toolbelt

License

MIT

更新履歴

Changelog

All notable changes to tiny-svg are documented here. We use semantic versioning for releases.

Unreleased

_Note: Yet to be released changes appear here._

4.1.3

  • FIX: escape entities in attributes (#16)

4.1.2

  • CHORE: make clear work standalone

3.1.2

  • CHORE: standalone clear implementation

4.1.1

  • CHORE: revert to basic clear

3.1.1

  • CHORE: rever to basic clear

4.1.0

  • FEAT: use optimized clear
  • FEAT: trim whitespace around create

3.1.0

  • FEAT: use optimized clear
  • FEAT: trim whitespace around create

4.0.0

  • CHORE: turn into ES module
  • CHORE: require Node >= 16
  • CHORE: drop UMD distribution

Breaking Change

  • This library is now an ES only module, and can consumed as such in modern JavaScript environments.

3.0.1

  • FIX: correct create type definition (#13)

3.0.0

  • FEAT: change library target to ES2018
  • FEAT: drop polyfills for browser not supporting ES2018

Breaking Changes

  • Target syntax is ES2018. Transpile the code base to target < ES2018.
  • Polyfills for browsers not supporting ES2018 are dropped (e.g. Element.classList).

2.2.4

  • FIX: lazily create utility elements (#10)

2.2.3

  • CHORE: add type definitions for prepend and prependTo

2.2.2

  • FIX: correct type definitions for select and selectAll

2.2.1

  • FIX: work around IE / MS Edge transform issue (980e9d6f)

2.2.0

  • FEAT: add ability to create any SVG element via markup
  • FEAT: add ability to set innerSVG to fragment
  • FEAT: add prependTo and prepend utils

2.1.2

  • FIX: correct {} TypeScript definition

2.1.1

  • FIX: correct TypeScript definitions

2.1.0

  • FEAT: add TypeScript definitions

2.0.0

  • FIX: drop browser field for better interoperability with module bundlers

1.1.0

  • CHORE: mark utils as side-effect free via sideEffects: false

1.0.0

  • CHORE: migrate code base to ES6
  • FEAT: generate bundles for CJS, ES6 and UMD

...

Check git log for earlier history.