使用日期在D3动画期间闪烁

Question

我在D3中创建了一个可视化。

不幸的是，当图形点和文本相互叠加时，它们会闪烁，这相当令人分心。

我已查找问题并怀疑它可能与值的插值有关，如本文所述：https://bost.ocks.org/mike/transition/ 但我不确定如何按季节应用有关日期值的建议。

另外值得注意的是，闪烁不是IE的问题，但Chrome存在问题。

整个代码都在github链接中，但我认为这是最相关的部分：

grapher.css

text { fill: #000; }

.item circle { stroke-width: 1.3px; stroke: #444; stroke-opacity: 1; fill-opacity: 1; }
.item text { fill: #000; fill-opacity: .7; font-weight: bold; alignment-baseline: middle; }

.item:hover circle { stroke-width: 1.75px; stroke: #000; fill-opacity: 1; }
.item:hover text { fill: #000; fill-opacity: 1; font-weight: bold}

.selectedItem circle, .selectedItem:hover circle { stroke: #000; stroke-width: 2.0px; fill-opacity: 1; }
.selectedItem text, .selectedItem:hover text { fill: #000; fill-opacity: 1;font-weight: bold }

.axis path, .axis line { fill: none; stroke: #000; stroke-width: 0.25px; }
.grid { fill: none; stroke: #777777; stroke-opacity: 0.1; stroke-width: 0.5px; }
.origin { stroke: #AA0000; stroke-opacity: 0.4; stroke-dasharray: 4 2; stroke-width: 0.75px; }

grapher.js

中的

过渡功能

MotionChart.prototype.startTransition = function () {
            if (!this._diagram) {
                this.draw();
            }
            this._timeSliderPlayButton.style("display", "none");
            this._timeSliderHead.style("display", "block");
            var startTime = this._startTime.getTime();
            var endTime = this._endTime.getTime();
            var currentTime = this._currentTime.getTime();
            //37500 Increased by JVK
            var duration = ((endTime - currentTime) * 37500) / (endTime - startTime);
            var timeInterpolator = d3.interpolate(this._currentTime, this._endTime);
            var self = this;
            this._diagram.transition()
                .duration(duration)
                .ease("linear")
                .tween("date", function () {
                return function (t) {
                    self.update(new Date(timeInterpolator(t)));
                };
            })
                .each("end", function () { self.stopTransition(); });
        };