https://github.com/marpple/fxsvg
Functional SVG Handling Library
https://github.com/marpple/fxsvg
Last synced: 12 months ago
JSON representation
Functional SVG Handling Library
- Host: GitHub
- URL: https://github.com/marpple/fxsvg
- Owner: marpple
- License: mit
- Created: 2020-05-19T04:25:14.000Z (about 6 years ago)
- Default Branch: master
- Last Pushed: 2022-12-12T23:01:28.000Z (over 3 years ago)
- Last Synced: 2025-08-09T06:38:34.751Z (12 months ago)
- Language: JavaScript
- Size: 1.77 MB
- Stars: 18
- Watchers: 4
- Forks: 1
- Open Issues: 5
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# FxSVG
[EN](./README.md) | [KR](./README_KR.md)
Functional SVG Handling Library
## Installation
FxSVG use the ECMAScript Module system.
There are two type packages provided.
- ECMAScript Module
- bundle file for using in browser environment
### ECMAScript Module
```shell script
npm install fxsvg
```
```javascript
import { $$createSVGTransformTranslate } from "fxsvg";
import FxSVG from "fxsvg";
const $el = document.querySelector("svg rect");
const transform = $$createSVGTransformTranslate({ tx: 10, ty: 20 });
FxSVG.getBaseTransformList($el).initialize(transform);
```
### In a Browser
FxSVG supports only modern browsers that follow the ECMAScript 6+ spec and SVG 1.1+ spec.
FxSVG uses `$$` property of `window` object as a namespace for itself.
```shell script
npm install fxsvg
```
```html
```
```javascript
const { $$el } = $$;
const $rect = $$el(``);
const { controller } = $$.controlTranslateTransform()($rect);
controller.append({ tx: 10 }).append({ ty: 10 }).end();
```
## Documentation
- [Function Interface](./doc/FUNCTION_INTERFACE.md)
- [API Reference](./doc/API.md)
- [Test](./doc/TEST.md)
## Contributing
FxSVG always welcome all the developers who want to join in.
Please following the guide when you contribute.
- [Contributing Guide](./doc/CONTRIBUTING.md)