Scale image on dragging using famo.us -
i new famo.us, trying scale image on dragging.my code working fine 1 drag after not working. how can make work fro every drag? settransform make scale operation fixed?
define(function(require, exports, module) { var engine = require("famous/core/engine"); var surface = require("famous/core/surface"); var statemodifier = require("famous/modifiers/statemodifier"); var draggable = require("famous/modifiers/draggable"); var transform = require("famous/core/transform"); var imagesurface = require('famous/surfaces/imagesurface'); var maincontext = engine.createcontext(); var size_x = 200; var size_y = 200; var scale_x =1; var scale_y =1; var surface = new imagesurface({ size: [size_x, size_y], content: 'img/1.jpg', properties: { backgroundcolor: 'rgba(200, 200, 200, 0.5)', cursor: 'pointer' } }); var draggable = new draggable({ xrange: [-100, 1000], yrange: [-100, 1000] }); surface.pipe(draggable); var mod = new statemodifier({ transform: transform.translate(150, 100, 0) }); var mod1 = new statemodifier({ }); maincontext.add(mod).add(mod1).add(surface); draggable.on('update',function(data){ var delta = draggable.getposition(); var scale_x = (size_x+ delta[0])/size_x; var scale_y = (size_y+ delta[1])/size_y; mod1.settransform( transform.scale(scale_x,scale_y, 0) ); }); });
all need change how using scale function. scaling 'z' property 0. should 1.
so change this..
transform.scale(scale_x,scale_y, 0);
to this..
transform.scale(scale_x,scale_y, 1);
good luck!
Comments
Post a Comment