# vsvg

> A minimal implementation of a vdom that allows for quick server or client side rendering of svg's

Latest version **1.9.1** (published 2015-05-03) · MIT license · 0 weekly downloads

## Install

```sh
npm install vsvg
pnpm add vsvg
yarn add vsvg
bun add vsvg
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.9.1 |
| Published | 2015-05-03 |
| First published | 2014-11-15 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 1 |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 14 |
| Author | Jacob Lowe |
| Maintainers | jcblw |
| Keywords | svg, server, client, virtualdom |

## Links

- npm: https://www.npmjs.com/package/vsvg
- Repository: http://github.com/jcblw/vsvg
- Homepage: https://github.com/jcblw/vsvg
- Issues: https://github.com/jcblw/vsvg/issues
- npm.io page: https://npm.io/package/vsvg

## Dependencies (1)

- [vsvg-parser](https://npm.io/package/vsvg-parser.md) ^0.3.1

## Alternatives

- [launchdarkly-js-client-sdk](https://npm.io/package/launchdarkly-js-client-sdk.md) — 2.5M weekly downloads
- [@elastic/elasticsearch](https://npm.io/package/@elastic/elasticsearch.md) — 2.1M weekly downloads
- [@c8y/client](https://npm.io/package/@c8y/client.md) — 15.3K weekly downloads
- [@signaldb/maverickjs](https://npm.io/package/@signaldb/maverickjs.md) — 1.7K weekly downloads
- [@bbc/http-transport-cache](https://npm.io/package/@bbc/http-transport-cache.md) — 1.2K weekly downloads

## Recent versions

- 1.9.1 (latest) — 2015-05-03
- 1.9.0 — 2015-01-25
- 1.8.1 — 2014-12-27
- 1.8.0 — 2014-12-10
- 1.7.0 — 2014-12-06
- 1.6.4 — 2014-12-06
- 1.6.0 — 2014-12-06
- 1.5.2 — 2014-12-05
- 1.5.0 — 2014-11-22
- 1.4.0 — 2014-11-20
- 1.2.0 — 2014-11-20
- 1.0.4 — 2014-11-17
- 1.0.3 — 2014-11-16
- 1.0.1 — 2014-11-16
- 1.0.0 — 2014-11-16
- … 3 more at https://npm.io/package/vsvg/versions

## README

# vsvg ( virtual SVG ) [![Build Status](https://travis-ci.org/jcblw/vsvg.svg?branch=master)](https://travis-ci.org/jcblw/vsvg)

vsvg is a small lib that allow you to create svg's server side or client side. Its still in early devlopment so expect bug and file issues.

## Install

    $ npm install vsvg

You can also use it with your [Browserify](http://browserify.org) bundles.

## Usage

vsvg exports an singleton with methods that corresponds to svg tags.

```javascript
var vsvg = require( 'vsvg' ),
    svg = vsvg.svg({ // creating svg
        width: '130', // attributes
        height: '120',
        class: 'bar'
    }),
    style = vsvg.style(),
    line = vsvg.line({ // creating line
        x1: 0, // attributes
        y1: 0,
        x2: 100,
        y2: 100,
        class: 'my-class',
        style: { // style objects
            stroke: 'black'
        }
    });

style.innerText = '.my-class{ stoke-width: 5px; }'; // set inner text

style.setAttribute( 'type', 'text/css' );
conosle.log( style.getAttibute( 'type' ) ); // text/css

svg.appendChild( line ); // append node to another node
svg.insertBefore( style, line ); // append node before another node

console.log( svg.outerHTML ); /* <svg xmlns="http://www.w3.org/2000/svg" width="130" height="120" class="bar" ><style  type="text/css" >.my-class{ stoke-width: 5px; }</style><line  x1="0" y1="0" x2="100" y2="100" class="my-class" style="stroke:black;" ></line></svg> */

console.log( svg.innerHTML ); /* <style  type="text/css" >.my-class{ stoke-width: 5px; }</style><line  x1="0" y1="0" x2="100" y2="100" class="my-class" style="stroke:black;" ></line> */

svg.toHTML(); // alias of outerHTML

```

---
_Source: https://npm.io/package/vsvg · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._