setParkingStopCondition は一度に一条件のみ有効です。再設定すると上書きされます。clearParkingStopCondition で非表示に戻せます。setParkingStopClickListener で設定します。setParkingStopFocusedLineId / clearParkingStopFocusedLine で制御します。import * as GIA from '@ntj/gaia';
// dashArrayの設定を生成
const convertToDashArray = (isDashed: boolean): number[] => {
return isDashed ? [1, 1] : [];
};
// 駐車禁止線のスタイル
const parkingLineStyle: GIA.types.ParkingStopLineStyle = {
inline: {
color: GIA.value.Color.fromColorCodeSixHex('FFFF00', 1.0),
weight: 3,
dashArray: convertToDashArray(true),
lineCap: 'round',
},
outline: {
color: GIA.value.Color.fromColorCodeSixHex('000000', 1.0),
weight: 5,
dashArray: convertToDashArray(false),
lineCap: 'round',
},
};
// 駐停車禁止線のスタイル
const parkingStopLineStyle: GIA.types.ParkingStopLineStyle = {
inline: {
color: GIA.value.Color.fromColorCodeSixHex('FF0000', 1.0),
weight: 3,
dashArray: convertToDashArray(true),
lineCap: 'round',
},
outline: {
color: GIA.value.Color.fromColorCodeSixHex('000000', 1.0),
weight: 5,
dashArray: convertToDashArray(false),
lineCap: 'round',
},
};
// 強調表示線のスタイル
const focusedLineStyle: GIA.types.ParkingStopLineStyle = {
inline: {
color: GIA.value.Color.fromColorCodeSixHex('00FFFF', 1.0),
weight: 5,
dashArray: [],
lineCap: 'round',
},
outline: {
color: GIA.value.Color.fromColorCodeSixHex('0000FF', 1.0),
weight: 7,
dashArray: [],
lineCap: 'round',
},
};
// 駐停車禁止のコンディションを生成して地図に設定
const parkingStopCondition = new GIA.value.ParkingStopCondition({
zoomRange: new GIA.value.ZoomRange(15, 24),
parkingLineStyle: parkingLineStyle,
parkingStopLineStyle: parkingStopLineStyle,
focusedLineStyle: focusedLineStyle,
});
map.setParkingStopCondition(parkingStopCondition);
// 現在強調表示中の線ID
let currentFocusedLineId: string | undefined = undefined;
// クリックリスナーを設定
map.setParkingStopClickListener((data) => {
// 同じ線を再クリックした場合は強調表示を解除、別の線なら強調表示
if (currentFocusedLineId === data.id) {
currentFocusedLineId = undefined;
map.clearParkingStopFocusedLine();
} else {
currentFocusedLineId = data.id;
map.setParkingStopFocusedLineId(data.id);
}
console.log(
`駐停車禁止情報:\n` +
`id: ${data.id}\n` +
`prefecture_class: ${data.prefecture_class}\n` +
`restriction_class: ${data.restriction_class}\n` +
`datum: ${data.datum}\n` +
`start_time: ${data.start_time}\n` +
`end_time: ${data.end_time}\n` +
`restriction_day: ${data.restriction_day}\n` +
`start_time2: ${data.start_time2}\n` +
`end_time2: ${data.end_time2}\n` +
`restriction_day2: ${data.restriction_day2}\n`
);
});
駐停車禁止のコンディションを設定する — 詳細な使用例
駐車禁止線・駐停車禁止線のスタイル（色・太さ・破線・角丸など）を各内線/外線ごとに定義し、
ParkingStopConditionで地図上に描画します。 クリックリスナーで規制データ（ID・規制種別・時間帯など）を取得できます。 強調表示線を設定することで、クリックした線を目立たせることも可能です。