CanvasJS supports localization of various culture/language/country specific elements in the StockChart like number formatting style – where you can choose which character to use as a decimal separator or as a digit group separator (also referred to as a thousand separator). It also allows you to localize text inside UI elements such as “Save as PNG”, “Save as JPG”, “Print”. By default CanvasJS is set to Neutral English Culture – “en”.
Default: “en”To support other cultures, you can add a new cultureInfo object that defines the parameter that needs to be customized. Cultures that are added using cultureInfo object are global and hence can be used by all the StockCharts available within a page.
CanvasJS.addCultureInfo("es", { decimalSeparator: ".", digitGroupSeparator: ",", days: ["domingo", "lunes", "martes", "miércoles", "jueves", "viernes", "sábado"], });
Using the newly added cultureInfo object in StockChart.
var stockChart = new CanvasJS.StockChart("container", { . . culture: "es", . . }); stockChart.render();
Applies To | Attribute | Type | Default | Options/Examples | Remark |
---|---|---|---|---|---|
cultureInfo | decimalSeparator | String | “.” | “. “, ”,” | Character used to separate fractional part from the whole number. |
cultureInfo | digitGroupSeparator | String | “,” | “,”, “.” | Also referred to as Thousand Separator. |
cultureInfo | zoomText | String | “Zoom” | “zoom”, … | Text is shown inside the Button till v1.4. v1.5 onwards Text is shown as tooltip. |
cultureInfo | panText | String | “Pan” | “pan”, … | Text is shown inside the Button till v1.4. v1.5 onwards Text is shown as tooltip. |
cultureInfo | resetText | String | “Reset” | “reset”, … | Text is shown inside the Button till v1.4. v1.5 onwards Text is shown as tooltip. |
cultureInfo | savePNGText | String | “Save as PNG” | “save as png”, … | Set text is shown instead of Save as PNG. |
cultureInfo | saveJPGText | String | “Save as JPG” | “save as jpg”, … | Set text is shown instead of Save as JPG. |
cultureInfo | printText | String | “Print” | “print chart”, … | Set text is shown instead of Print. |
cultureInfo | menuText | String | “More Options” | “more options”, … | Tool Tip for Menu Button. |
cultureInfo | days | Array of strings | [“Sunday”, “Monday”, “Tuesday”, “Wednesday”, “Thursday”, “Friday”, “Saturday”] | [“domingo”, “lunes”, “martes”, “miércoles”, “jueves”, “viernes”, “sábado”] | Day names starting from Sunday. Should be exactly 7 in total. |
cultureInfo | shortDays | Array of strings | [“Sun”, “Mon”, “Tue”, “Wed”, “Thu”, “Fri”, “Sat”] | Short Day names starting from Sunday. Should be exactly 7 in total. | |
cultureInfo | months | Array of strings | [“January”, “February”, “March”, “April”, “May”, “June”, “July”, “August”, “September”, “October”, “November”, “December”] | Custom Months Array | Month Names starting from January |
cultureInfo | shortMonths | Array of String | [“Jan”, “Feb”, “Mar”, “Apr”, “May”, “Jun”, “Jul”, “Aug”, “Sep”, “Oct”, “Nov”, “Dec”] | Custom Short Days Array | Short Month Names starting from January |
cultureInfo | rangeSelector | Object | {rangeText: “Range”, fromText: “From”, toText: “To”} | {rangeText: “Rango”, fromText: “De”, toText: “A”} | Set text will be shown instead of Range, From & To. |
rangeSelector | rangeText | String | “Range” | “Rango”, “Range”,… | Set text will be shown instead of Range. |
rangeSelector | fromText | String | “From” | “De”, “From”,… | Set text will be shown instead of From. |
rangeSelector | toText | String | “To” | “A”, “To”,… | Set text will be shown instead of To. |
Below is an example showing how to display month name in spanish.
Also See: