timeZone (Properties)

IBCaelendar의 기준이 될 현지시간대(TimeZone)를 설정합니다.
IE11에서는 "TimeZone" 옵션을 기본값(’"local"’)이 아닌 값으로 설정 시 반복 일정(Recurring Event) 기능을 사용할 수 없습니다.

현지시간대(TimeZone)를 변경하면 다음과 같은 항목들이 영향을 받습니다.

  1. 일정(Event)의 날짜/시간 텍스트 표시 형식
  2. 일정(Event)들의 위치
    -> 일정(Event)의 시작 요일/시간 축
  3. javascript Date 객체를 사용하는 IBCalendar의 모든 API에서 Date 객체를 파싱하는 방법
    -> EventApi 객체의 start/end, View 객체의 activeStart/activeEnd, 콜백(callback) 함수에 의해 노출된 Date 객체 타입의 parameter들
  4. 일정(Event) 데이터 요청 시 url이나 function의 반환값으로 전달받은 일정(Event) 정보
  5. 일정(Event) 데이터를 받았을 때 날짜/시간 정보들을 파싱하는 방법
    -> "UTC 정보가 없는 ISO8601 문자열"인 표준시간대 정보가 없는 문자열들만 해당됩니다.
    -> "2017-04-20T11:32:00+09:00" → "UTC 정보가 있는 ISO8601 문자열"은 현지시간대(TimeZone)를 변경하여도 영향을 받지 않습니다.
    -> "2017-04-20T11:32:00" → "UTC 정보가 없는 ISO8601 문자열"은 현지시간대(TimeZone)를 변경하면 날짜/시간 정보들의 파싱 결과가 달라집니다.

Type

string

Options

Value Description
"local" PC에 설정된 현지 시간대
"UTC" 표준시간대
시간대 명명된 시간대(Named Time Zones)

Example

  1. "local"
    -> OS에 설정된 현지시간을 현지시간대(TimeZone)로 설정합니다.
    -> 일정(Event)들의 날짜/시간 정보가 "UTC 정보가 포함된 ISO8601 문자열"이거나 "millisecond 시간 문자열"인 경우 날짜/시간 정보가 사용자의 현지시간대로 변경하여 표시합니다.
    -> 일정(Event)들의 날짜/시간 정보가 "UTC 정보가 없는 ISO8601 문자열"인 경우 날짜/시간 정보를 현지시간으로 판단하여 그대로 표시합니다.
    -> IBCaelendar의 API를 통해 사용하는 Date 객체의 getMonth(), getHours(), toString()과 같은 API는 현지시간대로 변경된 값을 반환합니다.
calendarData = [
    { title:"timeZoneCalendar-event1", start: "2020-06-10T12:30:00Z", end: "2020-06-10T13:30:00Z", allDay: false },      //UTC 정보가 표준시간대(00:00)로 설정되었으므로 사용자의 현지시간대(+09:00)가 적용되어 21:30으로 표시합니다.
    { title:"timeZoneCalendar-event2", start: "2020-06-10T12:30:00+09:00", end: "2020-06-10T13:30:00+09:00", allDay: false }, //UTC 정보가 포함되어 있으므로 날짜와 시간이 그대로 표시합니다.
    { title:"timeZoneCalendar-event3", start: "2020-06-10T12:30:00", end: "2020-06-10T13:30:00", allDay: false }       //UTC 정보가 포함되어 있지 않으므로 현지시간으로 판단하여 그대로 표시합니다.
];

