Localizing Report Manager

By default, all labels in Report Manager are defined in English, but you can provide custom translations for:

  • actions (edit, create a copy, delete, etc.);
  • labels of the buttons;
  • confirmation messages;
  • labels of the dropdown options (Sum, Count, Average, etc.)

The Report Manager widget package includes only en-US locale. Check our Locales repository for the language you need or create your own locale. Feel free to contribute your successful translation.

Locale Structure

Report Manager titles are stored in the following object:

export default {
    "Add column": "Add column",
    "All reports": "All reports",
    "Are you sure to delete this report?": "Are you sure to delete this report?",
    "Are you sure to delete this query?": "Are you sure to delete this query?",
    Average: "Average",
    Cancel: "Cancel",
    Chart: "Chart",
    Column: "Column",
    Columns: "Columns",
    "Color column": "Color column",
    Common: "Common",
    "Copy of": "Copy of",
    Count: "Count",
    "Created on": "Created on",
    Data: "Data",
    "Data source": "Data source",
    Day: "Day",
    Delete: "Delete",
    "Delete report": "Delete report",
    Description: "Description",
    Query: "Query",
    Edit: "Edit",
    "Enter query name": "Enter query name",
    Export: "Export",
    "To Excel": "To Excel",
    "To CSV": "To CSV",
    Filter: "Filter",
    "Filtering query": "Filtering query",
    "Frozen columns above": "Frozen columns above",
    Function: "Function",
    Group: "Group",
    "Group summaries": "Group summaries",
    "Join data": "Join data",
    Heatmap: "Heatmap",
    "Labels column": "Labels column",
    Max: "Max",
    Min: "Min",
    Month: "Month",
    New: "New",
    "Click 'New' button to add a new report":
        "Click 'New' button to add a new report",
    "Select any report from the list": "Select any report from the list",
    "No reports": "No reports",
    "No saved queries": "No saved queries",
    "Last modified": "Last modified",
    "New column name": "New column name",
    "New report": "New report",
    "Please delete the related query filter first":
        "Please delete the related query filter first",
    "Please delete the related group rule first":
        "Please delete the related group rule first",
    Rename: "Rename",
    "Report name": "Report name",
    Reports: "Reports",
    Save: "Save",
    "Save query": "Save query",
    Sort: "Sort",
    "Specify columns to group by and output(s)":
        "Specify columns to group by and output(s)",
    "Specify columns to sort by": "Specify columns to sort by",
    Sum: "Sum",
    Table: "Table",
    Title: "Title",
    "Type to search": "Type to search",
    View: "View",
    Year: "Year",
    //chart
    Axes: "Axes",
    "X Axis": "X Axis",
    "Y Axis": "Y Axis",
    columns: "columns",
    rows: "rows",
    "Data series": "Data series",
    "Chart type": "Chart type",
    "Keys column": "Keys column",
    "X axis column": "X axis column",
    "Values column": "Values column",
    Color: "Color",
    "Marker type": "Marker type",
    "Fill marker": "Fill marker",
    Legend: "Legend",
    "Logarithmic scale": "Logarithmic scale",
    Gridlines: "Gridlines",
    Bottom: "Bottom",
    None: "None",
    Right: "Right",
    Line: "Line",
    Spline: "Spline",
    Area: "Area",
    "Stacked area": "Stacked area",
    "Spline area": "Spline area",
    Bar: "Bar",
    "Stacked bar": "Stacked bar",
    Radar: "Radar",
    Pie: "Pie",
    Donut: "Donut",
    "Create copy": "Create copy",
    circle: "circle",
    square: "square",
    triangle: "triangle",
    diamond: "diamond",
    "no markers": "no markers",
    "Vertical labels": "Vertical labels",
    "Extract series from": "Extract series from",
    True: "True",
    False: "False",
    "Save filter to use it in other reports":
        "Save filter to use it in other reports",
};

Specifying Custom Locale

To change the default locale, you need to perform the following steps:

  • Set custom translations by creating the needed locale (below it is "ru") within the reports.locales object:
// Russian translations
reports.locales.ru = {
    "Add column": "Добавить колонку",
    "All reports": "Все отчеты",
};
  • Define the current locale for Report Manager. For these purposes, set the locale property of Report Manager in its constructor. Note that you need to provide locales for inner Query as well:
 
// set custom translations for report manager
reports.locales.ru = ruLocale;
// set custom translations for inner query
query.locales.ru = ruQueryLocale;
 
// use custom scrolls, optional
if (!webix.env.touch && webix.env.scrollSize) 
  webix.CustomScroll.init();
 
webix.ui({
  view: "reports",
  locale: {
    lang: "ru",
    webix: {
      // switch all webix widgets to the selected locale
      ru: "ru-RU"
    },
  },
  url:"https://docs.webix.com/reports-backend/"
});

Related sample:  Report Manager: Custom Locale

How to Switch Locales at Runtime

You can change languages dynamically, e.g. by clicking related switch buttons in the toolbar.

  • First, set custom translations to the desired labels:
reports.locales.ru = {  
  // Russian locales
};
 
// other languages
  • Switch between languages using Report Manager "locale" service and its setLang method:
{
  view: "segmented",
  options: ["en", "ru"],
  width: 250,
  click: function() {
    const locale = $$("myReports").getService("locale");
    locale.setLang(this.getValue());
  }
}

Related sample:  Report Manager: Switching Locales

How to Synchronize Report Manager and Webix Locale

The built-in labels of Webix components within the Report Manager, as well as date and number localization depend on the current Webix locale in use. To synchronize localizations of Report Manager and Webix, define webix parameter in the locale setting of the Report Manager constructor:

{
  view:"reports",
  url:"https://docs.webix.com/reports-backend/",
  locale: {
    lang: "en",
    webix: {
      // switch Webix the selected locale
      en: "en-US",
      ru: "ru-RU"
    }
  }
}
Back to top