Having trouble getting help?
Contact Support
Contact Support
Localization
28 Feb 20224 minutes to read
Localization library allows to localize the default text content of Chart. In Chart component, it has the static text on some features(like zooming toolbars) and this can be changed to any other culture(Arabic, Deutsch, French, etc) by defining the locale value and translation object.
Locale key words | Text to display |
Zoom | Zoom |
ZoomIn | ZoomIn |
ZoomOut | ZoomOut |
Reset | Reset |
Pan | Pan |
ResetZoom | Reset Zoom |
To load translation object in an application use load function of L10n class.
For more information about localization, refer this localization
@Html.EJS().Chart("container").Locale("fr-FR").Series(series =>
{
series.Type(Syncfusion.EJ2.Charts.ChartSeriesType.Column)
.Width(2)
.XName("x").YName("y")
.DataSource("series1")
.Name("Germany").Add();
}).PrimaryXAxis(px => px.ValueType(Syncfusion.EJ2.Charts.ValueType.DateTime)
.Skeleton("yMMM")
).PrimaryYAxis(py => py.RangePadding(Syncfusion.EJ2.Charts.ChartRangePadding.None)
).Title("Inflation - Consumer Price")
.ZoomSettings(z => z.EnableMouseWheelZooming(true).
EnablePinchZooming(true).EnableSelectionZooming(true).
Mode(Syncfusion.EJ2.Charts.ZoomMode.X)
).Render()
<script>
var series1 = [];
var point1;
var value = 80;
var i;
for (i = 1; i < 100; i++) {
if (Math.random() > 0.5) {
value += Math.random();
}
else {
value -= Math.random();
}
point1 = { x: new Date(1950, i + 2, i), y: value.toFixed(1) };
series1.push(point1);
}
ej.base.L10n.load({
"fr-FR": {
"chart": {
"ZoomIn": "Zoom +",
"ZoomOut": "Zoom -",
"Pan": "Se déplacer",
"Reset": "Réinitialiser"
}
}
});
ej.base.setCulture("fr-FR");
</script>
public ActionResult Index()
{
List<InternalChartData> chartData = new List<InternalChartData>
{
new InternalChartData{ x= 1900, y= 4, y1= 2.6 },
new InternalChartData{ x= 1920, y= 3.0, y1= 2.8 },
new InternalChartData{ x= 1940, y= 3.8, y1= 2.6},
new InternalChartData{ x= 1960, y= 3.4, y1= 3 },
new InternalChartData{ x= 1980, y= 3.2, y1= 3.6 },
new InternalChartData{ x= 2000, y= 3.9, y1= 3 }
};
ViewBag.dataSource = chartData;
return View();
}
public class InternalChartData
{
public double x;
public double y;
public double y1;
}