Question

我正试图重新调整我发现here的测量图表。目前我已将针移动提交，但在更新到新位置之前它重置为0，我宁愿直接调整位置。

当试图想办法时，我想我需要修改这段处理重置的代码片段;

$("form").submit();

所以我想，我必须找到一种在更新之前记住旧值而不是重置为0的方法，或者只是尝试完全删除重置功能？

但我不确定如何实现这一目标。

这是更新功能;

Needle.prototype.moveTo = function(perc) {
        var self,
            oldValue = this.perc || 0;

        this.perc = perc;
        self = this;

        // Reset pointer position
        this.el.transition().delay(100).ease('quad').duration(200).select('.needle').tween('reset-progress', function() {
            return function(percentOfPercent) {
                var progress = (1 - percentOfPercent) * oldValue;

                repaintGauge(progress);
                return d3.select(this).attr('d', recalcPointerPos.call(self, progress));
            };
        });

        this.el.transition().delay(300).ease('bounce').duration(1500).select('.needle').tween('progress', function() {
            return function(percentOfPercent) {
                var progress = percentOfPercent * perc;

                repaintGauge(progress);
                return d3.select(this).attr('d', recalcPointerPos.call(self, progress));
            };
        });

    };

    return Needle;

})

();

我已经制作了一个plnk，并尝试删除与问题无关的所有内容以减少代码，只需单击提交以更新位置，并希望问题有意义。

https://plnkr.co/edit/NtlpGoEf5J1XRfgTjewR?p=preview

我认为这一切都可能有点笨拙，但我希望有人可以提供帮助！

由于

Answer 1

我更改了您的moveTo功能。它从0开始使用progress。所以，我改为：

var progress = oldValue + (percentOfPercent * (perc - oldValue));

以下是plunker：https://plnkr.co/edit/RCNNpLX0Un7LzWW1YDwu?p=preview

每当用户点击＆＃34;使用var value = Math.random()*100提交＆＃34;时，我就让其他的plunker将值设置为随机数。我相信它按您想要的方式工作，请检查它：https://plnkr.co/edit/xj2sGBidjnPN5R9CkA59?p=preview

从最后一个值更新位置/转换（表格/ d3.js）

1 个答案: