問題タブ [imagemapster]

ImageMapster.js を使用してイメージマップを正常に作成しましたが、1 つの問題が発生しました。私のクライアントは、ページがロードされたときに 1 つの領域が選択されることを望んでおり、ユーザーが選択された領域が選択解除され、残りの領域のように動作するマップ上にカーソルを置きます。しかし、私はこれを達成する方法を理解できないようです。選択した領域は常に選択されたままになります。これは私の最初のコードです：

selected: true を使用すると常に領域が選択されることは承知していますが、ページロードの直後に領域を選択できる唯一の関数です。マウスオーバー時にすべての初期設定をリセットする新しい状態を作成する方法を見つけようとしています。いくつかのことを試しました (たとえば、Beatles のデモ コードを変更する) が、マウスオーバーで area_1 を選択解除することができません。

誰かが私を助けてくれるか、このスクリプトでそれが可能かどうか教えてくれることを願っています.

ハイライト用の「非インテリジェント ストレージ」として ImageMapster を使用したいと考えています。私は AngularJS で使用しており、Angular スコープ内でハイライト状態などを追跡する必要があります。しかし、ハイライト領域をクリックすると問題が発生します。これは、Mapster が独自の状態を設定し、これが Angular スコープと衝突しているためです。

他のすべての機能が必要です。マップスター内でクリックイベントアクションのハイライトを無効にしたいだけです。これは可能ですか？

画像上の im マークの部屋:

• 完売
• 予約済み
• 販売のため

各グループには独自の色があります。「販売中」のある部屋にカーソルを合わせると、このグループ内のすべての部屋が強調表示されます。しかし、私はこれだけを強調したいと思います。

これは HTML コードです:

ImageMapster コード:

color=red は、この部屋が売りに出されていることを意味します color=green は、この部屋が売りに出されていることを意味します .... など

したがって、この部屋にマウスオーバーして部屋のステータスを確認すると、このコードは他のすべてを color=red で強調表示しますが、この 1 つだけを強調表示したいと思います。

iviewerを使用してimagemapsterをズームおよびパンしようとしましたが、iviewer を介して画像がロードされたときに imagemapster を動作させることができません。多分それは不可能ですか？画像の URL は、iviewer 関数のパラメーターとして iviewer に渡す必要があります。imagemapster がイメージ マップにアクセスできるように、jquery のあとがきで classname と usemap='#map' をイメージに追加しようとしましたが、classname と usemap の値は結果の html に表示されますが、imagemapster は明らかにそれらにアクセスできません。またはどういうわけか動作しません。

ここで私の目標を達成する方法についてのヒントはありますか?

mapster を使用して、9 つの領域を持つイメージマップを作成しました。領域をクリックすると、イメージマップの上にテキストが表示されるようになりました。選択した領域に応じて、代わりに複数のフォルダーから画像を表示したいと考えています。イメージマップで領域「kamer1」が選択されている場合、フォルダー「/kamer1」のすべての画像をイメージマップの上に表示したいと思います。

JavaScript を扱うのは初めてなので、誰かにとっては簡単な問題だと思います。

JSFIDDLE を作成しました: http://jsfiddle.net/BTnV2/7/

HTML:

JS:

angularjs hereを使用したイメージマップコードの概念実証があります。

ここにまとめたjqueryの例と同じように動作するものを書いています。

最初の例では、イメージマップがスコープ変数によって取り込まれているため機能しないことに注意してください。そのため、ページの読み込み時にイメージ src は 404 になります。これにより、イメージマップがまったくアクティブ化されなくなります。この問題を解決する方法を理解していただければ幸いです。