Question

I want to display arrow in the reverse directions of this jsfiddle

http://jsfiddle.net/5qaL886d/1/

I an not understanding which attributes to change to do so.
Thanks in advance..

Answer 1

此片段中的箭头是“手动”绘制的，即箭头点是手动计算的。所以你需要做的是重新计算它们，以便它们位于不同的一端。通常，箭头应该使用“defs”创建（它更容易），但在这种情况下，它们似乎会导致IE10的问题，因此手工绘制。无论如何，这里是片段的更新版本，箭头“反转”，但没有反转输入数据。你只需要在这里和那里改变标志：

var dx = d.target.x - d.source.x,
    dy = d.target.y - d.source.y,
    dr = Math.sqrt(dx * dx + dy * dy),
    theta = Math.atan2(dy, dx) - Math.PI / 7.85,
    d90 = Math.PI / 2,
    dtxs = d.source.x + 6 * Math.cos(theta),
    dtys = d.source.y + 6 * Math.sin(theta);

return "M" + d.source.x + "," + d.source.y + 
    "A" + dr + "," + dr + " 0 0 1," + d.target.x + "," + d.target.y + 
    "A" + dr + "," + dr + " 0 0 0," + d.source.x + "," + d.source.y + 
     "M" + dtxs + "," + dtys +  
     "l" + (3.5 * Math.cos(d90 - theta) + 10 * Math.cos(theta)) + 
     "," + (-3.5 * Math.sin(d90 - theta) + 10 * Math.sin(theta)) + 
     "L" + (dtxs - 3.5 * Math.cos(d90 - theta) + 10 * Math.cos(theta)) + 
     "," + (dtys + 3.5 * Math.sin(d90 - theta) + 10 * Math.sin(theta)) + 
    "z";

http://jsfiddle.net/4kmhugof/1/

如何反转此jsfiddle http://jsfiddle.net/5qaL886d/1/中显示的箭头方向

1 个答案: