Como posso desenhar uma linha com setas entre dois círculos, dado:

Localização dos centros dos cirlcesRaio dos círculos

estou usandolinha emarcador objetos svg.

Se eu desenhar as setas para o "centro" do círculo - então a seta é invisível. Se eu mover a flecha muito para trás - então a linha mostra e esconde a extremidade pontiaguda da flecha (aqui exagerada para melhor visibilidade):

Conforme o pedido, aqui estão os bits relevantes do meu código (em livescript):

# Draw an arrow to use for lines
svg.append("svg:defs")
 .append("svg:marker")
  .attr("id", "arrow")
  .attr("viewBox", "0 0 10 10")
  .attr("refX", 27)
  .attr("refY", 5)
  .attr("markerUnits", "strokeWidth")
  .attr("markerWidth", 8)
  .attr("markerHeight", 6)
  .attr("orient", "auto")
  .append("svg:path")
  .attr("d", "M 0 0 L 10 5 L 0 10 z")

svg.append("line")
 .attr "x1" 5 
 .attr "x2" 50 
 .attr "y1" 5 
 .attr "y2" 50
 .style "stroke" "black"
 .attr "stroke-width" 2
 .attr "marker-end" "url(\#arrow)"

Alternativamente, aqui está o JSFiddle do exemplo de trabalho (observe que as setas estão "remexidas" para ficarem corretas):http://jsfiddle.net/yeQS2/