options = {
    timeZone: "local",
    
    eventSources: [
         {
               id: "devCalendar",
               events: calendarData
         }
    ]
};
  1. "UTC"
    -> 현지시간대(TimeZone)는 사용자의 브라우저마다 다를 수 있지만, 표준시간대(00:00)는 모든 브라우저에서 동일하며 서머타임(summer time)제도도 적용되지 않습니다. 표준시간대(00:00)는 다른 현지시간대(TimeZone)들을 상대적으로 정의하기 위한 기준이 됩니다.
    -> 일정(Event)들의 날짜/시간 정보가 "UTC 정보가 포함된 ISO8601 문자열"이거나 "millisecond 시간 문자열"인 경우 날짜/시간 정보가 표준시간대(00:00)로 변경하여 표시합니다.
    -> 일정(Event)들의 날짜/시간 정보가 "UTC 정보가 없는 ISO8601 문자열"인 경우 날짜/시간 정보를 표준시간대(00:00)로 판단하여 그대로 표시합니다.
    -> IBCaelendar의 API를 통해 사용하는 Date 객체의 getUTCMonth(), getUTCHours(), toUTCString()과 같은 API는 표준시간대(00:00)로 변경된 값을 반환합니다.
    -> "timeZone" 옵션을 "UTC"로 설정하면 사용자의 현지시간대(TimeZone)와 상관없이 모든 일정(Event)들이 브라우저에서 일관성있게 표시됩니다. 하지만 표준시간대(00:00)를 활용하여 다른 현지시간대처럼 보여지게 하려면 "timeZone" 옵션을 "UTC"로 설정하는 대신 "명명된 시간대(Named Time Zones)"로 설정하는 것이 더 좋습니다.
calendarData = [
    { title:"timeZoneCalendar-event1", start: "2020-06-10T12:30:00Z", end: "2020-06-10T13:30:00Z", allDay: false },      //UTC 정보가 표준시간대(00:00)로 설정되었으므로 사용자의 현지시간대(+09:00)가 적용되어 21:30으로 표시합니다.
    { title:"timeZoneCalendar-event2", start: "2020-06-10T12:30:00+09:00", end: "2020-06-10T13:30:00+09:00", allDay: false }, //UTC 정보가 포함되어 있으므로 날짜와 시간이 그대로 표시합니다.
    { title:"timeZoneCalendar-event3", start: "2020-06-10T12:30:00", end: "2020-06-10T13:30:00", allDay: false }       //UTC 정보가 포함되어 있지 않으므로 현지시간으로 판단하여 그대로 표시합니다.
];

options = {
    timeZone: "UTC",
    
    eventSources: [
         {
               id: "devCalendar",
               events: calendarData
         }
    ]
};
  1. "명명된 시간대(Named Time Zones)"
    -> 명명된 시간대(Named Time Zones)"America/New_York" or "Asia/Seoul"같은 문자열로 지정된 특정 지역입니다. UTC 표준시간대(00:00)와 같이 모호성이 없기 때문에 모든 브라우저에서 일관되게 일정(Event)들을 표시할 수 있습니다.
    -> 사용할 수 있는 명명된 시간대(Named Time Zones) 목록은 (이곳)에서 확인할 수 있습니다.
calendarData = [
    { title:"timeZoneCalendar-event1", start: "2020-06-10T12:30:00Z", end: "2020-06-10T13:30:00Z", allDay: false },      //UTC 정보가 표준시간대(00:00)로 설정되었으므로 사용자의 현지시간대(+09:00)가 적용되어 21:30으로 표시합니다.
    { title:"timeZoneCalendar-event2", start: "2020-06-10T12:30:00+09:00", end: "2020-06-10T13:30:00+09:00", allDay: false }, //UTC 정보가 포함되어 있으므로 날짜와 시간이 그대로 표시합니다.
    { title:"timeZoneCalendar-event3", start: "2020-06-10T12:30:00", end: "2020-06-10T13:30:00", allDay: false }       //UTC 정보가 포함되어 있지 않으므로 현지시간으로 판단하여 그대로 표시합니다.
];

options = {
    timeZone: "Europe/Moscow",
    
    eventSources: [
         {
               id: "devCalendar",
               events: calendarData
         }
    ]
};

Read More

Since

product version desc
core 1.5.0.0 기능 추가