Add yet-another-react-lightbox package and update .gitignore to exclude node_modules
This commit is contained in:
89
frontend/node_modules/@svgdotjs/svg.resize.js/README.md
generated
vendored
89
frontend/node_modules/@svgdotjs/svg.resize.js/README.md
generated
vendored
@@ -1,89 +0,0 @@
|
||||
# svg.resize.js
|
||||
|
||||
An extension of [svg.js](https://github.com/svgdotjs/svg.js) which allows to resize elements which are selected with [svg.select.js](https://github.com/svgdotjs/svg.select.js)
|
||||
|
||||
# Demo
|
||||
|
||||
For a demo see http://svgdotjs.github.io/svg.resize.js/
|
||||
|
||||
# Get Started
|
||||
|
||||
Install `svg.js`, `svg.select.js` and `svg.resize.js` using npm:
|
||||
|
||||
```bash
|
||||
npm i @svgdotjs/svg.js @svgdotjs/svg.select.js @svgdotjs/svg.resize.js
|
||||
```
|
||||
|
||||
Or get it from a cnd:
|
||||
|
||||
```html
|
||||
<link rel="stylesheet" href="https://unpkg.com/@svgdotjs/svg.resize.js@latest/dist/svg.resize.css" />
|
||||
<script src="https://unpkg.com/@svgdotjs/svg.js"></script>
|
||||
<!-- the select plugin comes bundled with the resize plugin -->
|
||||
<!-- <script src="https://unpkg.com/@svgdotjs/svg.select.js"></script> -->
|
||||
<script src="https://unpkg.com/@svgdotjs/svg.resize.js"></script>
|
||||
```
|
||||
|
||||
Select and resize a rectangle using this simple piece of code:
|
||||
|
||||
```ts
|
||||
var canvas = new SVG().addTo('body').size(500, 500)
|
||||
canvas.rect(50, 50).fill('red').select().resize()
|
||||
```
|
||||
|
||||
# Usage
|
||||
|
||||
Activate resizing
|
||||
|
||||
```ts
|
||||
rect.select().resize()
|
||||
```
|
||||
|
||||
Deactivate resizing
|
||||
|
||||
```ts
|
||||
rect.resize(false)
|
||||
```
|
||||
|
||||
Preserve aspect ratio, resize around center and snap to grid:
|
||||
|
||||
```ts
|
||||
rect.resize({ preserveAspectRatio: true, aroundCenter: true, grid: 10, degree: 0.1 })
|
||||
```
|
||||
|
||||
# Options
|
||||
|
||||
- `preserveAspectRatio`: Preserve the aspect ratio of the element while resizing
|
||||
- `aroundCenter`: Resize around the center of the element
|
||||
- `grid`: Snaps the shape to a virtual grid while resizing
|
||||
- `degree`: Snaps to an angle when rotating
|
||||
|
||||
# Events
|
||||
|
||||
While resizing, a `resize` event is fired. It contains the following properties (in `event.detail`):
|
||||
|
||||
- `box`: The resulting bounding box after the resize operation
|
||||
- `angle`: The resulting rotation angle after the resize operation
|
||||
- `eventType`: The type of resize operation (the event fired by the select plugin)
|
||||
- `event`: The original event
|
||||
- `handler`: The resize handler
|
||||
|
||||
```ts
|
||||
rect.on('resize', (event) => {
|
||||
console.log(event.detail)
|
||||
})
|
||||
```
|
||||
|
||||
# Contributing
|
||||
|
||||
```bash
|
||||
git clone https://github.com/svgdotjs/svg.resize.js.git
|
||||
cd svg.resize.js
|
||||
npm install
|
||||
npm run dev
|
||||
```
|
||||
|
||||
# Migration from svg.js v2
|
||||
|
||||
- The option naming changed a bit. Please double check
|
||||
- The former events were removed. The resize event now serves the same purpose
|
||||
Reference in New Issue
Block a user