jQuery Chart Localization

There are several ways to localize various chart labels specifically for your culture.

One way to override the default localization settings is by loading a specific culture from the Globalize javascript library as shown in the example below. Note that you do not have to load any other files such as the Globalize core, because it is already included in the Chart bundle.

Note that the newest version of Globalize does not contain any culture data, so make sure to download the the bundle including the cultures from the link above.

<!DOCTYPE html>
<html>
<head>
<title>Shield Chart</title>
<meta charset="utf-8" />

<link rel="stylesheet" type="text/css" href="css/shieldchart.css" />
<script src="js/jquery-1.9.1.min.js" type="text/javascript">//</script>
<script src="js/shield-chart.all.min.js" type="text/javascript">//</script>

<script src="globalize.culture.de.js" type="text/javascript">//</script>

</head>
<body>

<div id="container" style="width:600px; height:400px;"></div>

<script type="text/javascript">
$(document).ready(function () {
    // set a German Globalize culture
	Globalize.culture("de");

	$("#container").shieldChart({
		tooltipSettings: {
            // make the tooltip display the Y value as a currency
			customPointText: '{point.y:c}'
		},
		dataSeries: [
			{
				seriesType: 'pie',
				data: [1, 3, 4, 5]
			}
		]
	});
});
</script>

</body>
</html>

This will cause all numbers, currencies and dates to be formatted and displayed in accordance with the specific culture.