Needle overrun

[HeiDJ65]

When the angle between two values exceeds 180, the needle transition covers the area outside the gauge. This can be prevented by something like

         var lastAngle = 0;
         var onValueChanged = function (pValue, pPrecision, pValueUnit) {
             if (typeof pValue === 'undefined' || pValue == null) return;

             if (needle && pValue >= minLimit && pValue <= maxLimit) {
                 var needleAngle = getNewAngle(pValue);
                 var diff = needleAngle - lastAngle; //avoid overrun
                 lastAngle = needleAngle;
                 var n = needle, t = transitionMs;
                 if (Math.abs(diff) >= 180) {
                     t = transitionMs / 2;
                     n = needle.transition()
                         .duration(t)
                         .ease('linear')
                         .attr('transform', 'rotate(' + (needleAngle - diff / 2) + ')');
                 }
                 n.transition()
                     .duration(t)
                     .ease('bounce-in')
                     .attr('transform', 'rotate(' + needleAngle + ')');
                 svg.selectAll('.mtt-graduationValueText')
                 .text('[ ' + pValue.toFixed(pPrecision) + pValueUnit + ' ]');
             } else {
                 svg.selectAll('.mtt-graduation-needle').remove();
                 svg.selectAll('.mtt-graduationValueText').remove();
                 svg.selectAll('.mtt-graduation-needle-center').attr("fill", inactiveColor);
             }
         };

With other words - splitting the transition in two and making sure that the intermediate value is inside the range.

Regards,

HeiDJ65