0

我试图在地图上画出多条线——基本上是到地铁站的步行路线。这些步行方向中的许多在 50% 或更多的旅程中都是相同的(正如您所期望的,来自同一个起点),所以当我画它们时,它们相互重叠,相互遮蔽——就像所以:

绘制在彼此顶部的线条

在这个例子中,红线部分被黄线遮住了——我想移动黄色,例如以 45 度角使其与红线平行。我最初尝试将 X 和 Y 坐标偏移几个像素,但任何不是 90 度角的线看起来都是错误的。我开始尝试计算一条线所经过的度数,老实说,我开始迷路了——了解它的编程方面,而不是它的几何/三角/数学。

有没有人对我什至应该寻找哪些关键字或我应该采取哪些途径提出一些建议?提前致谢。

4

2 回答 2

1

一个技巧是在重叠时错开线条。这里有 4 条线重叠和交错,以便所有线都可见。人眼训练有素,可以跟随颜色。

示例:http: //jsbin.com/ovacar/1/edit

<svg>
  <path stroke="skyblue" stroke-width="4" stroke-dasharray="5,15" d="M0 20 l215 0" /> 
  <path stroke="cyan" stroke-width="4" stroke-dasharray="0,0,5,15" d="M5 20 l215 0" />
  <path stroke="pink" stroke-width="4" stroke-dasharray="0,5,5,10" d="M5 20 l215 0" />
  <path stroke="green" stroke-width="4" stroke-dasharray="0,10,5,5" d="M5 20 l215 0" />
</svg>
于 2013-05-05T23:24:09.260 回答
0

我会尝试通过在纬度和经度值上添加一小部分(尝试 .00001 但进行实验),将 2 号线的每个角落向东北移动几米。这应该在放大时给出平行线。

您还可以尝试降低线条的不透明度,以便它们混合而不是叠加。

于 2013-05-05T10:14:32.970 回答