Function setTurnRestrictionCondition

  • setTurnRestrictionCondition(): void

  • 指定方向外進行禁止情報の表示条件を設定する — 詳細な使用例

    交差点での進行禁止方向をアイコンと線で地図上に描画します。 アイコン画像・線の色/太さ・ズームレベル範囲をカスタマイズできます。 吹き出し（InfoWindow）やクリックリスナーで規制データを取得できます。

    Returns void

    Warning

    • icon は必須プロパティです。規制種別ごとにアイコン画像を指定してください。
    • 吹き出しを表示するには setTurnRestrictionInfoWindowCallback を併用してください。
    • クリックイベントを取得するには setTurnRestrictionIconClickListener を利用してください。
    • clearTurnRestrictionCondition で非表示に戻せます。

    Example: 指定方向外進行禁止情報を表示し、吹き出しとクリックイベントを設定する

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

    const BINARY = 2;
    const BITS_IN_BYTE = 8;
    const DAY_LIST = ['月', '火', '水', '木', '金', '土', '日', '祝'];

    const getDoubleDigestNumber = (num: number) => (`0${num}`).slice(-2);
    const decodeOnDay = (onDayNum: number) => {
      let onDayStr = '';
      for (let i = BITS_IN_BYTE; i >= 1; i--) {
        const bit = Math.pow(BINARY, i - 1);
        if (onDayNum >= bit) {
          onDayNum -= bit;
          onDayStr += DAY_LIST[BITS_IN_BYTE - i];
        }
      }
      return onDayStr;
    };

    const IMAGE_SIZE = 28;
    const iconInfo = new GIA.value.TurnRestrictionIconInfo({
      icon: 'path/to/turn-restriction-icon.png',
      size: new GIA.value.Size(IMAGE_SIZE, IMAGE_SIZE),
    });

    map.setTurnRestrictionCondition(new GIA.value.TurnRestrictionCondition({
      zoomRange: new GIA.value.ZoomRange(17, 20),
      infoWindowZoomRange: new GIA.value.ZoomRange(18, 20),
      header: {
        'ntj-turn-restriction-info': 'a37bbc24-e42e-4bda-9026-93a02973cf50',
      },
      icon: {
        STOP: { info: iconInfo },
        GENERAL_ALL_DAY: { info: iconInfo },
        STRAIGHT_ALL_DAY: { info: iconInfo },
        RIGHT_ALL_DAY: { info: iconInfo },
        LEFT_ALL_DAY: { info: iconInfo },
        STRAIGHT_OR_RIGHT_ALL_DAY: { info: iconInfo },
        STRAIGHT_OR_LEFT_ALL_DAY: { info: iconInfo },
        LEFT_OR_RIGHT_ALL_DAY: { info: iconInfo },
        GENERAL_LIMITED_TIME: { info: iconInfo },
        STRAIGHT_LIMITED_TIME: { info: iconInfo },
        RIGHT_LIMITED_TIME: { info: iconInfo },
        LEFT_LIMITED_TIME: { info: iconInfo },
        STRAIGHT_OR_RIGHT_LIMITED_TIME: { info: iconInfo },
        STRAIGHT_OR_LEFT_LIMITED_TIME: { info: iconInfo },
        LEFT_OR_RIGHT_LIMITED_TIME: { info: iconInfo },
      },
      targetCarTypes: {
        STANDARD_CAR: true,
        MEDIUM_CAR_WITHOUT_SPECIFIED: true,
        SPECIFIED_MEDIUM_CAR: true,
        LARGE_CAR: true,
        STANDARD_TRUCK: false,
        MEDIUM_TRUCK_WITHOUT_SPECIFIED: false,
        SPECIFIED_MEDIUM_TRUCK: false,
        LARGE_TRUCK: false,
        LARGE_SPECIAL_CAR: false,
        SMALL_SPECIAL_CAR: false,
        LIGHT_CAR: false,
        MOTORCYCLE: false,
        SEMI_MEDIUM_CAR: false,
        SEMI_MEDIUM_TRUCK: false,
      },
    }));

    // アイコンクリック時のリスナー
    map.setTurnRestrictionIconClickListener((data) => {
      console.log('進行禁止情報:', data);
    });

    // 吹き出し（InfoWindow）表示コールバック
    map.setTurnRestrictionInfoWindowCallback((latlng, restrictions) => {
      let msg = '規制時刻：<br>';
      for (const restriction of restrictions) {
        const limitedDate = restriction.limited_time?.limited_date;
        const limitedDay = restriction.limited_time?.on_day;
        const hasTime = restriction.limited_time?.begin_hour !== undefined;

        if (limitedDate) {
          const dateBgn = `${getDoubleDigestNumber(limitedDate.begin_month)}/${getDoubleDigestNumber(limitedDate.begin_day)}`;
          const dateEnd = `${getDoubleDigestNumber(limitedDate.end_month)}/${getDoubleDigestNumber(limitedDate.end_day)}`;
          msg += `${dateBgn}~${dateEnd} `;
        }
        if (limitedDay) {
          msg += `${decodeOnDay(limitedDay)} `;
        }
        if (hasTime) {
          const timeBgn = `${getDoubleDigestNumber(restriction.limited_time.begin_hour)}:${getDoubleDigestNumber(restriction.limited_time.begin_min)}`;
          const timeEnd = `${getDoubleDigestNumber(restriction.limited_time.end_hour)}:${getDoubleDigestNumber(restriction.limited_time.end_min)}`;
          msg += `${timeBgn}~${timeEnd}`;
        }
        msg += '<br>';
      }

      return new GIA.object.InfoWindow({
        content: msg,
        position: new GIA.value.LatLng(latlng.lat + 0.00002, latlng.lng),
      });
    });

    See

Settings

Member Visibility

Theme