What are expected deltaX values from a Draggable instance?

[foundartfactory]

Howdy Folks!

 

I have a draggable instance that's type: x, got its bounds set, and I want to track how far it's moved along its track. I'm already tracking its position successfully as a percentage and figured I could use the Draggable.deltaX to see *how far* it's moved since being dragged.

 

I'm getting some really low numbers. Are these how far it's moved since the last check, or since it started being dragged?

 

See the round circle at bottom to drag in the 'pen, and check console.

 

Thanks for any insight as to what I'm missing/misunderstanding!

See the Pen wvELKPp by foundartfactory (@foundartfactory) on CodePen

[PointC]

I think you're looking for this in your console log:

 

 scScrubDragger.deltaX: ${this.x}

Happy dragging.

[foundartfactory]

Hi Craig! 😀

Thanks for that -- I have no issue getting the current x value, a la

scScrubDragger.deltaX: ${this.x}

...But what I'd like is the amount that the Draggable instance has moved since it started being dragged. Here's what the Greensock help doc says for .deltaX: 

Quote

 

.deltaX : Number

The change in the x-related value since the last drag event.

 

 

Is this value since the drag began (ie, an aggregate or sum total), or is it a value gotten at some certain interval along the way (which would explain the tiny numbers)?

Should I just roll my own usingthis.x and check that against the starting position x of the dragging? 

Thanks!

Patrick

 

[Rodrigo]

Hi Patrick,

 

You can use the startX property:

https://greensock.com/docs/v3/Plugins/Draggable/startX

 

In combination with the x property in order to know how many pixels the last Drag gesture lasted, soto speak. Keep in mind that moving the knob to the left will result in a negative value.

 

this.x - this.startX // -> amount of pixels of the last Draggable gesture

Finally is worth mentioning that startX will be different after you release the pointer event and drag again.

 

Hopefully this helps.

Happy Tweening!

[PointC]

ahh... yes. I misunderstood the question. Sorry about that. 

 

I think I'd wire it up just like @Rodrigo showed in his answer.

 

Happy dragging.

 

[foundartfactory]

Thanks @PointC & @Rodrigo for your super fast insights -- this.x - this.startX it is!

 

Dragging aweigh 😃,

 

Patrick