chriswyl

Hi,

I've two problems

1. Why my input checkbox doesn't wroking with custom css styling?

2. Is there a way for adding  object(s) for disable dragging ? Maybe usefull will be some propperty Draggable like

exclude:["#someel1","#someel2"]

Thanks

See the Pen mEJEjW by amonk (@amonk) on CodePen

Good to know that these lines are not equivalent

TweenMax.set($("#t2"), { attr:{ x:x , y:y } , rotation:rot , svgOrigin:x+' '+y });

and

TweenMax.set($("#t2"), { x:x , y:y , rotation:rot , svgOrigin:x+' '+y });

Thanks Diaco

See the Pen BKmepj by amonk (@amonk) on CodePen

Thank you for the detailed explanation,

You are Great team.

In Inkscape I produce very complex svg's. Of course I could  correct the code after creation, it is not a problem.

I thought that the simpler way is to handle the side plugin.

Thank You

Below this situation (right green rect is ok)

See the Pen EKvyeX by amonk (@amonk) on CodePen

I've the <image element inner group id="A" . This group is inner another group id="B"

the group "A" has attribute transform .

 transform="matrix(.997 .0745 -.0745 .997 97 -406)" Draggable FAIL  - this code was produced by Inkscape with optimization save option.

Now when I want apply draggable to Image element, The group "B" is going far far away tranform matrix x and y about 16300px.

When I changed to transform matrix group "A" like showed below ALL is working OK

transform="matrix(0.997, 0.0745, -0.0745, 0.997, 97, -406)" Draggable OK 

Maybe worth to detecting kind matrix deklaration.

Yes, text rotated, BUT the positions x,y are wrong. I tried add 

transformOrigin:"50% 50%" , looks better but not the same

Hi,
 
I've svg text element with attribute.
 
<text .......  x="200" y="100" transform="rotate(30 200 100)" ......

Everything looks ok until create Draggable.

Draggable ignore rotation.

Maybe is there simply way to conver to matrix property?

Example shows two identical elements. One is Draggable.

See the Pen eZWmJj by amonk (@amonk) on CodePen

progression ?

More complicated like paths. I'm using it in photoclip

So, I invented some solution, maybe not elegant, but this is enough for me.

See the Pen XbNojw?editors=101 by amonk (@amonk) on CodePen

Hello,

I'm trying to solve the problem.

In this example , when I drag red box on to circle , the image is change in both element (rectangle and circle with photo).

Second situation, problem, drag red box on circle , but little bit outer (in bounds circle). The image is change in the circle it should not do this.

I know that hitTest gets a bounds of object.

Maybe do you have some idea?

See the Pen NqbBvd?editors=101 by amonk (@amonk) on CodePen

Wow, fantastic trick Thank You

Hello,

Can you help me resolve problem.

The Color has change on each time when I "mousedown" on item. I tried "click" but doesn't dispatch event

I wouldl like change color only when "click"

See the Pen GJpQxm?editors=101 by amonk (@amonk) on CodePen

Hi,

I try to solve problem with setting up bounds params in Draggable. (SVG element)

This should work like this. This example has only Scaling

See the Pen DFEkx by amonk (@amonk) on CodePen

I tried to manually compute bounds to {minX,maxX,minY,maxY} using _gsTransform and scale, but when i rotate the object something bad work. 

See the Pen yydpYd?editors=101 by amonk (@amonk) on CodePen

Thx

Not even thought about that earlier use the "set"   - with Draggable

Thanks again

Hi,

Can you help me solve the problem.

See the Pen JoqVzp by amonk (@amonk) on CodePen

I published a little update

See the Pen dPaxXw by amonk (@amonk) on CodePen

Looks.. that is working Ty Diaco

Hello,

I'm trying to resolve this problem.

I've one "main" draggable element which includes 3 elements.

One with litter "M" - using for moving main element, and second with 'gradient' (is draggable too) to change "crop".

Last element greenbox is now not usable.

I want drag main element only when I use yellow box with "M"

But  when I drag 'green' element I don't need drag only this element without change position of all object.

See the Pen dPaxXw by amonk (@amonk) on CodePen

Hello,

How can I update bounds attribute, without creating new instance?

It it would look like this

Rodrigo,  Thanks!!!

You save my live. 

onUpdate:function()
      {
        Draggable.get("#box2").applyBounds();
      }

Hello,

I've some little problem.

I wrote the code

See the Pen DFEkx by amonk (@amonk) on CodePen

How can I update  draggable box position after scale?. Maybe it is possible to update when render?

Try this steps:

1. press button (+) about 5 times;

2.drag square at (0,0) position;

3 press button (-)

I don't want white space,