Я экспериментирую с интеграцией d3 и Leaflet и создал timelapse / map. Как вы можете видеть в этом видео , текст переходит с каждым новым назначением данных, что затрудняет чтение при длительных периодах одного и того же года (например, 1969). Есть ли способ избежать переходов, если следующее значение совпадает с предыдущим?
Вот соответствующий код:
var timer= svg2.selectAll(".text")
.data(json.features.sort(function(a,b) { return parseTime(a.properties.date_cleaned) - parseTime(b.properties.date_cleaned); }))
.enter().append("text")
.transition().delay(function (d, i) {return speed*i;})
.attr("x", 80)
.attr("y", 20)
.attr("class", "timer")
.style("font-size", "20px")
.style("opacity", 1)
.text(function (d) { return d3.timeFormat("%Y")(parseTime(d.properties.date_cleaned));})
.transition().duration(speed*0.5).style("opacity", 0)
Другой вариант - свернуть точки данных по годам, но я все же хочу, чтобы каждая точка отображалась отдельно на карте. Я теоретически мог бы сделать это, но более идеальным решением было бы только изменить линию (и) перехода, чем реструктурировать набор данных и весь другой рабочий код.