```javascript // some default values ommited for brevity. you can always see them in 'TsGanttOptions' source code useShadowDom = false; // render chart using shadow DOM multilineSelection = true; // allow multiple rows to be selected at the same time useCtrlKeyForMultilineSelection = false; // enable using ctrl key to select multiple rows drawTodayLine = true; // draw a vertical line on chart that represents today highlightRowsDependingOnTaskState = true; // change row text color depending on task state separatorWidthPx = 5; // vertical central line width headerHeightPx = 90; // lower values are not recommended, but you can still try rowHeightPx = 40; // lower values are not recommended, but you can still try borderWidthPx = 1; barStrokeWidthPx = 2; barMarginPx = 2; barCornerRadiusPx = 6; // special row symbols. you can also use some HTML code rowSymbols: TsGanttRowSymbols = {childless: "◆", collapsed: "⬘", expanded: "⬙"}; chartShowProgress = true; // indicating progress percentage on chart bar using different color chartDisplayMode: "planned" | "actual" | "both"; chartScale: "day" | "week" | "month" | "year"; // optimal spare space on timeline edges in days chartDateOffsetDays: {[key: string]: number} = {"day": 14, "week": 60, "month": 240, "year": 730}; // minimal spare space on timeline edges in days // chart timeline is redrawn only when trespassing minimal distance to chart edge to nearest bar chartDateOffsetDaysMin: {[key: string]: number} = {"day": 7, "week": 30, "month": 120, "year": 365}; // width of 1 day on timeline. not recommended to use lower values than default chartDayWidthPx: {[key: string]: number} = {"day": 60, "week": 20, "month": 3, "year": 1}; locale = "en"; // default locale localeDecimalSeparator: {[key: string]: string} = {en: ".", uk: ",", ru: ",", ja: "."}; // you can provide any format strings that are supported by dayjs localeDateFormat: {[key: string]: string} = {en: "MM/DD/YYYY", uk: "DD.MM.YYYY", ru: "DD.MM.YYYY", ja: "YYYY/MM/DD"}; localeFirstWeekDay: {[key: string]: number} = {en: 0, uk: 1, ru: 1, ja: 0}; // Sunday is 0 localeDateMonths: {[key: string]: string[]}; // array of 12 string values for each locale. eg ["January", "February", ...etc] localeDateDays: {[key: string]: string[]}; // array of 7 string values for each locale. eg ["Sunday", "Monday", ...etc] localeDateDaysShort: {[key: string]: string[]}; // array of 7 string values for each locale. eg ["Su", "Mo", ...etc] localeDateScale: {[key: string]: string[]}; // array of 3 string values for each locale. eg ["Weeks", "Months", "Years"] localeDurationFormatters: {[key: string]: (duration: number) => string}; // duration formatter function for each locale // Data columns setup. // there are default 8 columns: "Name", "Progress", "Start date planned", "End date planned", // "Start date actual", "End date actual", "Duration planned", "Duration actual". // You can remove the columns or add your own ones, but you need too make sure to edit all of the following arrays respectively: // you should provide a width, an alignment, a value getter, and localized headers. // !!!the length of each column-related array should be equal to the columns count!!! columnsMinWidthPx: number[]; // array of numeric values, one for each of the columns. 0 to disable column columnsContentAlign: ("start" | "center" | "end")[]; // array of values, one for each of the columns // default column value getters return localized values by taking into account all the properties assigned above // but you can provide your own ones if you need more complex output // returned value is assigned to cell's innerHTML property. so you can use html tags columnValueGetters: ((a: TsGanttTask) => string)[]; // array of string value getters for each locale // column header locales should be provided for all the locales intended for use localeHeaders: {[key: string]: string[]}; // array of string values for each locale // taskComparer: (taskA: TsGanttTask, taskB: TsGanttTask) => number; // you can provide here your custom task comparer enableChartEdit = false; // (experimental) allows making changes to tasks by dragging chart bar handles // all the task models including the changed ones can be returned to your code using the TsGantt.tasks property getter ```