@jsyg/resizable

Resizable plugin for JSYG framework

Demo

http://yannickbochatay.github.io/JSYG.Resizable/

Installation

with npm

npm install @jsyg/resizable

Example

HTML

<svg width="100%" height="300" class="container">
    <rect class="resize" width="80" height="40" fill="pink"/>
</svg>
<div class="container">
    <div class="resize" style="width:80px;height:40px;background-color:pink"></div>
</div>

Javascript es6

import JSYG from "@jsyg/core"
import Resizable from "@jsyg/resizable"

let resize = new Resizable("rect.resize",{ 
    bounds:0,
    ondrag:function() {
       var dim = JSYG(this).getDim();
       console.log(dim.width,dim.height);
    }
})

Or as a JSYG plugin (so you can apply it on several elements)

import JSYG from "@jsyg/core"
import "@jsyg/resizable"

JSYG(".resize").resizable({
    bounds:0,
    ondrag:function() {
       var dim = JSYG(this).getDim();
       console.log(dim.width,dim.height);
    }
});