javascript - 画像内のクリック可能な領域

Question

いくつかのデザイン案を探しています。私はAngularを使用しています（少なくとも試しています）。背景画像 (2 つ以上) で次のように定義されたクリック可能な領域があるとします。

<div id="clicable0">
        <div class="area1" data-ng-click="jump('v1')"></div>
        <div class="area2" data-ng-click="jump('v2')"></div>
        ...
        <img src="img1.jpg">
</div>

私のCSS：

#clicable0 .area1 { top:100px; left:100px; }
#clicable0 .area2 { top:100px; left:200px; }

上記の例は問題なく動作しますが、Angular と Javascript でさらに多くのことができる一般的なコンポーネント (ディレクティブ?) のように見えます。いくつかのAngular先物でこれを「不透明」にするための提案は何ですか? ありがとう。