mirror of
https://github.com/FoggedLens/iD.git
synced 2026-02-25 15:05:32 +00:00
Fix flicker
This commit is contained in:
@@ -1,65 +1,64 @@
|
||||
iD.svg.Turns = function(projection) {
|
||||
return function(surface, graph, turns) {
|
||||
var layer = surface.select('.layer-hit'),
|
||||
nTurns = turns.filter(function (d) { return !d.u; }),
|
||||
uTurns = turns.filter(function (d) { return d.u; });
|
||||
function key(turn) {
|
||||
return iD.Entity.key(graph.entity(turn.from.node)) + ',' +
|
||||
iD.Entity.key(graph.entity(turn.via.node)) + ',' +
|
||||
iD.Entity.key(graph.entity(turn.to.node)) + ',' +
|
||||
turn.restriction;
|
||||
}
|
||||
|
||||
var nGroups = layer.selectAll('g.turn.turn-n')
|
||||
.data(nTurns);
|
||||
var uGroups = layer.selectAll('g.turn.turn-u')
|
||||
.data(uTurns);
|
||||
var groups = surface.select('.layer-hit').selectAll('g.turn')
|
||||
.data(turns, key);
|
||||
|
||||
// Enter
|
||||
|
||||
var nEnter = nGroups.enter().append('g')
|
||||
.attr('class', 'turn turn-n');
|
||||
var uEnter = uGroups.enter().append('g')
|
||||
.attr('class', 'turn turn-u');
|
||||
var enter = groups.enter().append('g')
|
||||
.attr('class', 'turn')
|
||||
.classed('restricted', function (turn) {
|
||||
return turn.restriction;
|
||||
});
|
||||
|
||||
var nEnter = enter.filter(function (turn) { return !turn.u; });
|
||||
|
||||
nEnter.append('rect')
|
||||
.attr('transform', 'translate(-12, -12)')
|
||||
.attr('width', '45')
|
||||
.attr('height', '25');
|
||||
uEnter.append('circle')
|
||||
.attr('r', '16');
|
||||
|
||||
nEnter.append('use')
|
||||
.attr('transform', 'translate(-12, -12)')
|
||||
.attr('clip-path', 'url(#clip-square-45)');
|
||||
.attr('clip-path', 'url(#clip-square-45)')
|
||||
.attr('xlink:href', function(turn) { return '#icon-restriction-' + (turn.restriction ? 'no' : 'yes'); });
|
||||
|
||||
var uEnter = enter.filter(function (turn) { return turn.u; });
|
||||
|
||||
uEnter.append('circle')
|
||||
.attr('r', '16');
|
||||
|
||||
uEnter.append('use')
|
||||
.attr('transform', 'translate(-16, -16)')
|
||||
.attr('clip-path', 'url(#clip-square-32)');
|
||||
.attr('clip-path', 'url(#clip-square-32)')
|
||||
.attr('xlink:href', function(turn) { return '#icon-restriction-' + (turn.restriction ? 'no' : 'yes') + '-u'; });
|
||||
|
||||
// Update
|
||||
|
||||
layer.selectAll('g.turn')
|
||||
.classed('restricted', function(turn) {
|
||||
return turn.restriction;
|
||||
})
|
||||
.attr('transform', function(turn) {
|
||||
var v = graph.entity(turn.via.node),
|
||||
t = graph.entity(turn.to.node),
|
||||
a = iD.geo.angle(v, t, projection),
|
||||
p = projection(v.loc),
|
||||
r = turn.u ? 0 : 60;
|
||||
groups.attr('transform', function (turn) {
|
||||
var v = graph.entity(turn.via.node),
|
||||
t = graph.entity(turn.to.node),
|
||||
a = iD.geo.angle(v, t, projection),
|
||||
p = projection(v.loc),
|
||||
r = turn.u ? 0 : 60;
|
||||
|
||||
return 'translate(' + (r * Math.cos(a) + p[0]) + ',' + (r * Math.sin(a) + p[1]) + ')' +
|
||||
'rotate(' + a * 180 / Math.PI + ')';
|
||||
});
|
||||
return 'translate(' + (r * Math.cos(a) + p[0]) + ',' + (r * Math.sin(a) + p[1]) + ')' +
|
||||
'rotate(' + a * 180 / Math.PI + ')';
|
||||
});
|
||||
|
||||
nGroups.select('use')
|
||||
.attr('xlink:href', function(turn) { return '#icon-restriction-' + (turn.restriction ? 'no' : 'yes'); });
|
||||
uGroups.select('use')
|
||||
.attr('xlink:href', function(turn) { return '#icon-restriction-' + (turn.restriction ? 'no' : 'yes') + '-u'; });
|
||||
|
||||
nGroups.select('rect');
|
||||
uGroups.select('circle');
|
||||
groups.select('rect');
|
||||
groups.select('circle');
|
||||
|
||||
// Exit
|
||||
|
||||
nGroups.exit()
|
||||
.remove();
|
||||
uGroups.exit()
|
||||
groups.exit()
|
||||
.remove();
|
||||
|
||||
return this;
|
||||
|
||||
Reference in New Issue
Block a user