arrows with label

labelled-arrows.svg

<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
  viewBox="0 0 900 500" width="900" height="500">
  <defs>
    <marker viewBox="0 0 10 10" refX="10" refY="5"
      markerUnits="strokeWidth" preserveAspectRatio="none"
      markerWidth="5" markerHeight="10"
      orient="auto-start-reverse" id="arrow1">
      <polygon points="0,0 0,10 10,5" fill="black" />
      <path d="M10,0 L10,10" stroke="black" stroke-width="2" />
    </marker>
    <path d="M10,10 L110,10"
      stroke="black" stroke-width="1"
      marker-start="url(#arrow1)" marker-end="url(#arrow1)" id="line1" />
    <path d="M10,10 L110,10"
      stroke="black" stroke-width="1"
      marker-start="url(#arrow1)" marker-end="url(#arrow1)" id="line2" />
    <text font-style = "italic" id="t_i">
      <tspan x="50" y="0" font-size="14">t</tspan>
      <tspan x="55" y="-2" font-size="8" baseline-shift="sub">i</tspan>
    </text>
    <text font-style = "italic" id="t_j2">
      <tspan x="50" y="0" font-size="14">t</tspan>
      <tspan x="55" y="-2" font-size="8" baseline-shift="sub">j</tspan>
      <tspan x="58" y="-7" font-size="8" baseline-shift="sup">2</tspan>
    </text>
  </defs>
  <use xlink:href="#t_i" x="10" y="15" />
  <use xlink:href="#line1" x="10" y="15" />
  <use xlink:href="#t_j2" x="110" y="15" />
  <use xlink:href="#line2" x="110" y="15"/>
</svg>