Localization

The library provides two built-in locales:

• English
• Chinese

You can also apply a custom locale.

Default locale

The English locale is applied by default:

// WX core elements
const days = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"];

const months = [
    "January",
    "February",
    "March",
    "April",
    "May",
    "June",
    "July",
    "August",
    "September",
    "October",
    "November",
    "December",
];
const monthsShort = [
    "Jan",
    "Feb",
    "Mar",
    "Apr",
    "May",
    "Jun",
    "Jul",
    "Aug",
    "Sep",
    "Oct",
    "Nov",
    "Dec",
];

const core = { // translations of the WX core elements
    ok: "OK",
    cancel: "Cancel",
    today: "Today",
    clear: "Clear",
    close: "Close",
};

// Gantt

default {
    gantt: {
        // Header / sidebar
        "Task name": "Task name",
        "Start date": "Start date",
        Duration: "Duration",

        // Sidebar
        Save: "Save",
        Delete: "Delete",
        Name: "Name",
        Description: "Description",
        "Select type": "Select type",
        Type: "Type",
        Task: "Task",
        Milestone: "Milestone",
        Project: "Project",
        "End date": "End date",
        Progress: "Progress",
        Predecessors: "Predecessors",
        Successors: "Successors",
        "Add task name": "Add task name",
        "Add description": "Add description",
        "Select link type": "Select link type",
        "End-to-start": "End-to-start",
        "Start-to-start": "Start-to-start",
        "End-to-end": "End-to-end",
        "Start-to-end": "Start-to-end",

        // bars
        "(no title)": "(no title)",

        // Context menu / toolbar
        Add: "Add",
        "Child task": "Child task",
        "Task above": "Task above",
        "Task below": "Task below",
        Convert: "Convert",
        "To Task": "To Task",
        "To Milestone": "To Milestone",
        "To Project": "To Project",
        Edit: "Edit",
        Cut: "Cut",
        Copy: "Copy",
        Paste: "Paste",
        Move: "Move",
        Up: "Up",
        Down: "Down",
        Indent: "Indent",
        Outdent: "Outdent",
        "Split task": "Split task",

        // Toolbar
        "New task": "New task",
        "Move up": "Move up",
        "Move down": "Move down",
    },
};

ch locale

// WX core elements

const days = ["周日", "周一", "周二", "周三", "周四", "周五", "周六"];

const months = [
    "一月",
    "二月",
    "三月",
    "四月",
    "五月",
    "六月",
    "七月",
    "八月",
    "九月",
    "十月",
    "十一月",
    "十二月",
];

const core = {
    today: "今天",
    clear: "清除",
    close: "关闭",
};

// Gantt
gantt: {
        // Header / sidebar
        "Task name": "任务名称",
        "Start date": "开始日期",
        Duration: "期间",

        // Sidebar
        Save: "保存",
        Delete: "删除",
        Name: "名称",
        Description: "描述",
        "Select type": "选择类型",
        Type: "类型",
        Task: "任务",
        Milestone: "里程碑",
        Project: "项目",
        "End date": "结束日期",
        Progress: "进步",
        Predecessors: "前辈",
        Successors: "后继者",
        "Add task name": "添加任务名称",
        "Add description": "添加描述",
        "Select link type": "选择链接类型",
        "End-to-start": "结束开始",
        "Start-to-start": "开始开始",
        "End-to-end": "端到端",
        "Start-to-end": "开始到结束",

        // Context menu / toolbar
        Add: "添加",
        "Child task": "子任务",
        "Task above": "上面的任务",
        "Task below": "下面的任务",
        "Convert to": "转变",
        Task: "到任务",
        Milestone: "到里程碑",
        Project: "项目",
        Edit: "编辑",
        Cut: "切",
        Copy: "复制",
        Paste: "粘贴",
        Move: "移动",
        Up: "向上",
        Down: "下",
        Indent: "缩进",
        Outdent: "凹痕",
        "Split task": "拆分任务",

        // Toolbar
        "New task": "新任务",
        "Move up": "提升",
        "Move down": "下移",
    },

Applying locales

To apply a built-in locale, import the Locale object from "@wx/svelte-core", the locale package from "@wx/core-locales", and a built-in locale from "@wx/gantt-locales", and then add the words attribute for the required language to the Locale tag.

Example:

import { Locale } from "@wx/svelte-core";
import { cn } from "@wx/gantt-locales";
import { cn as cnCore } from "@wx/core-locales";

<Locale words={{ ...cn, ...cnCore }}>

To apply a custom locale, you need to create an object for the custom locale (or modify the existing one) and provide translations for all Gantt text labels (it can be any language you need). You also need to add labels from the core and calendar components ("@wx/core-locales"). Refer to Core localization for more details.

Example for the Korean language:

const ko = {
    gantt: {
        // Header / sidebar
        "Task name": "이름",
        "Start date": "시작일",
         Duration: "지속",
        // other
    },
    core:{ ... },
    calendar: { ... }
};