完成品

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
  xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
  width="240" height="240"
>
  <g
    style="font-size:16px;text-anchor:middle;text-align:center;"
    transform="translate(120,120)"
  >
    <path
      style="fill:#d5cda2;stroke:none;"
      d="M 74,0 A 74,74 0 1 1 -74,0 74,74 0 1 1 74,0 z"
    />
    <defs>
      <path
        id="circle"
        d="M 80,0 A 80,80 0 1 1 -80,0 80,80 0 1 1 80,0 z"
        transform="rotate(90)"
      />
    </defs>
    <text transform="rotate(-120)">
      <textPath xlink:href="#circle" startOffset="50%">
        <a xlink:href="url" target="_top">■LinkA</a>
      </textPath>
    </text>
    <text>
      <textPath xlink:href="#circle" startOffset="50%">
        <a xlink:href="url" target="_top">■LinkB</a>
      </textPath>
    </text>
    <text transform="rotate(120)">
      <textPath xlink:href="#circle" startOffset="50%">
        <a xlink:href="url" target="_top">■LinkC</a>
      </textPath>
    </text>
  </g>
</svg>
<1,021 バイト>

パスを引く

 テキストを置くためのパスを引きます。
 今回は円の上に置いていきたいと思います。
  <path 
    id="circle1"
    d="M 280,160 A 120,120 0 1 1 40,160 120,120 0 1 1 280,160 z"
    style="fill:none;stroke:red"
  />

 circle タグで書くとテキストを置けないようなので path タグから円を生成しなければいけません。
 かなりさ迷い最終的に Inkscape から抽出しました。
 説明は省略させてください。

 テキストを配置する際に使用するので ID を付けておきましょう。
 赤線スタイルを適用しましたが最後に隠すので必要がなくなります。

リンク付きテキストを置く

  <text x="0" y="24" font-size="24">
    <a xlink:href="url" target="_top">Link</a>
  </text>
 リンクは xlink:href 要素を使います。
 ターゲットを _top にしておく必要があります。

埋め込みは object で

 SVG の埋め込み方を間違えて少しはまりました。
  <img src="svg/circlelink_02.svg">

 イメージタグで挿入するとカーソルを合わせてもリンクが機能しません。
 画像として挿入されているのだから当然ですが気がつきませんでした。
  <object type="image/svg+xml" data="svg/circlelink_02.svg"></object>

 オブジェクトタグで挿入するとリンクが機能します。
 いろいろあるみたいです。

パスに沿わせる

  <text font-size="24">
    <textPath xlink:href="#circle1">
      Link
    </textPath>
  </text>

 テキストを textPath タグでくくり、xlink:href 要素で先ほど作成したパスの ID を指定します。

align center

 テキストの中心が真上になるようにしたいと思います。
  <text style="font-size:12px;text-anchor:middle;text-align:center;">
 まずテキストのアンカーを中心に、アラインをセンターにしました。

 一部欠けますが次で戻ります。
  <textPath xlink:href="#circle1" startOffset="50%">
 textPath の startOffset を50パーセントにすると欠けていた部分が戻ります。

 次に回転させますが、設計ミスにより大幅な変更を要するので全て書き直します。
  <g transform="translate(160,160)">
    <path
      id="circle"
      d="M 120,0 A 120,120 0 1 1 -120,0 120,120 0 1 1 120,0 z"
      style="fill:none;stroke:red"
      transform="rotate(90)"
    />
    <text style="font-size:24px;text-anchor:middle;text-align:center;">
      <textPath xlink:href="#circle" startOffset="50%">
        <a xlink:href="url">Link</a>
      </textPath>
    </text>
  </g>
 回転は原点中心に行われるためいろいろ手を加える必要があります。
 ただ、このおかげで円をパスで描く方法が明らかになりました。

パスを隠す

  <defs>
    <path ... />
  </defs>
 最後にパスを defs で囲うとパスが隠れて完成します。

アンチエイリアシング

 アンチエイリアスのかからない環境ではフォントが汚いので残念です。(左:なし 右:あり)