Function setPostalCodePolygonCondition

郵便番号ポリゴン表示条件を設定する — 詳細な使用例

郵便番号に基づいてポリゴンを地図上に描画します。
mode: 'selective'（デフォルト）で追加した郵便番号のみ表示、mode: 'all' で表示範囲内全件表示に切り替えられます。
ポリゴンの塗り色・枠線スタイル、ラベルの表示設定、各種イベントリスナーを設定できます。
スタイルを変更したポリゴンは前面に描画されます。

PostalCodePolygonConditionInitOptions

オプション	説明	デフォルト
mode	'selective'（選択表示）/ 'all'（全件表示）	'selective'
zoomRange	表示ズームレベル範囲（最小は13）	ZoomRange(13, 22)
defaultPolygonStyleOptions	ポリゴンのデフォルトスタイル	青色半透明
label	ラベル表示設定	表示あり・黒文字・白縁

PostalCodePolygonStyleOptions

オプション	説明
fillColor	塗りつぶし色（Colorオブジェクト・アルファで不透明度指定）
strokeColor	枠線の色
strokeWeight	枠線の太さ（px）
strokeDashArray	点線パターン（未指定で実線）

PostalCodeLabelOptions

オプション	説明	デフォルト
visible	ラベルの表示・非表示	true
zoomRange	ラベル表示ズームレベル範囲（未指定でポリゴンと同じ）	undefined
style	ラベルのデフォルトスタイル	16px・太字・黒文字・白縁
isHyphenated	true で 123-4567 形式で表示	false
labelClickListener	ラベルクリックリスナー	undefined
labelMouseEnterListener	ラベルマウスエンターリスナー	undefined
labelMouseLeaveListener	ラベルマウスリーブリスナー	undefined

Warning

• ホバー等でスタイル上書きした場合は、終了時に元のスタイルを再設定してください（上書きは保持されます）。
• mode: 'all' では addPostalCodePolygons / removePostalCodePolygons は無視されます。
• 最小ズームレベルは13で固定です（13未満を指定しても13として扱われます）。

Example: selectiveモード：2つの郵便番号ポリゴンをカスタムスタイルで表示する

import * as GIA from '@ntj/gaia';

const defaultStyle: GIA.types.PostalCodePolygonStyleOptions = {
  fillColor: new GIA.value.Color(0, 0, 1, 0.2),
  strokeColor: new GIA.value.Color(0, 0, 1, 1),
  strokeWeight: 1,
};

const condition = new GIA.value.PostalCodePolygonCondition({
  mode: 'selective',
  zoomRange: new GIA.value.ZoomRange(13, 22),
  defaultPolygonStyleOptions: defaultStyle,
  label: {
    visible: true,
    isHyphenated: true,
  },
});

map.setPostalCodePolygonCondition(condition);

// 郵便番号ポリゴンを追加（スタイル個別指定も可）
map.addPostalCodePolygons(new Map([
  ['100-0004', { fillColor: new GIA.value.Color(0, 0, 1, 0.2) }], // 東京都千代田区大手町
  ['100-0005', { fillColor: new GIA.value.Color(0, 0.5, 0, 0.2) }], // 東京都千代田区丸の内
]));
Copy

Example: allモード：表示範囲内の全郵便番号ポリゴンを表示する

import * as GIA from '@ntj/gaia';

map.setPostalCodePolygonCondition(new GIA.value.PostalCodePolygonCondition({
  mode: 'all',
  defaultPolygonStyleOptions: {
    fillColor: new GIA.value.Color(1, 0.5, 0, 0.15),
    strokeColor: new GIA.value.Color(1, 0.5, 0, 1),
    strokeWeight: 1,
  },
}));
Copy

Example: ラベルホバーでスタイルを切り替える（ホバー終了時に元に戻す）

import * as GIA from '@ntj/gaia';

const normalStyle: GIA.types.PostalCodePolygonStyleOptions = {
  fillColor: new GIA.value.Color(0, 0, 1, 0.2),
  strokeColor: new GIA.value.Color(0, 0, 1, 1),
  strokeWeight: 1,
};

const hoverStyle: GIA.types.PostalCodePolygonStyleOptions = {
  fillColor: new GIA.value.Color(1, 0, 0, 0.4),
  strokeColor: new GIA.value.Color(1, 0, 0, 1),
  strokeWeight: 3,
};

const normalLabelStyle: GIA.types.PostalCodeLabelStyleOptions = {
  fontSize: '16px',
  fontWeight: 'bold',
  color: '#000000',
  outline: '#FFFFFF',
};

const hoverLabelStyle: GIA.types.PostalCodeLabelStyleOptions = {
  fontSize: '18px',
  fontWeight: 'bold',
  color: '#FF0000',
  outline: '#FFFFFF',
};

const condition = new GIA.value.PostalCodePolygonCondition({
  mode: 'selective',
  defaultPolygonStyleOptions: normalStyle,
  label: {
    visible: true,
    isHyphenated: true,
    style: normalLabelStyle,
    labelClickListener: (data: GIA.types.PostalCodePolygonData) => {
      console.log('クリック:', data.postalCode, data.labelLatLng);
    },
    labelMouseEnterListener: (data: GIA.types.PostalCodePolygonData) => {
      map.setPostalCodePolygonStyles(new Map([[data.postalCode, hoverStyle]]));
      map.setPostalCodePolygonLabelStyles(new Map([[data.postalCode, hoverLabelStyle]]));
    },
    labelMouseLeaveListener: (data: GIA.types.PostalCodePolygonData) => {
      map.setPostalCodePolygonStyles(new Map([[data.postalCode, normalStyle]]));
      map.setPostalCodePolygonLabelStyles(new Map([[data.postalCode, normalLabelStyle]]));
    },
  },
});

map.setPostalCodePolygonCondition(condition);
map.addPostalCodePolygons(['100-0004', '100-0005']);
Copy

See

• setPostalCodePolygonCondition
• clearPostalCodePolygonCondition
• addPostalCodePolygons
• removePostalCodePolygons
• setPostalCodePolygonStyles
• setPostalCodePolygonLabelStyles