3.2. マーカー#
概要#
マーカーモジュールは、ユーザーが注目すべき場所やクリックすべきポイントを視覚的に示すためのコンポーネントです。このモジュールを利用することで、指マークのアイコンを表示し、操作をガイドしたり、特定のエリアに注目を促すことができます。また、マーカーにテキストを追加することで、具体的な指示(例:「ここをクリック」)をユーザーに提示できます。
利用方法#
セキュアプラクティスAdminの「シナリオ管理」内にある以下のセクションで、コンストラクタを呼び出してインスタンスを生成し、プロパティおよびメソッドを利用できます:
コンテンツ > スクリプトブロック
ガイダンス > 遷移先 > スクリプト > スクリプトブロック
ガイダンス > 遷移先 > オプション > 前処理
ガイダンス > 遷移先 > オプション > 後処理
例)
let marker = new SieApiBlockMarker();
・
・
・
marker.point(outlook1.thisWindow, 'div.outlook-footer', 50, -30, 100000);
クラス名#
SieApiMarker
プロパティ#
reverse#
マーカーを上下反転させる。表示領域の都合で、上方向に余白がない場合は上下反転させて表示させることができる。
- プロパティ値
- booleantrue:反転する。false:反転しない
message#
マーカーにメッセージを追加表示させる。
- プロパティ値
- string
メソッド#
コンストラクタ#
マーカーモジュールには、以下の2つの利用方法がある。
1. コンストラクタで表示位置を指定し、showメソッドで表示する方法(非推奨)
この方法では、マーカーモジュールのインスタンスを作成する際に、コンストラクタの引数として表示位置を指定する。その後、show()メソッドを呼び出すことで、指定した位置にマーカーを表示する。 しかし、表示位置を動的に変更する必要がある場合に対応が難しく、柔軟性に欠けるため、互換性のため残しているが非推奨とする。
2. pointメソッドを使用して表示する方法(推奨)
この方法では、コンストラクタで引数を指定せずにインスタンスを生成し、point()メソッドを使用して表示と同時に位置を指定する。
引数
$_targe : jquery object
マーカーを表示する親要素となるjQueryオブジェクトを指定する
_selector : string
マーカーを表示する対象のセレクターを指定する
_left : number
マーカーを指定した対象要素の右方向に表示する位置をピクセル単位で設定する
_top : number
マーカーを指定した対象要素の右方向に表示する位置をピクセル単位で設定する
show#
コンストラクタで指定した位置にマーカーを表示する。
- 引数
なし
- 戻り値
なし
point#
引数で指定した位置にマーカーを表示する。コンストラクタでは引数を指定しない。
引数
$_targe : jquery object
マーカーを表示する親要素となるjQueryオブジェクトを指定する
_selector : string
マーカーを表示する対象のセレクターを指定する
_left : number
マーカーを指定した対象要素の右方向に表示する位置をピクセル単位で設定する
_top : number
マーカーを指定した対象要素の右方向に表示する位置をピクセル単位で設定する
_zIndex : number
マーカーのzIndexを指定する通常は指定しなくてもよいが、マーカーが要素の背面に入ってしまう場合に大きい値を設定する
- 戻り値
なし
hide#
マーカーを表示にする。
- 引数
なし
- 戻り値
なし