https://github.com/takamin/svg-z-order

A module to manipulate the Z-Order of a SVG element.
https://github.com/takamin/svg-z-order

npm svg z-index z-order

Last synced: 2 months ago
JSON representation

A module to manipulate the Z-Order of a SVG element.

• Host: GitHub
• URL: https://github.com/takamin/svg-z-order
• Owner: takamin
• License: mit
• Created: 2017-04-22T15:30:07.000Z (over 7 years ago)
• Default Branch: master
• Last Pushed: 2017-06-30T13:33:47.000Z (over 7 years ago)
• Last Synced: 2024-08-08T23:14:43.394Z (5 months ago)
• Topics: npm, svg, z-index, z-order
• Language: JavaScript
• Size: 123 KB
• Stars: 13
• Watchers: 2
• Forks: 1
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
SVG-Z-ORDER

===========

A module to manipulate the Z-Order of a SVG element.



Overview

--------

```javascript

var svgz = require("svg-z-order");

var g = svg.getElementById("foo");

svgz.element(g).toTop();

// with D3.js

var d3g = d3.select("#foo");

svgz.element(d3g.node()).toTop();

```

If `require` is NOT available,

use global `svgz_element` function instead of 'svgz.element' method.

Sample Code

-----------

* [APIs to Change Z-Order: `toTop`/`toBottom`/`moveUp`/`moveDown`](sample/web/index.js)

To run the sample above on the WEB,

Visit the [project page](https://takamin.github.io/svg-z-order/).

Installation

------------

```bash

$ npm install --save svg-z-order

```

APIs

----

* svgz.element(domElement) - Creates SVGZElement instance referencing a dom element.

* SVGZElement.toTop() - Brings up the element to top of the all sibling elements.

* SVGZElement.toBottom() - Brings down the element to bottom of the all sibling elements.

* SVGZElement.moveUp(element/n) - Moves up the element to the front of specified target element or n-times.

* SVGZElement.moveDown(element/n) - Moves down the element to behind of the specified target element or n-times.

* SVGZElement.moveTo(element/index) - Moves the element to the specified position.

Repository

----------

* [npm](https://www.npmjs.com/package/svg-z-order)

* [GitHub](https://github.com/takamin/svg-z-order) ([gh-pages](https://takamin.github.io/svg-z-order/))

LICENSE

-------

This software is released under the MIT License, see [LICENSE](LICENSE)