Question

我正在使用Greenscok Draggable作为恒温器。温度每旋转18度（也基于顺时针或逆时针）增加或减少。

我抓住旋转并使用余数运算符（％），如果它等于0，则温度会发生变化。

当刻度盘为0（旋转），温度为18和-180（旋转）时，表盘应达到26度。但是，这会根据拨盘的移动速度不断变化。

要添加，温度应该在-90（旋转）处为22度。

这是我有多远的jsbin - http://jsbin.com/wanoraputa/edit?html,js,output

感谢。

Answer 1

以下是我在Greensock论坛上提供的答案。

console.clear();
var output = document.getElementById('output');
var temp = document.getElementById('temperature');
var previousRotation = 0;


//from Blake
function normalize(value, min, max) {
  return (value - min) / (max - min);
}


//from Chrysto
function percentToRange(percent, min, max) {
   return((max - min) * percent + min);
}


Draggable.create('#dial', {
    type:'rotation',
    throwProps: true,
    bounds: {
        minRotation: 0,
        maxRotation: -180
    },
    onDrag: function(){
       var normalized = normalize(this.rotation, 0, -180);
       var mapped = percentToRange(normalized, 18, 26);
       console.log(this.rotation, normalized, mapped, this.getDirection());
       temp.innerHTML = parseInt(mapped);
    }
});

http://codepen.io/GreenSock/pen/ALNzJz?editors=0011

GSAP - 可拖动旋转不准确或一致

1 个答案: