2009-03-19 7 views
1

JSF/Richfacesを使用して次のタスクを実行します。JSF/Richfacesでマップを使用してイメージをレンダリングする方法は?

リンクをクリックすると、マップのPNG画像(画像の一部をクリック可能にする必要があります)がパネルの下にレンダリングされます。

私が画像を生成するとき、私はクリック可能でなければならない画像の座標を知っています。だから私は地図を生成することができます。しかし、私は1つのXHTMLファイルの下でそれをやりたい豊富な:paint2dタグのようなマップを受け入れる -

<map name="mapGraph"> 
    <area coords="754,378 20" href="http://google.com" shape="Circle" alt="Drill Down"> 
    <area coords="33,439 20" href="http://google.com" shape="Circle" alt="Drill Down"> 
    <area coords="393,425 20" href="http://google.com" shape="Circle" alt="Drill Down"> 
    <area coords="573,378 20" href="http://google.com" shape="Circle" alt="Drill Down"> 
    <area coords="213,407 20" href="http://yahoo.com" shape="Circle" alt="Drill Down"> 
</map> 

答えて

1

これを達成するためのデフォルトの方法はありません。独自のJSFカスタムコンポーネントを開発する方法があります。 <custom:image id = "im1" width="800px" height="400px" useMap="dwMap"/>のような独自のJSFタグを開発しました。このタグを見つけJSFのengneは - それはJSFにおける1つのカスタムコンポーネントを開発するために複雑に聞こえるが、それは本当に簡単ですが

<img width="800" border="0" height="400" useMap="#dwMap" src="/imageB94DFA031CA999EE65ED586627F630BE.png"/> 
<map name="dwMap"><area coords="735,225 20" shape="Circle" onMouseOver="call('735,225 20')" title="Start Time : 2009-02-16 15:32:48 
End Time : 2009-02-16 15:34:59" /><area coords="570,225 20" shape="Circle" onMouseOver="call('570,225 20')" title="Start Time : 2009-02-16 15:32:27 
End Time : 2009-02-16 15:32:39" /><area coords="405,237 20" shape="Circle" onMouseOver="call('405,237 20')" title="Start Time : 2009-02-16 15:14:41 
End Time : 2009-02-16 15:16:58" /><area coords="241,215 20" shape="Circle" onMouseOver="call('241,215 20')" title="Start Time : 2009-02-16 15:13:50 
End Time : 2009-02-16 15:14:00" /><area coords="76,181 20" shape="Circle" onMouseOver="call('76,181 20')" title="Start Time : 2009-02-13 17:57:31 
End Time : 2009-02-13 17:58:18" /></map> 

のようなマップでhtmlタグ「IMG」をレンダリングします。 Richard Hightowerの記事 "JSF for nonbelievers"に続き、カスタムコンポーネントの開発は可能な限り簡単になります。

関連する問題